UI: #200 프로젝트 팀 없이 생성 시 토스트 메시지 출력 및 프로젝트 생성 UI 설정

src/components/common/DescriptionTextarea.tsx

@@ -21,12 +21,13 @@ export default function DescriptionTextarea({
   const { register } = useFormContext();
 
   return (
-    <label htmlFor={id}>
+    <label htmlFor={id} className="flex flex-col">
       <h3 className="text-large">{label}</h3>
       <textarea
         id={id}
-        className="h-100 w-full rounded-md border border-input p-10 text-regular placeholder:text-xs"
+        className="w-full rounded-md border border-input p-10 text-regular placeholder:text-xs"
         placeholder={placeholder}
+        rows={5}
         {...(validationRole ? register(fieldName, validationRole) : register(fieldName))}
       />
       <div className={`my-5 h-10 text-xs text-error ${errors ? 'visible' : 'invisible'}`}>{errors}</div>

src/pages/team/TeamPage.tsx

@@ -9,6 +9,7 @@ import { useReadProjects, useDeleteProject } from '@hooks/query/useProjectQuery'
 import Spinner from '@components/common/Spinner';
 import { useReadTeams } from '@hooks/query/useTeamQuery';
 
+import useToast from '@hooks/useToast';
 import type { Project } from '@/types/ProjectType';
 
 export default function TeamPage() {
@@ -18,6 +19,7 @@ export default function TeamPage() {
   const { projectList: teamProjects, isProjectLoading } = useReadProjects(Number(teamId));
   const { joinedTeamList, isLoading: isTeamLoading } = useReadTeams();
   const [selectedProjectId, setSelectedProjectId] = useState<Project['projectId'] | null>(null);
+  const { toastWarn } = useToast();
 
   const { mutate: deleteProjectMutate } = useDeleteProject(Number(teamId));
 
@@ -29,6 +31,11 @@ export default function TeamPage() {
     openUpdateModal();
   };
 
+  const handleCreateProjectClick = () => {
+    if (!teamId) return toastWarn('팀을 선택한 후 프로젝트 생성을 진행해주세요.');
+    openProjectModal();
+  };
+
   const handleDeleteClick = (e: React.MouseEvent, projectId: Project['projectId']) => {
     e.preventDefault();
     deleteProjectMutate(projectId);
@@ -45,7 +52,11 @@ export default function TeamPage() {
           <small className="text-xs font-bold text-category">team</small>
           <span>{teamName}</span>
         </div>
-        <button type="button" onClick={openProjectModal} className="mr-10 font-bold text-main hover:brightness-50">
+        <button
+          type="button"
+          onClick={handleCreateProjectClick}
+          className="mr-10 font-bold text-main hover:brightness-50"
+        >
           + 프로젝트 생성
         </button>
       </header>