import React, { useState } from "react"; import { useRouter } from "next/router"; import Link from "next/link"; import useSWR, { mutate } from "swr"; // services import { ProjectService, ProjectEstimateService } from "services/project"; // hooks import useProjectDetails from "hooks/use-project-details"; // layouts import { ProjectAuthorizationWrapper } from "layouts/auth-layout-legacy"; // components import { CreateUpdateEstimateModal, SingleEstimate } from "components/estimates"; import { SettingsSidebar } from "components/project"; //hooks import useToast from "hooks/use-toast"; import useUserAuth from "hooks/use-user-auth"; // ui import { BreadcrumbItem, Breadcrumbs, Button, Loader } from "@plane/ui"; import { EmptyState } from "components/common"; // icons import { Plus } from "lucide-react"; // images import emptyEstimate from "public/empty-state/estimate.svg"; // types import { IEstimate, IProject } from "types"; import type { NextPage } from "next"; // fetch-keys import { ESTIMATES_LIST, PROJECT_DETAILS } from "constants/fetch-keys"; // helper import { truncateText } from "helpers/string.helper"; // services const projectService = new ProjectService(); const projectEstimateService = new ProjectEstimateService(); const EstimatesSettings: NextPage = () => { const [estimateFormOpen, setEstimateFormOpen] = useState(false); const [estimateToUpdate, setEstimateToUpdate] = useState(); const router = useRouter(); const { workspaceSlug, projectId } = router.query; const { user } = useUserAuth(); const { setToastAlert } = useToast(); const { projectDetails } = useProjectDetails(); const { data: estimatesList } = useSWR( workspaceSlug && projectId ? ESTIMATES_LIST(projectId as string) : null, workspaceSlug && projectId ? () => projectEstimateService.getEstimatesList(workspaceSlug as string, projectId as string) : null ); const editEstimate = (estimate: IEstimate) => { setEstimateToUpdate(estimate); setEstimateFormOpen(true); }; const removeEstimate = (estimateId: string) => { if (!workspaceSlug || !projectId) return; mutate( ESTIMATES_LIST(projectId as string), (prevData) => (prevData ?? []).filter((p) => p.id !== estimateId), false ); projectEstimateService.deleteEstimate(workspaceSlug as string, projectId as string, estimateId, user).catch(() => { setToastAlert({ type: "error", title: "Error!", message: "Error: Estimate could not be deleted. Please try again", }); }); }; const disableEstimates = () => { if (!workspaceSlug || !projectId) return; mutate( PROJECT_DETAILS(projectId as string), (prevData) => { if (!prevData) return prevData; return { ...prevData, estimate: null }; }, false ); projectService.updateProject(workspaceSlug as string, projectId as string, { estimate: null }, user).catch(() => setToastAlert({ type: "error", title: "Error!", message: "Estimate could not be disabled. Please try again", }) ); }; return ( <> { setEstimateFormOpen(false); setEstimateToUpdate(undefined); }} user={user} /> router.back()}>

{`${truncateText(projectDetails?.name ?? "Project", 32)}`}

} /> } >

Estimates

{projectDetails?.estimate && ( )}
{estimatesList ? ( estimatesList.length > 0 ? (
{estimatesList.map((estimate) => ( editEstimate(estimate)} handleEstimateDelete={(estimateId) => removeEstimate(estimateId)} user={user} /> ))}
) : (
, text: "Add Estimate", onClick: () => { setEstimateToUpdate(undefined); setEstimateFormOpen(true); }, }} />
) ) : ( )}
); }; export default EstimatesSettings;