swipeable tabs use url

src/app/routes/_authed/profile.$playerId.tsx

@@ -2,8 +2,14 @@ import Page from "@/components/page";
 import Profile from "@/features/players/components/profile";
 import { playerQueries } from "@/features/players/queries";
 import { redirect, createFileRoute } from "@tanstack/react-router";
+import { z } from "zod";
+
+const searchSchema = z.object({
+  tab: z.string().optional(),
+});
 
 export const Route = createFileRoute("/_authed/profile/$playerId")({
+  validateSearch: searchSchema,
   beforeLoad: async ({ params, context }) => {
     const { queryClient } = context;
     const player = await queryClient.ensureQueryData(playerQueries.details(params.playerId))

src/app/routes/_authed/teams.$teamId.tsx

@@ -2,8 +2,14 @@ import Page from "@/components/page";
 import TeamProfile from "@/features/teams/components/team-profile";
 import { teamQueries } from "@/features/teams/queries";
 import { redirect, createFileRoute } from "@tanstack/react-router";
+import { z } from "zod";
+
+const searchSchema = z.object({
+  tab: z.string().optional(),
+});
 
 export const Route = createFileRoute("/_authed/teams/$teamId")({
+  validateSearch: searchSchema,
   beforeLoad: async ({ params, context }) => {
     const { queryClient } = context;
     const team = await queryClient.ensureQueryData(teamQueries.details(params.teamId))

src/app/routes/_authed/tournaments/$tournamentId.tsx

@@ -10,8 +10,14 @@ import TeamList from '@/features/teams/components/team-list';
 import Button from '@/components/button';
 import Avatar from '@/components/avatar';
 import Profile from '@/features/tournaments/components/profile';
+import { z } from "zod";
+
+const searchSchema = z.object({
+  tab: z.string().optional(),
+});
 
 export const Route = createFileRoute('/_authed/tournaments/$tournamentId')({
+  validateSearch: searchSchema,
   beforeLoad: async ({ context, params }) => {
     const { queryClient } = context;
     await queryClient.ensureQueryData(tournamentQueries.details(params.tournamentId))