feat: comment update funding api

academic-relations · Dec 29, 2024 · b1ad4c8 · b1ad4c8
1 parent 6705c75
commit b1ad4c8
Show file tree

Hide file tree

Showing 11 changed files with 459 additions and 95 deletions.
diff --git a/packages/api/src/feature/funding/funding.service.ts b/packages/api/src/feature/funding/funding.service.ts
@@ -210,15 +210,15 @@ export default class FundingService {
       transportationPassengerTIds.map(async id => {
         const student = await this.userPublicService.getStudentByTId({ id });
         return {
+          id: student.id,
           name: student.name,
-          studentNumber: student.number.toString(),
+          studentNumber: student.number,
         };
       }),
     );
 
     return {
       ...funding,
-
       transportationPassengers,
 
       tradeEvidenceFiles,

diff --git a/packages/interface/src/api/funding/endpoint/apiFnd002.ts b/packages/interface/src/api/funding/endpoint/apiFnd002.ts
@@ -101,7 +101,8 @@ const responsePreBodyMap = z.object({
   placeValidity: z.coerce.string().optional(),
   transportationPassengers: z.array(
     z.object({
-      studentNumber: z.coerce.string(),
+      id: z.coerce.number().int().min(1),
+      studentNumber: z.coerce.number().int().min(1),
       name: z.coerce.string(),
     }),
   ),
@@ -363,8 +364,8 @@ type ApiFnd002ResponseOk = z.infer<(typeof apiFnd002.responseBodyMap)[200]>;
 export default apiFnd002;
 
 export type {
+  ApiFnd002RequestBody,
   ApiFnd002RequestParam,
   ApiFnd002RequestQuery,
-  ApiFnd002RequestBody,
   ApiFnd002ResponseOk,
 };
diff --git a/packages/web/src/app/manage-club/funding/[id]/edit/page.tsx b/packages/web/src/app/manage-club/funding/[id]/edit/page.tsx
@@ -1,101 +1,46 @@
 "use client";
 
-import React, { useState } from "react";
+import { useEffect, useState } from "react";
 
-import { useParams, useRouter } from "next/navigation";
-import { overlay } from "overlay-kit";
-import styled from "styled-components";
+import AsyncBoundary from "@sparcs-clubs/web/common/components/AsyncBoundary";
+import LoginRequired from "@sparcs-clubs/web/common/frames/LoginRequired";
+import NoManageClub from "@sparcs-clubs/web/common/frames/NoManageClub";
+import { useAuth } from "@sparcs-clubs/web/common/providers/AuthContext";
+import EditFundingFrame from "@sparcs-clubs/web/features/manage-club/funding/frames/EditFundingFrame";
+import { useGetMyManageClub } from "@sparcs-clubs/web/features/manage-club/services/getMyManageClub";
 
-import Button from "@sparcs-clubs/web/common/components/Button";
-import FlexWrapper from "@sparcs-clubs/web/common/components/FlexWrapper";
-import Modal from "@sparcs-clubs/web/common/components/Modal";
-import ConfirmModalContent from "@sparcs-clubs/web/common/components/Modal/ConfirmModalContent";
-import PageHead from "@sparcs-clubs/web/common/components/PageHead";
-import AddEvidenceFrame from "@sparcs-clubs/web/features/manage-club/funding/frames/AddEvidenceFrame";
-import BasicEvidenceFrame from "@sparcs-clubs/web/features/manage-club/funding/frames/BasicEvidenceFrame";
-import FundingInfoFrame from "@sparcs-clubs/web/features/manage-club/funding/frames/FundingInfoFrame";
-import { FundingInterface } from "@sparcs-clubs/web/features/manage-club/funding/types/funding";
+const EditFunding = () => {
+  const { isLoggedIn, login, profile } = useAuth();
+  const [loading, setLoading] = useState(true);
 
-import mockFundingDetail from "@sparcs-clubs/web/features/manage-club/services/_mock/mockFundingDetail";
-import { formatDotDate } from "@sparcs-clubs/web/utils/Date/formatDate";
+  const { data, isLoading, isError } = useGetMyManageClub();
 
-const ButtonWrapper = styled.div`
-  display: flex;
-  justify-content: space-between;
-`;
+  useEffect(() => {
+    if (isLoggedIn !== undefined || profile !== undefined) {
+      setLoading(false);
+    }
+  }, [isLoggedIn, profile]);
 
-const EditFunding = () => {
-  // TODO: 나중에 관련 input들 다 생기면 짧아질 예정 (select의 value 값을 number | string으로 바꾸는 것도 고려해봐야 할 것 같음)
-  const [funding, setFunding] = useState<FundingInterface>({
-    ...mockFundingDetail,
-    purposeId: mockFundingDetail.purposeId?.toString() || "",
-    expenditureDate: formatDotDate(mockFundingDetail.expenditureDate),
-    expenditureAmount: mockFundingDetail.expenditureAmount.toString(),
-    clubSuppliesEvidenceEnumId:
-      mockFundingDetail.clubSuppliesEvidenceEnumId?.toString() || "",
-    clubSuppliesClassEnumId:
-      mockFundingDetail.clubSuppliesClassEnumId?.toString() || "",
-    fixtureEvidenceEnumId:
-      mockFundingDetail.fixtureEvidenceEnumId?.toString() || "",
-    fixtureClassEnumId: mockFundingDetail.fixtureClassEnumId?.toString() || "",
-    transportationEnumId:
-      mockFundingDetail.transportationEnumId?.toString() || "",
-    numberOfClubSupplies:
-      mockFundingDetail.numberOfClubSupplies?.toString() || "",
-    numberOfFixture: mockFundingDetail.numberOfFixture?.toString() || "",
-    priceOfClubSupplies:
-      mockFundingDetail.priceOfClubSupplies?.toString() || "",
-    priceOfFixture: mockFundingDetail.priceOfFixture?.toString() || "",
-  });
+  if (loading) {
+    return <AsyncBoundary isLoading={loading} isError />;
+  }
 
-  const props = { funding, setFunding };
+  if (!isLoggedIn) {
+    return <LoginRequired login={login} />;
+  }
 
-  const router = useRouter();
-  const { id } = useParams<{ id: string }>();
-  const cancelClick = () => {
-    router.push(`/manage-club/funding/${id}`);
-  };
+  if (profile?.type !== "undergraduate") {
+    return <NoManageClub />;
+  }
 
-  const openEditModal = () => {
-    overlay.open(({ isOpen, close }) => (
-      <Modal isOpen={isOpen}>
-        <ConfirmModalContent
-          onConfirm={() => {
-            // TODO: 저장 로직 넣기
-            close();
-            router.push("/manage-club/funding");
-          }}
-        >
-          수정이 완료되었습니다. <br />
-          확인을 누르면 신청 내역 화면으로 이동합니다.
-        </ConfirmModalContent>
-      </Modal>
-    ));
-  };
+  if (!data || !("clubId" in data)) {
+    return <AsyncBoundary isLoading={isLoading} isError={isError} />;
+  }
 
   return (
-    // TODO: RejectReasonToast
-    <FlexWrapper direction="column" gap={60}>
-      <PageHead
-        items={[
-          { name: "대표 동아리 관리", path: "/manage-club" },
-          { name: "지원금", path: "/manage-club/funding" },
-        ]}
-        title="지원금 수정"
-        enableLast
-      />
-      <FundingInfoFrame {...props} />
-      <BasicEvidenceFrame {...props} />
-      <AddEvidenceFrame {...props} />
-      <ButtonWrapper>
-        <Button type="outlined" onClick={cancelClick}>
-          취소
-        </Button>
-        <Button type="default" onClick={openEditModal}>
-          저장
-        </Button>
-      </ButtonWrapper>
-    </FlexWrapper>
+    <AsyncBoundary isLoading={isLoading} isError={isError}>
+      <EditFundingFrame clubId={data.clubId} />
+    </AsyncBoundary>
   );
 };
 

diff --git a/packages/web/src/features/manage-club/funding/frames/CreateFundingFrame.tsx b/packages/web/src/features/manage-club/funding/frames/CreateFundingFrame.tsx
@@ -10,7 +10,7 @@ import ConfirmModalContent from "@sparcs-clubs/web/common/components/Modal/Confi
 import PageHead from "@sparcs-clubs/web/common/components/PageHead";
 import Typography from "@sparcs-clubs/web/common/components/Typography";
 
-import { useCreateFunding } from "../services/useCreateFunding";
+import { useCreateFunding } from "../hooks/useCreateFunding";
 import { FundingFormData } from "../types/funding";
 
 import FundingForm from "./FundingForm";

diff --git a/packages/web/src/features/manage-club/funding/frames/EditFundingFrame.tsx b/packages/web/src/features/manage-club/funding/frames/EditFundingFrame.tsx
@@ -0,0 +1,92 @@
+import React from "react";
+
+import { useParams, useRouter } from "next/navigation";
+
+import { overlay } from "overlay-kit";
+
+import AsyncBoundary from "@sparcs-clubs/web/common/components/AsyncBoundary";
+import FlexWrapper from "@sparcs-clubs/web/common/components/FlexWrapper";
+import Modal from "@sparcs-clubs/web/common/components/Modal";
+import ConfirmModalContent from "@sparcs-clubs/web/common/components/Modal/ConfirmModalContent";
+import PageHead from "@sparcs-clubs/web/common/components/PageHead";
+import Typography from "@sparcs-clubs/web/common/components/Typography";
+
+import useGetInitialFundingFormData from "../hooks/useGetInitialFundingForm";
+import useUpdateFunding from "../hooks/useUpdateFunding";
+import { FundingFormData } from "../types/funding";
+
+import FundingForm from "./FundingForm";
+
+interface EditFundingFrameProps {
+  clubId: number;
+}
+
+const EditFundingFrame: React.FC<EditFundingFrameProps> = ({ clubId }) => {
+  const router = useRouter();
+  const { id: fundingId } = useParams<{ id: string }>();
+  const cancelClick = () => {
+    router.push(`/manage-club/funding/${fundingId}`);
+  };
+
+  const {
+    data: funding,
+    isLoading,
+    isError,
+  } = useGetInitialFundingFormData(+fundingId);
+
+  const { mutateAsync: updateFunding } = useUpdateFunding(+fundingId, clubId);
+
+  const handleSubmit = (data: FundingFormData) => {
+    updateFunding(data, {
+      onSuccess: () => {
+        overlay.open(({ isOpen, close }) => (
+          <Modal isOpen={isOpen}>
+            <ConfirmModalContent
+              onConfirm={() => {
+                close();
+                router.push(`/manage-club/funding/${fundingId}`);
+              }}
+            >
+              수정이 완료되었습니다. <br />
+              확인을 누르면 신청 내역 화면으로 이동합니다.
+            </ConfirmModalContent>
+          </Modal>
+        ));
+      },
+      onError: error => {
+        overlay.open(({ isOpen, close }) => (
+          <Modal isOpen={isOpen}>
+            <ConfirmModalContent onConfirm={close}>
+              지원금 수정에 실패했습니다.
+              <Typography color="GRAY.300" fs={12} lh={16} fw="REGULAR">
+                {error.message}
+              </Typography>
+            </ConfirmModalContent>
+          </Modal>
+        ));
+      },
+    });
+  };
+
+  return (
+    <FlexWrapper direction="column" gap={60}>
+      <PageHead
+        items={[
+          { name: "대표 동아리 관리", path: "/manage-club" },
+          { name: "지원금", path: "/manage-club/funding" },
+        ]}
+        title="지원금 수정"
+        enableLast
+      />
+      <AsyncBoundary isLoading={isLoading} isError={isError}>
+        <FundingForm
+          onCancel={cancelClick}
+          onSubmit={handleSubmit}
+          initialData={funding ?? []}
+        />
+      </AsyncBoundary>
+    </FlexWrapper>
+  );
+};
+
+export default EditFundingFrame;
diff --git a/...club/funding/services/useCreateFunding.ts → ...ge-club/funding/hooks/useCreateFunding.ts b/...club/funding/services/useCreateFunding.ts → ...ge-club/funding/hooks/useCreateFunding.ts
@@ -2,14 +2,13 @@ import { useMutation, useQueryClient } from "@tanstack/react-query";
 
 import { isParticipantsRequired } from "@sparcs-clubs/web/utils/isTransportation";
 
+import { newFundingListQueryKey } from "../services/useGetNewFundingList";
+import usePostFunding from "../services/usePostFunding";
 import {
   FundingFormData,
   isActivityReportUnverifiable,
 } from "../types/funding";
 
-import { newFundingListQueryKey } from "./useGetNewFundingList";
-import usePostFunding from "./usePostFunding";
-
 export const useCreateFunding = (clubId: number) => {
   const queryClient = useQueryClient();
   const { mutateAsync: createFunding } = usePostFunding();