[#44] Feat/44/워크스페이스관리페이지

src/apis/workspace/workspace.queries.ts

@@ -4,6 +4,7 @@ import { workspaceService } from './workspace.service';
 import {
   CreateWorkspaceRequest,
   InviteWorkspaceRequest,
+  UpdateWorkspaceSettingsRequest,
   WorkspaceMemberStatus,
 } from './workspace.type';
 
@@ -66,6 +67,18 @@ export const useGetAdminName = (workspaceId: number) => {
   });
 };
 
+export const useGetWorkspaceMembers = (workspaceId: number, status: WorkspaceMemberStatus) => {
+  const { data: session } = useSession();
+  const accessToken = session?.accessToken as string | undefined;
+
+  return useQuery({
+    queryKey: workspaceKeys.members(workspaceId, status),
+    queryFn: () => workspaceService.getWorkspaceMembers(workspaceId, status, accessToken!),
+    enabled: !!accessToken && !!workspaceId,
+    staleTime: 1000 * 60 * 5,
+  });
+};
+
 export const useCreateWorkspace = () => {
   const { data: session } = useSession();
   const accessToken = session?.accessToken as string | undefined;
@@ -123,14 +136,41 @@ export const useRejectInvitation = () => {
   });
 };
 
-export const useGetWorkspaceMembers = (workspaceId: number, status: WorkspaceMemberStatus) => {
+export const useUpdateWorkspaceSettings = (workspaceId: number) => {
   const { data: session } = useSession();
   const accessToken = session?.accessToken as string | undefined;
+  const queryClient = useQueryClient();
 
-  return useQuery({
-    queryKey: workspaceKeys.members(workspaceId, status),
-    queryFn: () => workspaceService.getWorkspaceMembers(workspaceId, status, accessToken!),
-    enabled: !!accessToken && !!workspaceId,
-    staleTime: 1000 * 60 * 5,
+  return useMutation({
+    mutationFn: (body: UpdateWorkspaceSettingsRequest) =>
+      workspaceService.updateWorkspaceSettings(workspaceId, body, accessToken!),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: workspaceKeys.detail(workspaceId) });
+      queryClient.invalidateQueries({ queryKey: workspaceKeys.my });
+    },
+  });
+};
+
+export const useDeleteWorkspaceMember = (workspaceId: number) => {
+  const { data: session } = useSession();
+  const accessToken = session?.accessToken as string | undefined;
+
+  return useMutation({
+    mutationFn: (userId: number) =>
+      workspaceService.deleteWorkspaceMember(workspaceId, userId, accessToken!),
+  });
+};
+
+export const useDeleteWorkspace = () => {
+  const { data: session } = useSession();
+  const accessToken = session?.accessToken as string | undefined;
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: (workspaceId: number) =>
+      workspaceService.deleteWorkspace(workspaceId, accessToken!),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: workspaceKeys.my });
+    },
   });
 };

src/apis/workspace/workspace.service.ts

@@ -10,6 +10,10 @@ import {
   AdminNameResponse,
   WorkspaceMembersResponse,
   WorkspaceMemberStatus,
+  UpdateWorkspaceSettingsRequest,
+  UpdateWorkspaceSettingsResponse,
+  DeleteWorkspaceMemberResponse,
+  DeleteWorkspaceResponse,
 } from './workspace.type';
 
 const BASE_URL = process.env.NEXT_PUBLIC_API_URL;
@@ -133,4 +137,55 @@ export const workspaceService = {
     if (!res.ok) throw new Error('멤버 목록 조회에 실패했습니다.');
     return res.json();
   },
+
+  updateWorkspaceSettings: async (
+    workspaceId: number,
+    body: UpdateWorkspaceSettingsRequest,
+    accessToken: string,
+  ): Promise<UpdateWorkspaceSettingsResponse> => {
+    const res = await fetch(`${BASE_URL}/api/v1/workspaces/${workspaceId}/settings`, {
+      method: 'PATCH',
+      headers: {
+        'Content-Type': 'application/json',
+        Authorization: `Bearer ${accessToken}`,
+      },
+      body: JSON.stringify(body),
+    });
+
+    if (res.status === 403) throw new Error('수정 권한이 없습니다.');
+    if (res.status === 404) throw new Error('워크스페이스를 찾을 수 없습니다.');
+    if (!res.ok) throw new Error('워크스페이스 설정 수정에 실패했습니다.');
+    return res.json();
+  },
+
+  deleteWorkspaceMember: async (
+    workspaceId: number,
+    userId: number,
+    accessToken: string,
+  ): Promise<DeleteWorkspaceMemberResponse> => {
+    const res = await fetch(`${BASE_URL}/api/v1/workspaces/${workspaceId}/members/${userId}`, {
+      method: 'DELETE',
+      headers: { Authorization: `Bearer ${accessToken}` },
+    });
+
+    if (res.status === 403) throw new Error('강퇴 권한이 없습니다.');
+    if (res.status === 404) throw new Error('멤버를 찾을 수 없습니다.');
+    if (!res.ok) throw new Error('멤버 강퇴에 실패했습니다.');
+    return res.json();
+  },
+
+  deleteWorkspace: async (
+    workspaceId: number,
+    accessToken: string,
+  ): Promise<DeleteWorkspaceResponse> => {
+    const res = await fetch(`${BASE_URL}/api/v1/workspaces/${workspaceId}`, {
+      method: 'DELETE',
+      headers: { Authorization: `Bearer ${accessToken}` },
+    });
+
+    if (res.status === 403) throw new Error('삭제 권한이 없습니다.');
+    if (res.status === 404) throw new Error('워크스페이스를 찾을 수 없습니다.');
+    if (!res.ok) throw new Error('워크스페이스 삭제에 실패했습니다.');
+    return res.json();
+  },
 };

src/apis/workspace/workspace.type.ts

@@ -121,3 +121,35 @@ export interface WorkspaceMembersResponse {
     traceId: string;
   };
 }
+
+export interface UpdateWorkspaceSettingsRequest {
+  name: string;
+  color: string;
+}
+
+export interface UpdateWorkspaceSettingsResponse {
+  success: boolean;
+  data: null;
+  meta: {
+    timestamp: string;
+    traceId: string;
+  };
+}
+
+export interface DeleteWorkspaceMemberResponse {
+  success: boolean;
+  data: null;
+  meta: {
+    timestamp: string;
+    traceId: string;
+  };
+}
+
+export interface DeleteWorkspaceResponse {
+  success: boolean;
+  data: null;
+  meta: {
+    timestamp: string;
+    traceId: string;
+  };
+}

src/app/(after-login)/mypage/page.tsx

@@ -157,7 +157,7 @@ export default function Page() {
   };
 
   return (
-    <div className='mb-12 w-full max-w-3xl p-3 md:p-5'>
+    <div className='mb-12 w-full max-w-3xl px-6 py-3 md:px-10 md:py-5'>
       <button
         onClick={() => router.back()}
         className='text-md mb-3 flex cursor-pointer items-center gap-2 font-medium text-gray-400 transition-all duration-200 hover:text-gray-500 md:mb-5 md:text-lg'