diff --git a/src/pages/ProjectCreate.tsx b/src/pages/ProjectCreate.tsx deleted file mode 100644 index 1138211..0000000 --- a/src/pages/ProjectCreate.tsx +++ /dev/null @@ -1,189 +0,0 @@ -import { useEffect, useState } from "react"; -import { useBlocker, useNavigate } from "react-router-dom"; -import { Briefcase, Loader2 } from "lucide-react"; -import { toast } from "sonner"; - -import { getClients } from "../api/clients"; -import { createProject } from "../api/projects"; -import { Button } from "../components/ui/button"; -import { Input } from "../components/ui/input"; -import { Select } from "../components/ui/Select"; -import { TextAreaInput } from "../components/ui/TextAreaInput"; -import { useWorkspace } from "../context/WorkspaceContext"; -import { useTranslation } from "../hooks/useTranslation"; -import { PROJECTS_CREATE, canWorkspace } from "../lib/permissions"; - -const COLORS = [ - "#3B82F6", - "#10B981", - "#F59E0B", - "#EF4444", - "#8B5CF6", - "#EC4899", - "#14B8A6", - "#64748B", -]; - -export default function ProjectCreate() { - const navigate = useNavigate(); - const { t } = useTranslation(); - const { activeWorkspace } = useWorkspace(); - const canCreateProject = canWorkspace(activeWorkspace?.my_role, PROJECTS_CREATE); - - const [name, setName] = useState(""); - const [description, setDescription] = useState(""); - const [color, setColor] = useState(COLORS[0]); - const [client, setClient] = useState(""); - const [clientsList, setClientsList] = useState<{ id: string; name: string }[]>([]); - const [isLoadingData, setIsLoadingData] = useState(true); - const [isSaving, setIsSaving] = useState(false); - - const hasUnsavedChanges = name.trim() !== "" || description.trim() !== "" || client !== "" || color !== COLORS[0]; - - useEffect(() => { - if (activeWorkspace && !canCreateProject) { - toast.error("You do not have permission to create projects."); - navigate("/projects"); - } - }, [activeWorkspace, canCreateProject, navigate]); - - useBlocker(({ currentLocation, nextLocation }) => { - if (hasUnsavedChanges && !isSaving && currentLocation.pathname !== nextLocation.pathname) { - return !window.confirm(t.confirmLeave || "You have unsaved changes. Are you sure you want to leave?"); - } - return false; - }); - - useEffect(() => { - if (!activeWorkspace?.id) return; - - setName(""); - setDescription(""); - setColor(COLORS[0]); - setClient(""); - setClientsList([]); - setIsLoadingData(true); - - const loadInitialData = async () => { - try { - const clientsRes = await getClients(activeWorkspace.id); - setClientsList(clientsRes.results || []); - } catch { - toast.error(t.projects?.clientFetchError || "Failed to load clients."); - } finally { - setIsLoadingData(false); - } - }; - - void loadInitialData(); - }, [activeWorkspace?.id, t.projects?.clientFetchError]); - - const handleSubmit = async (e: React.FormEvent) => { - e.preventDefault(); - if (!name.trim() || !activeWorkspace) return; - - try { - setIsSaving(true); - const newProject = await createProject({ - workspace: activeWorkspace.id, - name, - description, - color, - client: client || null, - is_archived: false, - }); - - window.dispatchEvent(new CustomEvent("project_created", { detail: newProject })); - toast.success(t.projects?.createSuccess || "Project created successfully."); - navigate("/projects"); - } catch (error: any) { - toast.error(error.message || t.projects?.createError || "Failed to create project."); - } finally { - setIsSaving(false); - } - }; - - if (!activeWorkspace) return null; - - return ( -
-
-

- {t.projects?.createNew || "Create New Project"} -

- -
-
-
-
-
- setName(e.target.value)} - placeholder={t.projects?.namePlaceholder || "Project name..."} - required - /> -
-
- {COLORS.map((paletteColor) => ( -
-
- -
- - setName(e.target.value)} - placeholder={t.projects?.namePlaceholder || "Project name..."} - required - /> -
-
- {COLORS.map((paletteColor) => ( -
-
- -
- -