feat/#50: 자녀의 부모 조회 api mocking 구현 및 연결

SolSolHigh · Aug 27, 2024 · 2decf34 · 2decf34
1 parent f3e274b
commit 2decf34
Show file tree

Hide file tree

Showing 5 changed files with 48 additions and 8 deletions.
diff --git a/ssh-web/src/apis/userApi.ts b/ssh-web/src/apis/userApi.ts
@@ -1,4 +1,9 @@
-import { IChild, ISignupRequest, IUserInfo } from '../interfaces/userInterface';
+import {
+  IChild,
+  IParent,
+  ISignupRequest,
+  IUserInfo,
+} from '../interfaces/userInterface';
 import { api } from './interceptors';
 
 export const checkSession = async () => {
@@ -20,3 +25,7 @@ export const getUserInfo = () => {
 export const getMyChildren = () => {
   return api.get<IChild[]>('/api/parents/childrens');
 };
+
+export const getMyParents = () => {
+  return api.get<IParent>('/api/children/parents');
+};
diff --git a/ssh-web/src/components/molecules/InfoList/index.tsx b/ssh-web/src/components/molecules/InfoList/index.tsx
@@ -91,10 +91,10 @@ export const InfoList = ({
             >
               <Typography color="dark" weight="semibold" size="sm">
                 {mascotType === 'PARENT'
-                  ? '아직 연결해주신 부모님이 없어요!'
-                  : '아직 연결된 자녀가 없어요!'}
+                  ? '아직 연결된 자녀가 없어요!'
+                  : '아직 연결해주신 부모님이 없어요!'}
               </Typography>
-              {mascotType === 'CHILD' && (
+              {mascotType === 'PARENT' && (
                 <Button size="sm">자녀 초대하기</Button>
               )}
             </div>

diff --git a/ssh-web/src/interfaces/userInterface.ts b/ssh-web/src/interfaces/userInterface.ts
@@ -48,3 +48,10 @@ export interface IChild {
   birthday: string;
   gender: string;
 }
+
+export interface IParent {
+  name: string;
+  nickname: string;
+  birthday: string;
+  gender: string;
+}
diff --git a/ssh-web/src/mocks/index.ts b/ssh-web/src/mocks/index.ts
@@ -501,4 +501,20 @@ mock.onGet('/api/parents/childrens').reply((config) => {
   });
 });
 
+mock.onGet('/api/children/parents').reply((config) => {
+  return new Promise((resolve) => {
+    setTimeout(() => {
+      resolve([
+        200,
+        {
+          name: '부모님',
+          nickname: '부모님닉네임',
+          birthday: '1970-03-13',
+          gender: 'M',
+        },
+      ]);
+    }, 500);
+  });
+});
+
 // ========== 사용자 도메인 ==========
diff --git a/ssh-web/src/pages/Information/InformationFetch.tsx b/ssh-web/src/pages/Information/InformationFetch.tsx
@@ -4,7 +4,7 @@ import { CircularImage } from '../../components/atoms/CircularImage';
 import { Mascot } from '../../components/molecules/Mascot';
 import { InfoList } from '../../components/molecules/InfoList';
 import { useSuspenseQuery } from '@tanstack/react-query';
-import { getMyChildren, getUserInfo } from '../../apis/userApi';
+import { getMyChildren, getMyParents, getUserInfo } from '../../apis/userApi';
 import { getImgSrc } from '../../utils/userUtil';
 import dayjs from 'dayjs';
 import { IChild, IUserInfoMascot } from '../../interfaces/userInterface';
@@ -38,6 +38,16 @@ export const InformationFetch = () => {
           });
         })
         .catch((err) => console.log(err));
+    } else {
+      getMyParents().then((res) => {
+        setRelated(() => {
+          const newUserInfoMascot: IUserInfoMascot = {
+            src: getImgSrc(res.data.gender, 'PARENT'),
+            label: res.data.nickname,
+          };
+          return [newUserInfoMascot];
+        });
+      });
     }
   }, []);
 
@@ -81,9 +91,7 @@ export const InformationFetch = () => {
           type="mascot"
           title={`${userinfoQuery.data.data.type === 'PARENT' ? '자녀' : '부모'} 정보`}
           mascots={related}
-          mascotType={
-            userinfoQuery.data.data.type === 'PARENT' ? '자녀' : '부모'
-          }
+          mascotType={userinfoQuery.data.data.type}
           hasMore={userinfoQuery.data.data.type === 'PARENT'}
         />
       </div>