anifriends · sukvvon · Jan 16, 2024 · Dec 20, 2023 · Dec 20, 2023 · Dec 20, 2023
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -1,4 +1,4 @@
 module.exports = {
   root: true,
-  extends: ['custom'],
+  extends: ['anifriends'],
 };
diff --git a/.prettierrc b/.prettierrc
@@ -0,0 +1,14 @@
+{
+  "arrowParens": "always",
+  "bracketSameLine": false,
+  "bracketSpacing": true,
+  "endOfLine": "auto",
+  "jsxSingleQuote": false,
+  "printWidth": 80,
+  "semi": true,
+  "singleAttributePerLine": false,
+  "singleQuote": true,
+  "tabWidth": 2,
+  "trailingComma": "all",
+  "useTabs": false
+}
diff --git a/.prettierrc.cjs b/.prettierrc.cjs
diff --git a/.vscode/extensions.json b/.vscode/extensions.json
@@ -0,0 +1,8 @@
+{
+  "recommendations": [
+    "dbaeumer.vscode-eslint",
+    "esbenp.prettier-vscode",
+    "eamodio.gitlens",
+    "formulahendry.auto-rename-tag"
+  ]
+}
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -5,6 +5,6 @@
     }
   ],
   "editor.codeActionsOnSave": {
-    "source.fixAll": true
+    "source.fixAll": "explicit"
   }
 }
diff --git a/apps/shelter/.eslintrc.cjs b/apps/shelter/.eslintrc.cjs
@@ -1,4 +1,4 @@
 module.exports = {
   root: true,
-  extends: ["custom"],
+  extends: ['anifriends'],
 };
diff --git a/apps/shelter/index.html b/apps/shelter/index.html
@@ -2,7 +2,7 @@
 <html lang="ko">
   <head>
     <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <link rel="icon" href="/favicon.ico" />
     <link
       rel="preload"
       href="https://cdn.jsdelivr.net/gh/projectnoonnu/[email protected]/IBMPlexSansKR-Regular.woff"
@@ -11,7 +11,7 @@
       crossorigin="anonymous"
     />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>보호소 어플리케이션</title>
+    <title>Anifriends</title>
   </head>
   <body>
     <div id="root"></div>

diff --git a/apps/shelter/package.json b/apps/shelter/package.json
@@ -10,11 +10,21 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "@anifriends/apis": "workspace:*",
+    "@anifriends/assets": "workspace:*",
+    "@anifriends/components": "workspace:*",
+    "@anifriends/constants": "workspace:*",
+    "@anifriends/fonts": "workspace:*",
+    "@anifriends/hooks": "workspace:*",
+    "@anifriends/icons": "workspace:*",
+    "@anifriends/layout": "workspace:*",
+    "@anifriends/store": "workspace:*",
+    "@anifriends/theme": "workspace:*",
+    "@anifriends/utils": "workspace:*",
     "@chakra-ui/react": "^2.8.1",
     "@emotion/react": "^11.11.1",
     "@emotion/styled": "^11.11.0",
     "@hookform/resolvers": "^3.3.2",
-    "@lukemorales/query-key-factory": "^1.3.2",
     "@tanstack/react-query": "^5.4.3",
     "@tanstack/react-query-devtools": "^5.4.3",
     "axios": "^1.6.0",
@@ -24,19 +34,19 @@
     "react-error-boundary": "^4.0.11",
     "react-hook-form": "^7.47.0",
     "react-router-dom": "^6.17.0",
-    "shared": "workspace:*",
     "zod": "^3.22.4",
     "zustand": "^4.4.4"
   },
   "devDependencies": {
+    "@anifriends/tsconfig": "workspace:*",
+    "@anifriends/types": "workspace:*",
     "@types/node": "^20.8.10",
     "@types/react": "^18.2.15",
     "@types/react-dom": "^18.2.7",
     "@vitejs/plugin-react-swc": "^3.4.0",
     "eslint": "^8.45.0",
-    "eslint-config-custom": "workspace:*",
+    "eslint-config-anifriends": "workspace:*",
     "msw": "^2.0.1",
-    "tsconfig": "workspace:*",
     "typescript": "^5.0.2",
     "vite": "^4.4.5"
   },

diff --git a/apps/shelter/public/favicon.ico b/apps/shelter/public/favicon.ico
diff --git a/apps/shelter/src/App.tsx b/apps/shelter/src/App.tsx
@@ -1,16 +1,17 @@
+import Fonts from '@anifriends/fonts';
+import theme from '@anifriends/theme';
 import { ChakraProvider } from '@chakra-ui/react';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
 import { RouterProvider } from 'react-router-dom';
-import Fonts from 'shared/fonts';
-import theme from 'shared/theme';
 
 import { router } from '@/routes';
 
 const queryClient = new QueryClient({
   defaultOptions: {
     queries: {
-      staleTime: 50000,
+      staleTime: 10 * 1000,
+      gcTime: 10 * 1000,
     },
   },
 });

diff --git a/apps/shelter/src/apis/auth.ts b/apps/shelter/src/apis/auth.ts
@@ -1,11 +1,11 @@
-import axiosInstance from 'shared/apis/axiosInstance';
+import { axiosInstance } from '@anifriends/apis';
 import type {
   ChangePasswordRequestData,
   CheckDuplicatedEmailRequestData,
   CheckDuplicatedEmailResponseData,
   SigninRequestData,
   SigninResponseData,
-} from 'shared/types/apis/auth';
+} from '@anifriends/types';
 
 import { SignupRequestData } from '@/types/apis/auth';
 

diff --git a/apps/shelter/src/apis/recruitment.ts b/apps/shelter/src/apis/recruitment.ts
@@ -1,4 +1,4 @@
-import axiosInstance from 'shared/apis/axiosInstance';
+import { axiosInstance } from '@anifriends/apis';
 
 import {
   ApplicantsApprovalRequest,

diff --git a/apps/shelter/src/apis/shelter.ts b/apps/shelter/src/apis/shelter.ts
@@ -1,4 +1,4 @@
-import axiosInstance from 'shared/apis/axiosInstance';
+import { axiosInstance } from '@anifriends/apis';
 
 import { ShelterInfo, UpdateShelterInfo } from '@/types/apis/shetler';
 

diff --git a/apps/shelter/src/apis/volunteers.ts b/apps/shelter/src/apis/volunteers.ts
@@ -1,4 +1,4 @@
-import axiosInstance from 'shared/apis/axiosInstance';
+import { axiosInstance } from '@anifriends/apis';
 
 import {
   VolunteerCompletedsRequestParams,

diff --git a/apps/shelter/src/mocks/handlers/manage.ts b/apps/shelter/src/mocks/handlers/manage.ts
@@ -10,7 +10,7 @@ const DUMMY_USER = {
   volunteerAttendance: false,
 };
 
-const DUMMY_USER_LIST = Array.from({ length: 8 }, () => {
+const DUMMY_USER_LIST = Array.from({ length: 20 }, () => {
   return {
     ...DUMMY_USER,
     volunteerId: Math.random(),

diff --git a/apps/shelter/src/mocks/handlers/recruitment.ts b/apps/shelter/src/mocks/handlers/recruitment.ts
@@ -32,10 +32,12 @@ export const DUMMY_APPLICANT = {
   applicantStatus: 'APPROVED',
 };
 
-export const DUMMY_APPLICANT_LIST = Array.from(
-  { length: 9 },
-  () => DUMMY_APPLICANT,
-);
+export const DUMMY_APPLICANT_LIST = Array.from({ length: 9 }, (_, index) => {
+  return {
+    ...DUMMY_APPLICANT,
+    volunteerName: !(index % 2) ? '김철수' : '김영희',
+  };
+});
 
 export const handlers = [
   http.get('/shelters/recruitments', async () => {
@@ -60,6 +62,32 @@ export const handlers = [
       return HttpResponse.json({}, { status: 200 });
     },
   ),
+  http.patch(
+    '/shelters/recruitments/:recruitmentId/applicants/:applicantId',
+    async () => {
+      await delay(200);
+      return HttpResponse.json(
+        {
+          errorCode: 'AF301',
+          message: '해당 모집글에 대해 권한이 없습니다',
+        },
+        { status: 403 },
+      );
+    },
+  ),
+  http.patch(
+    '/shelters/recruitments/:recruitmentId/applicants/:applicantId',
+    async () => {
+      await delay(200);
+      return HttpResponse.json(
+        {
+          errorCode: 'AF401',
+          message: '해당 모집글을 신청한 봉사자가 아닙니다',
+        },
+        { status: 404 },
+      );
+    },
+  ),
   http.get('/shelters/recruitments/:recruitmentId/applicants', async () => {
     await delay(200);
     return HttpResponse.json({

diff --git a/apps/shelter/src/pages/animals/detail/index.tsx b/apps/shelter/src/pages/animals/detail/index.tsx
@@ -1,5 +1,5 @@
+import { useDetailHeaderStore } from '@anifriends/store';
 import { useEffect } from 'react';
-import useDetailHeaderStore from 'shared/store/detailHeaderStore';
 
 const handleDeletePost = (postId: number) => {
   // TODO: AnimalPost delete API 호출

diff --git a/apps/shelter/src/pages/animals/index.tsx b/apps/shelter/src/pages/animals/index.tsx
@@ -1,4 +1,4 @@
-import NotReady from 'shared/components/NotReady';
+import { NotReady } from '@anifriends/components';
 
 export default function AnimalsPage() {
   return <NotReady />;

diff --git a/apps/shelter/src/pages/animals/search/index.tsx b/apps/shelter/src/pages/animals/search/index.tsx
@@ -1,5 +1,5 @@
+import { useSearchHeaderStore } from '@anifriends/store';
 import { useEffect } from 'react';
-import useSearchHeaderStore from 'shared/store/searchHeaderStore';
 
 const handleSearchkeyword = (keyword: string) => {
   // TODO: AnimalList 검색 API 호출

diff --git a/apps/shelter/src/pages/chattings/index.tsx b/apps/shelter/src/pages/chattings/index.tsx
@@ -1,4 +1,4 @@
-import NotReady from 'shared/components/NotReady';
+import { NotReady } from '@anifriends/components';
 
 export default function ChattingsPage() {
   return <NotReady />;

diff --git a/apps/shelter/src/pages/manage/apply/_components/ApplyInfoItem.tsx b/apps/shelter/src/pages/manage/apply/_components/ApplyInfoItem.tsx
@@ -1,5 +1,5 @@
+import { ApplicantStatus } from '@anifriends/components';
 import { Flex, Text } from '@chakra-ui/react';
-import ApplicantStatus from 'shared/components/ApplicantStatus';
 
 type ApplyInfoItemProps = {
   currentRecuritmentCount: number;

diff --git a/apps/shelter/src/pages/manage/apply/_components/ManageApplyItem.tsx b/apps/shelter/src/pages/manage/apply/_components/ManageApplyItem.tsx
@@ -1,8 +1,8 @@
+import { Label } from '@anifriends/components';
+import { PERSON_GENDER_KOR } from '@anifriends/constants';
+import { getAge, updateToast } from '@anifriends/utils';
 import { Button, Flex, HStack, Text, useToast, VStack } from '@chakra-ui/react';
 import { useMutation, useQueryClient } from '@tanstack/react-query';
-import Label from 'shared/components/Label';
-import { PERSON_GENDER_KOR } from 'shared/constants/gender';
-import { getAge } from 'shared/utils/date';
 
 import { updateShelterRecruitmentApplicant } from '@/apis/recruitment';
 import CkCheck from '@/assets/CkCheck';
@@ -34,6 +34,7 @@ export default function ManageApplyItem({
   },
 }: ManageApplyItemProps) {
   const toast = useToast();
+  const manageApplyId = 'manage-apply';
   const queryClient = useQueryClient();
   const { mutate } = useMutation({
     mutationFn: (data: RecruitmentApplicantUpdateRequest) =>
@@ -47,12 +48,55 @@ export default function ManageApplyItem({
         ? APPLICANT_STATUS_KOR.APPROVE
         : APPLICANT_STATUS_KOR.REFUSE;
 
-      toast({
-        position: 'top',
-        description: `${volunteerName}님의 봉사신청을 ${descriptionStatus}했습니다`,
-        status: 'success',
-        duration: 1000,
-        isClosable: true,
+      toast.close(manageApplyId);
+
+      await new Promise((resolve) => setTimeout(resolve, 200));
+
+      updateToast({
+        toast,
+        toastId: manageApplyId,
+        toastOptions: {
+          position: 'top',
+          description: (
+            <Text w="100%">
+              <Text as="span" fontWeight="bold">
+                {volunteerName}
+              </Text>
+              님의 신청을{` `}
+              <Text as="span" fontWeight="bold">
+                {descriptionStatus}
+              </Text>
+              했습니다
+            </Text>
+          ),
+          status: 'success',
+          duration: 1500,
+          isClosable: true,
+        },
+      });
+    },
+    onError: async (error) => {
+      toast.close(manageApplyId);
+
+      await new Promise((resolve) => setTimeout(resolve, 200));
+
+      updateToast({
+        toast,
+        toastId: manageApplyId,
+        toastOptions: {
+          position: 'top',
+          description: (
+            <Text>
+              <Text as="span" fontWeight="bold">
+                {volunteerName}
+              </Text>
+              님은 {error.response?.data.message}
+            </Text>
+          ),
+          status: 'error',
+          duration: 1500,
+          isClosable: true,
+        },
       });
     },
   });
@@ -64,6 +108,13 @@ export default function ManageApplyItem({
   const changeApplicantStatus = ({
     isApproved,
   }: RecruitmentApplicantUpdateRequest) => {
+    if (
+      (isApproved && applicantStatus === APPLICANT_STATUS_ENG.APPROVED) ||
+      (!isApproved && applicantStatus === APPLICANT_STATUS_ENG.REFUSED)
+    ) {
+      return;
+    }
+
     mutate({ isApproved });
   };