jhynsoo/worlabel
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Feat: 워크스페이스 목록에서 선택한 워크스페이스에 메뉴 추가

Browse Source
This commit is contained in:
홍창기 2024-10-04 20:26:00 +09:00
parent 83418dfc95
commit c1673f6b22
2 changed files with 36 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/components/ProjectCreateModal/index.tsx
View File

@ -31,7 +31,7 @@ export default function ProjectCreateModal({ onSubmit, buttonClass = '' }: Proje
</Button>
</DialogTrigger>
<DialogContent>
<DialogHeader title="새 프로젝트" />
<DialogHeader title="새 프로젝트 추가" />
<ProjectCreateForm
onSubmit={(data: ProjectCreateFormValues) => {
const formattedData: ProjectRequest = {

37
frontend/src/components/WorkspaceBrowseLayout/index.tsx
View File

@ -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<boolean>(false);
const [isOpenWorkspaceUpdate, setIsOpenWorkspaceUpdate] = useState<boolean>(false);
const [isOpenProjectCreate, setIsOpenProjectCreate] = useState<boolean>(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 (
<>
<Header className="fixed left-0 top-0 w-full" />
@ -92,7 +112,9 @@ export default function WorkspaceBrowseLayout() {
<DropdownMenuItem onClick={() => setIsOpenWorkspaceUpdate(true)}>
워크스페이스 이름 변경
</DropdownMenuItem>
<DropdownMenuItem onClick={() => {}}>워크스페이스에 새 프로젝트 추가</DropdownMenuItem>
<DropdownMenuItem onClick={() => setIsOpenProjectCreate(true)}>
워크스페이스에 새 프로젝트 추가
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
)}
@ -135,6 +157,17 @@ export default function WorkspaceBrowseLayout() {
<WorkSpaceCreateForm onSubmit={() => console.log('hello')} />
</DialogContent>
</Dialog>
<Dialog
open={isOpenProjectCreate}
onOpenChange={setIsOpenProjectCreate}
>
<DialogTrigger asChild></DialogTrigger>
<DialogContent>
<DialogHeader title="새 프로젝트 추가" />
<ProjectCreateForm onSubmit={handleCreateProject} />
</DialogContent>
</Dialog>
</>
);
}