diff --git a/frontend/src/components/ProjectCreateModal/index.tsx b/frontend/src/components/ProjectCreateModal/index.tsx index 8408f1c..0694ad9 100644 --- a/frontend/src/components/ProjectCreateModal/index.tsx +++ b/frontend/src/components/ProjectCreateModal/index.tsx @@ -31,7 +31,7 @@ export default function ProjectCreateModal({ onSubmit, buttonClass = '' }: Proje - + { const formattedData: ProjectRequest = { diff --git a/frontend/src/components/WorkspaceBrowseLayout/index.tsx b/frontend/src/components/WorkspaceBrowseLayout/index.tsx index 4cafbb3..a5dfa61 100644 --- a/frontend/src/components/WorkspaceBrowseLayout/index.tsx +++ b/frontend/src/components/WorkspaceBrowseLayout/index.tsx @@ -2,7 +2,7 @@ import { useEffect, Suspense, useState } from 'react'; import { NavLink, Outlet, useLocation, useNavigate } from 'react-router-dom'; import Header from '../Header'; import useAuthStore from '@/stores/useAuthStore'; -import { WorkspaceRequest, WorkspaceResponse } from '@/types'; +import { ProjectRequest, WorkspaceRequest, WorkspaceResponse } from '@/types'; import useWorkspaceListQuery from '@/queries/workspaces/useWorkspaceListQuery'; import useCreateWorkspaceQuery from '@/queries/workspaces/useCreateWorkspaceQuery'; import { cn } from '@/lib/utils'; @@ -10,6 +10,8 @@ import { Ellipsis } from 'lucide-react'; import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from '../ui/dropdown-menu'; import { Dialog, DialogContent, DialogHeader, DialogTrigger } from '../ui/dialogCustom'; import WorkSpaceCreateForm, { WorkSpaceCreateFormValues } from '../WorkSpaceCreateModal/WorkSpaceCreateForm'; +import ProjectCreateForm, { ProjectCreateFormValues } from '../ProjectCreateModal/ProjectCreateForm'; +import useCreateProjectQuery from '@/queries/projects/useCreateProjectQuery'; export default function WorkspaceBrowseLayout() { const location = useLocation(); @@ -19,6 +21,7 @@ export default function WorkspaceBrowseLayout() { const [isOpenWorkspaceCreate, setIsOpenWorkspaceCreate] = useState(false); const [isOpenWorkspaceUpdate, setIsOpenWorkspaceUpdate] = useState(false); + const [isOpenProjectCreate, setIsOpenProjectCreate] = useState(false); useEffect(() => { if (memberId == 0) { @@ -27,6 +30,7 @@ export default function WorkspaceBrowseLayout() { }, [memberId, navigate]); const createWorkspace = useCreateWorkspaceQuery(); + const createProject = useCreateProjectQuery(); const { data: workspacesResponse } = useWorkspaceListQuery(memberId ?? 0); const workspaces = workspacesResponse?.workspaceResponses ?? []; const activeWorkspaceId: number = Number(location.pathname.split('/')[2] || '-1'); @@ -45,6 +49,22 @@ export default function WorkspaceBrowseLayout() { setIsOpenWorkspaceCreate(false); }; + const handleCreateProject = (values: ProjectCreateFormValues) => { + const data: ProjectRequest = { + title: values.projectName, + projectType: values.labelType.toLowerCase() as ProjectRequest['projectType'], + categories: values.categories, + }; + + createProject.mutate({ + workspaceId: activeWorkspaceId, + memberId, + data, + }); + + setIsOpenProjectCreate(false); + }; + return ( <>
@@ -92,7 +112,9 @@ export default function WorkspaceBrowseLayout() { setIsOpenWorkspaceUpdate(true)}> 워크스페이스 이름 변경 - {}}>워크스페이스에 새 프로젝트 추가 + setIsOpenProjectCreate(true)}> + 워크스페이스에 새 프로젝트 추가 + )} @@ -135,6 +157,17 @@ export default function WorkspaceBrowseLayout() { console.log('hello')} /> + + + + + + + + ); }