feat: 모듈 API 수정 페이지 작업

apps/cs/app/(with-base-layout)/module/register/[sequential]/page.tsx

@@ -0,0 +1,10 @@
+import { ModifyPage as VModifyPage } from "@/pages/module";
+
+export default async function ModifyPage({
+  params,
+}: {
+  params: Promise<{ sequential: string }>;
+}) {
+  const { sequential } = await params;
+  return <VModifyPage sequential={sequential} />;
+}

apps/cs/src/pages/module/api/authorization-service.ts

@@ -19,6 +19,15 @@ export class AuthorizationsApiService implements AuthorizationsService {
     return response.data;
   }
 
+  public async getAuthorizationInfo(
+    authorizationNo: string,
+  ): Promise<WithRoleAuthorizations> {
+    const response = await client.get<WithRoleAuthorizations>(
+      `${ENDPOINT.USER_SERVICE.AUTHORIZATIONS}/${authorizationNo}`,
+    );
+    return response.data;
+  }
+
   public async createAuthorization(
     data: AuthorizationFormData,
   ): Promise<WithRoleAuthorizations> {
@@ -28,6 +37,17 @@ export class AuthorizationsApiService implements AuthorizationsService {
     );
     return response.data;
   }
+
+  public async updateAuthorization(
+    authorizationNo: string,
+    data: AuthorizationFormData,
+  ): Promise<WithRoleAuthorizations> {
+    const response = await client.put<WithRoleAuthorizations>(
+      `${ENDPOINT.USER_SERVICE.AUTHORIZATIONS}/${authorizationNo}`,
+      data,
+    );
+    return response.data;
+  }
 }
 
 export const AuthorizationsApi = new AuthorizationsApiService();

apps/cs/src/pages/module/index.ts

@@ -1,2 +1,3 @@
 export { ModulePage } from "./ui/module-page";
 export { CreatePage } from "./ui/create-page";
+export { ModifyPage } from "./ui/modify-page";

apps/cs/src/pages/module/model/authorizations-interface.ts

@@ -44,7 +44,14 @@ export interface AuthorizationsService {
   getAuthorizationsList: (
     params: AuthorizationsParams,
   ) => Promise<AuthorizationsList>;
+  getAuthorizationInfo: (
+    authorizationNo: string,
+  ) => Promise<WithRoleAuthorizations>;
   createAuthorization: (
     data: AuthorizationFormData,
   ) => Promise<WithRoleAuthorizations>;
+  updateAuthorization: (
+    authorizationNo: string,
+    data: AuthorizationFormData,
+  ) => Promise<WithRoleAuthorizations>;
 }

apps/cs/src/pages/module/ui/modify-page.tsx

@@ -0,0 +1,50 @@
+"use client";
+
+import { useForm } from "react-hook-form";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { useMutation, useQuery } from "@tanstack/react-query";
+import { useAlertStore } from "@/shared/lib/use-alert-store";
+import { ENDPOINT } from "@/shared/config";
+import {
+  authorizationFormSchema,
+  type AuthorizationFormData,
+} from "../model/authorizations-interface";
+import { AuthorizationsApi } from "../api/authorization-service";
+import { ModuleForm } from "./module-form";
+
+function ModifyPage({ sequential }: { sequential: string }) {
+  const { setMessage: alert } = useAlertStore((state) => state);
+
+  const { data: authorizationInfo } = useQuery({
+    queryKey: [ENDPOINT.USER_SERVICE.AUTHORIZATIONS, sequential],
+    queryFn: () => AuthorizationsApi.getAuthorizationInfo(sequential),
+  });
+
+  const { mutateAsync: updateAuthorization } = useMutation({
+    mutationFn: (data: AuthorizationFormData) =>
+      AuthorizationsApi.updateAuthorization(sequential, data),
+    onSuccess: () => {
+      alert("수정되었습니다.");
+    },
+  });
+
+  const form = useForm<AuthorizationFormData>({
+    resolver: zodResolver(authorizationFormSchema),
+    values: authorizationInfo,
+  });
+
+  return (
+    <div className="card card-border !mt-6">
+      <div className="card-header">
+        <h3 className="text-2xl font-medium text-label">모듈API 수정</h3>
+      </div>
+      <ModuleForm
+        form={form}
+        authorizationNo={Number(sequential)}
+        handleSave={updateAuthorization}
+      />
+    </div>
+  );
+}
+
+export { ModifyPage };