Refactor: 프로젝트 크리에이트 모달 버튼 클라스 설정 가능하게 함

frontend/src/components/Header/index.tsx

@@ -1,12 +1,14 @@
 import * as React from 'react';
 import { cn } from '@/lib/utils';
 import { Bell, User } from 'lucide-react';
-import { useLocation, Link } from 'react-router-dom';
+import { useLocation, Link, useParams } from 'react-router-dom';
 
 export interface HeaderProps extends React.HTMLAttributes<HTMLDivElement> {}
 
 export default function Header({ className, ...props }: HeaderProps) {
   const location = useLocation();
+  const { workspaceId } = useParams<{ workspaceId: string }>();
+  const isWorkspaceIdNaN = isNaN(Number(workspaceId));
 
   const isHomePage = location.pathname === '/';
 
@@ -30,23 +32,27 @@ export default function Header({ className, ...props }: HeaderProps) {
         {!isHomePage && (
           <nav className="hidden items-center gap-5 md:flex">
             <Link
-              to="/browse"
+              to={isWorkspaceIdNaN ? '/browse' : `/browse/${workspaceId}`}
               className={cn('text-color-text-default-default', 'font-body-strong', 'text-sm sm:text-base md:text-lg')}
             >
               workspace
             </Link>
-            <Link
-              to="/workspace"
-              className={cn('text-color-text-default-default', 'font-body', 'text-sm sm:text-base md:text-lg')}
-            >
-              labeling
-            </Link>
-            <Link
-              to="/admin/1"
-              className={cn('text-color-text-default-default', 'font-body', 'text-sm sm:text-base md:text-lg')}
-            >
-              admin
-            </Link>
+            {!isWorkspaceIdNaN && (
+              <>
+                <Link
+                  to={`/workspace/${workspaceId}`}
+                  className={cn('text-color-text-default-default', 'font-body', 'text-sm sm:text-base md:text-lg')}
+                >
+                  labeling
+                </Link>
+                <Link
+                  to={`/admin/${workspaceId}`}
+                  className={cn('text-color-text-default-default', 'font-body', 'text-sm sm:text-base md:text-lg')}
+                >
+                  admin
+                </Link>
+              </>
+            )}
           </nav>
         )}
       </div>

frontend/src/components/ProjectCreateModal/index.tsx

@@ -6,9 +6,10 @@ import { Plus } from 'lucide-react';
 
 interface ProjectCreateModalProps {
   onSubmit: (data: { title: string; labelType: 'classification' | 'detection' | 'segmentation' }) => void;
+  buttonClass?: string;
 }
 
-export default function ProjectCreateModal({ onSubmit }: ProjectCreateModalProps) {
+export default function ProjectCreateModal({ onSubmit, buttonClass = '' }: ProjectCreateModalProps) {
   const [isOpen, setIsOpen] = React.useState(false);
 
   const handleOpen = () => setIsOpen(true);
@@ -35,7 +36,7 @@ export default function ProjectCreateModal({ onSubmit }: ProjectCreateModalProps
       <DialogTrigger asChild>
         <Button
           variant="outlinePrimary"
-          className="mt-4 flex items-center gap-2"
+          className={`${buttonClass}`}
           onClick={handleOpen}
         >
           <Plus size={16} />