CCC-org · ysh4296 · Jul 14, 2023 · Jul 14, 2023
diff --git a/src/screens/Main/mypage/MyPageScreen.tsx b/src/screens/Main/mypage/MyPageScreen.tsx
@@ -6,7 +6,7 @@ import MypageTitle from '../../../components/title/MypageTitle';
 import DividerBar from '../../../components/bars/DividerBar';
 import InterestIcon from './InterestIcon';
 import { useQuery, useQueryClient } from '@tanstack/react-query';
-import { MypageAPI, MypageQueryKeys, TabInfo } from '../../../utils/api/mypageAPI';
+import { MypageAPI, MypageQueryKeys } from '../../../utils/api/mypageAPI';
 import { querySuccessError } from '../../../utils/helper/queryReponse/querySuccessError';
 import FolderOption from './FolderOption';
 import { useInfiniteFeed } from '../../../utils/hooks/feedInifiniteScroll/useInfiniteFeed';
@@ -45,19 +45,16 @@ const MyPageScreen = ({ navigation, route }) => {
   const { data: profile, isLoading: isProfileLoading } = useQuery({
     queryKey: MypageQueryKeys.getProfile({ targetId: userId }),
     queryFn: () => MypageAPI.getProfile({ targetId: userId }),
-    refetchInterval: 1000 * 120,
   });
 
   const { data: representativeTitles, isLoading: isrepresentativeTitlesLoading } = useQuery(
     MypageQueryKeys.getRepresentativeTitles({ userId: userId }),
     () => MypageAPI.getRepresentativeTitles({ userId: userId }),
-    querySuccessError,
   );
 
   const { data: userFolderList, isLoading: isUserFolderListLoading } = useQuery(
     MypageQueryKeys.getFolderList({ userId: userId }),
     () => MypageAPI.getModifiedFolderList({ userId: userId }),
-    querySuccessError,
   );
 
   useLayoutEffect(() => {
@@ -132,7 +129,7 @@ const MyPageScreen = ({ navigation, route }) => {
     isProfileLoading ||
     isrepresentativeTitlesLoading ||
     isUserFolderListLoading ||
-    !userFolderList.tabs
+    !userFolderList?.tabs
   ) {
     return <MainLottie />;
   }

diff --git a/src/screens/Main/mypage/ProfilePageFolderSection.tsx b/src/screens/Main/mypage/ProfilePageFolderSection.tsx
@@ -5,10 +5,9 @@ import FolderOption from './FolderOption';
 import FeedList from '../../Feed/FeedList';
 import { useTheme } from 'react-native-paper';
 import { InfiniteData, QueryClient, UseMutateFunction } from '@tanstack/react-query';
-import MainLottie from '../../../components/lotties/MainLottie';
 
 interface ProfilePageFolderSectionProps {
-  userFolderList: any;
+  userFolderList?: TabInfo;
   handleFolderOption: (tabId: number) => void;
   feedList: InfiniteData<InsightData[] | undefined> | undefined;
   feedListQueryClient: QueryClient;
@@ -41,7 +40,7 @@ const ProfilePageFolderSection = ({
         contentContainerStyle={styles.group}
         showsHorizontalScrollIndicator={false}
       >
-        {userFolderList.tabs.map((cur, idx) => {
+        {userFolderList?.tabs.map((cur, idx) => {
           return (
             <FolderOption
               key={idx}

diff --git a/src/screens/Main/mypage/ProfileScreen.tsx b/src/screens/Main/mypage/ProfileScreen.tsx
@@ -7,7 +7,7 @@ import MypageTitle from '../../../components/title/MypageTitle';
 import DividerBar from '../../../components/bars/DividerBar';
 import InterestIcon from './InterestIcon';
 import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
-import { MypageAPI, MypageQueryKeys, TabInfo } from '../../../utils/api/mypageAPI';
+import { MypageAPI, MypageQueryKeys } from '../../../utils/api/mypageAPI';
 import { querySuccessError } from '../../../utils/helper/queryReponse/querySuccessError';
 import FolderOption from './FolderOption';
 import { useInfiniteFeed } from '../../../utils/hooks/feedInifiniteScroll/useInfiniteFeed';
@@ -44,21 +44,19 @@ const ProfileScreen = ({ navigation, route }) => {
   const [challengeInterest, setChallengeInterest] = useState<string>('');
 
   // Erased onSetteled: querySuccessError fn.
-  const { data: profile, isLoading: isProfileLoading } = useQuery({
-    queryKey: MypageQueryKeys.getProfile({ targetId: userId }),
-    queryFn: () => MypageAPI.getProfile({ targetId: userId, insightId }),
-  });
+  const { data: profile, isLoading: isProfileLoading } = useQuery(
+    MypageQueryKeys.getProfile({ targetId: userId }),
+    () => MypageAPI.getProfile({ targetId: userId, insightId }),
+  );
 
   const { data: representativeTitles, isLoading: isrepresentativeTitlesLoading } = useQuery(
     MypageQueryKeys.getRepresentativeTitles({ userId: userId }),
     () => MypageAPI.getRepresentativeTitles({ userId: userId }),
-    querySuccessError,
   );
 
   const { data: userFolderList, isLoading: isUserFolderListLoading } = useQuery(
     MypageQueryKeys.getFolderList({ userId: userId }),
     () => MypageAPI.getModifiedFolderList({ userId: userId }),
-    querySuccessError,
   );
 
   useEffect(() => {
@@ -84,9 +82,9 @@ const ProfileScreen = ({ navigation, route }) => {
   }, []);
 
   const drawerId =
-    isUserFolderListLoading === true || userFolderList.selectedTab.id === 0
+    isUserFolderListLoading === true || userFolderList?.selectedTab.id === 0
       ? ''
-      : String(userFolderList.selectedTab.id);
+      : String(userFolderList?.selectedTab.id);
   const { feedList, feedListIsLoading, touchBookMark, fetchNextPage, feedListQueryClient } =
     useInfiniteFeed(
       'https://api-keewe.com/api/v1/insight/my-page/' + userId + '?drawerId=' + drawerId,

diff --git a/src/screens/detailedPost/DetailedPostScreen.tsx b/src/screens/detailedPost/DetailedPostScreen.tsx
@@ -96,7 +96,6 @@ const DetailedPostScreen = ({ navigation, route }) => {
   const { data: insightResponse, isLoading: isInsightLoading } = useQuery(
     InsightQueryKeys.getInsight({ insightId }),
     () => InsightAPI.getInsight({ insightId }),
-    querySuccessError,
   );
 
   const { data: getCommentResponse, isLoading: isCommentLoading } = useQuery(
@@ -142,7 +141,7 @@ const DetailedPostScreen = ({ navigation, route }) => {
             </Pressable>
             <FeedVerticalDots
               contents={insightResponse?.data?.contents ?? ''}
-              link={removeEscapeSequences(insightResponse?.data?.link.url)}
+              link={removeEscapeSequences(insightResponse?.data?.link.url ?? '')}
               userName={profile?.data?.nickname}
               nickname={profile?.data?.nickname}
               userId={profile?.data?.authorId}
@@ -184,7 +183,7 @@ const DetailedPostScreen = ({ navigation, route }) => {
           alwaysBounceVertical={false}
           style={{ paddingBottom: '100%', marginBottom: 70 }}
         >
-          {!isInsightLoading ? (
+          {!isInsightLoading && insightResponse ? (
             <DetailedPostSection
               isProfileLoading={isProfileLoading}
               isInsightLoading={isInsightLoading}
@@ -194,7 +193,7 @@ const DetailedPostScreen = ({ navigation, route }) => {
               url={insightResponse?.data?.link?.url ?? ''}
               currentChallenge={getChallengeRecordResponse?.data?.challengeName}
               contents={insightResponse?.data?.contents}
-              reaction={insightResponse.data.reaction}
+              reaction={insightResponse?.data?.reaction}
               authorId={profile?.data?.authorId ?? -1}
               recordText={recordText}
               userName={profile?.data?.nickname ?? ''}

diff --git a/src/types/mypage.d.ts b/src/types/mypage.d.ts
@@ -56,3 +56,16 @@ interface FolderData {
   id: number;
   name: string;
 }
+
+interface TabInfo {
+  tabs: {
+    isClicked: boolean;
+    id: number;
+    name: string;
+  }[];
+  selectedTab: {
+    isClicked: boolean;
+    id: number;
+    name: string;
+  };
+}
diff --git a/src/utils/api/mypageAPI.ts b/src/utils/api/mypageAPI.ts
@@ -39,6 +39,7 @@ export const MypageAPI = {
       return data;
     } catch (err) {
       console.error('api error2: ', err);
+      throw err;
     }
   },
   getRepresentativeTitles: async (request: RepresentativeTitlesGetRequest) => {
@@ -47,10 +48,10 @@ export const MypageAPI = {
       const { data } = await httpClient.get<RepresentativeTitlesGetResponse>(
         `https://api-keewe.com/api/v1/user/profile/achieved-title/${userId}`,
       );
-
       return data;
     } catch (err) {
       console.error('api error2: ', err);
+      throw err;
     }
   },
   getFolderList: async (request: UserFolderListGetRequest) => {
@@ -79,27 +80,13 @@ export const MypageAPI = {
     return MypageAPI.getFolderList(request)
       .then(modifyData)
       .catch((err) => {
-        console.error('getModifiedFolderList: ', err);
+        throw err; // 에러를 다시 던집니다.
       });
   },
 };
 
-export interface TabInfo {
-  tabs: {
-    isClicked: boolean;
-    id: number;
-    name: string;
-  }[];
-  selectedTab: {
-    isClicked: boolean;
-    id: number;
-    name: string;
-  };
-}
-
-export function modifyData(data: UserFolderListGetResponse['data'] | undefined): TabInfo {
-  // base case 1: data가 없을 때 or data가 undefined일때
-  if (!data?.length || data === undefined)
+function modifyData(data: UserFolderListGetResponse['data'] | null): TabInfo {
+  if (!data?.length || data === null)
     return { tabs: [], selectedTab: { isClicked: false, id: 0, name: '' } };
 
   const mappedData = data.map((data) => {

diff --git a/src/utils/helper/queryReponse/querySuccessError.ts b/src/utils/helper/queryReponse/querySuccessError.ts
@@ -1,5 +1,7 @@
 export const querySuccessError = {
-  onSuccess: (response) => {},
+  onSuccess: (response) => {
+    return;
+  },
   onError: (e) => {
     console.log('error', e);
   },