diff --git a/apps/client/package.json b/apps/client/package.json index 5f47b0a..d3dd8ef 100644 --- a/apps/client/package.json +++ b/apps/client/package.json @@ -18,14 +18,19 @@ "devDependencies": { "@jjoing/eslint-config": "workspace:*", "@jjoing/typescript-config": "workspace:*", + "@toss/use-overlay": "^1.4.0", "@types/node": "^20.8.0", "@types/react": "^18.2.23", "@types/react-dom": "^18.2.7", "autoprefixer": "^10.4.14", + "dayjs": "^1.11.13", "eslint": "^8.50.0", "eslint-config-next": "^14.0.5", "framer-motion": "^11.3.30", "postcss": "^8.4.27", + "react-dropzone": "^14.2.3", + "react-hook-form": "^7.53.0", + "tailwind-scrollbar-hide": "^1.1.7", "tailwindcss": "^3.3.3", "typescript": "^5.2.2" } diff --git a/apps/client/src/app/projects/page.tsx b/apps/client/src/app/projects/page.tsx index 163aa45..c2546aa 100644 --- a/apps/client/src/app/projects/page.tsx +++ b/apps/client/src/app/projects/page.tsx @@ -1,16 +1,24 @@ 'use client'; +import CreateProject from '@/components/createProject'; import { Container, Wrapper } from '@/components/layouts'; import { ProjectList, ProjectSelectBox } from '@/components/projects'; import { ProjectRecruitOptions, ProjectRecruitStatus } from '@/constants'; +import { useOverlay } from '@toss/use-overlay'; import { useState } from 'react'; import { FaPlus } from 'react-icons/fa6'; const ProjectsPage = () => { const [projectStatus, setProjectStatus] = useState(ProjectRecruitStatus[0]?.state); - const [projectOptions, setProjectOpoins] = useState(ProjectRecruitOptions[0]?.state); + const [projectOptions, setProjectOptions] = useState(ProjectRecruitOptions[0]?.state); - console.log(projectStatus, projectOptions); // 백엔드로 요청보낼때 사용될 코드 + console.log(projectStatus, projectOptions); // 백엔드로 요청보낼때 사용될 코드s + + const overlay = useOverlay(); + + const handleOpenCreateProject = () => { + overlay.open(({ isOpen, close }) => ); + }; return ( @@ -22,12 +30,15 @@ const ProjectsPage = () => { />
프로젝트 목록 📋 -
+
diff --git a/apps/client/src/components/createProject/explainField.tsx b/apps/client/src/components/createProject/explainField.tsx new file mode 100644 index 0000000..ef59dd7 --- /dev/null +++ b/apps/client/src/components/createProject/explainField.tsx @@ -0,0 +1,14 @@ +import { Text, Textarea } from '@jjoing/ui'; +import { useFormContext } from 'react-hook-form'; + +const ExplainField = () => { + const { register } = useFormContext(); + return ( +
+ 프로젝트 설명 +