refactor: 인증 관련 라우트 및 컴포넌트 제거, 난이도 이미지 선택 로직 수정

Author: minsgy

src/routeTree.gen.ts

@@ -9,7 +9,6 @@
 // Additionally, you should also exclude this file from your linter and/or formatter to prevent it from being checked or modified.
 
 import { Route as rootRouteImport } from './routes/__root'
-import { Route as AuthenticatedRouteImport } from './routes/_authenticated'
 import { Route as MissionRouteRouteImport } from './routes/mission/route'
 import { Route as IndexRouteImport } from './routes/index'
 import { Route as MyIndexRouteImport } from './routes/my/index'
@@ -22,10 +21,6 @@ import { Route as MissionMissionIdIndexRouteImport } from './routes/mission/$mis
 import { Route as MissionMissionIdSuccessIndexRouteImport } from './routes/mission/$missionId/success/index'
 import { Route as MissionMissionIdFailedIndexRouteImport } from './routes/mission/$missionId/failed/index'
 
-const AuthenticatedRoute = AuthenticatedRouteImport.update({
-  id: '/_authenticated',
-  getParentRoute: () => rootRouteImport,
-} as any)
 const MissionRouteRoute = MissionRouteRouteImport.update({
   id: '/mission',
   path: '/mission',
@@ -113,7 +108,6 @@ export interface FileRoutesById {
   __root__: typeof rootRouteImport
   '/': typeof IndexRoute
   '/mission': typeof MissionRouteRouteWithChildren
-  '/_authenticated': typeof AuthenticatedRoute
   '/mission/': typeof MissionIndexRoute
   '/my/': typeof MyIndexRoute
   '/mission/$missionId/': typeof MissionMissionIdIndexRoute
@@ -154,7 +148,6 @@ export interface FileRouteTypes {
     | '__root__'
     | '/'
     | '/mission'
-    | '/_authenticated'
     | '/mission/'
     | '/my/'
     | '/mission/$missionId/'
@@ -169,7 +162,6 @@ export interface FileRouteTypes {
 export interface RootRouteChildren {
   IndexRoute: typeof IndexRoute
   MissionRouteRoute: typeof MissionRouteRouteWithChildren
-  AuthenticatedRoute: typeof AuthenticatedRoute
   MyIndexRoute: typeof MyIndexRoute
   Oauth2RedirectIndexRoute: typeof Oauth2RedirectIndexRoute
   OnboardingGymIndexRoute: typeof OnboardingGymIndexRoute
@@ -179,13 +171,6 @@ export interface RootRouteChildren {
 
 declare module '@tanstack/react-router' {
   interface FileRoutesByPath {
-    '/_authenticated': {
-      id: '/_authenticated'
-      path: ''
-      fullPath: ''
-      preLoaderRoute: typeof AuthenticatedRouteImport
-      parentRoute: typeof rootRouteImport
-    }
     '/mission': {
       id: '/mission'
       path: '/mission'
@@ -287,7 +272,6 @@ const MissionRouteRouteWithChildren = MissionRouteRoute._addFileChildren(
 const rootRouteChildren: RootRouteChildren = {
   IndexRoute: IndexRoute,
   MissionRouteRoute: MissionRouteRouteWithChildren,
-  AuthenticatedRoute: AuthenticatedRoute,
   MyIndexRoute: MyIndexRoute,
   Oauth2RedirectIndexRoute: Oauth2RedirectIndexRoute,
   OnboardingGymIndexRoute: OnboardingGymIndexRoute,

src/routes/_authenticated.tsx

@@ -213,7 +213,8 @@ export const VideoDetailSwiper = ({
         {items.map((item, index) => {
           const isActive = index === activeIndex;
           const isDownloading = downloadingIndex === index;
-          const difficultyImageUrl = sample(item.gymLevelImageUrls);
+          const difficultyImageUrl =
+            item.gymLevelImageUrls[index % item.gymLevelImageUrls.length];
           return (
             <SwiperSlide key={`video-detail-slide-${item.id}`}>
               <div className="relative w-full h-dvh">

src/routes/my/-components/VideoDetailSwiper.tsx

@@ -161,7 +161,8 @@ function RouteComponent() {
           <div className="grid grid-cols-2 gap-x-2 gap-y-3 px-4">
             {flatItems.map((item, index) => {
               const key = `video-card-${index}`;
-              const selectedDifficulty = sample(item.gymLevelImageUrls);
+              const selectedDifficulty =
+                item.gymLevelImageUrls[index % item.gymLevelImageUrls.length];
               return (
                 <VideoCard
                   key={key}

src/routes/my/index.tsx

@@ -1,4 +1,6 @@
-import { QueryClient } from "@tanstack/react-query";
+import { QueryCache, QueryClient } from "@tanstack/react-query";
+import { AxiosError } from "axios";
+import { router } from "@/router";
 
 export const customQueryClient = new QueryClient({
   defaultOptions: {
@@ -7,4 +9,19 @@ export const customQueryClient = new QueryClient({
       retry: 0,
     },
   },
+  queryCache: new QueryCache({
+    onError: (error) => {
+      if (error instanceof AxiosError) {
+        if (error.response?.status === 401) {
+          router.navigate({ to: "/" });
+        }
+        if (error.response?.status === 302) {
+          router.navigate({ to: "/" });
+        }
+        if (!error.response?.data) {
+          router.navigate({ to: "/" });
+        }
+      }
+    },
+  }),
 });