import React, { useEffect, useState } from "react"; // next import type { NextPage } from "next"; // hooks import useUser from "lib/hooks/useUser"; // hoc import withAuth from "lib/hoc/withAuthWrapper"; // layouts import AppLayout from "layouts/AppLayout"; // components import CreateProjectModal from "components/project/CreateProjectModal"; import ConfirmProjectDeletion from "components/project/ConfirmProjectDeletion"; // ui import { Button, Spinner } from "ui"; // types import { IProject } from "types"; // services import projectService from "lib/services/project.service"; import ProjectMemberInvitations from "components/project/memberInvitations"; import { ClipboardDocumentListIcon, PlusIcon } from "@heroicons/react/24/outline"; import { BreadcrumbItem, Breadcrumbs } from "ui/Breadcrumbs"; import { EmptySpace, EmptySpaceItem } from "ui/EmptySpace"; import HeaderButton from "ui/HeaderButton"; const Projects: NextPage = () => { const [isOpen, setIsOpen] = useState(false); const [deleteProject, setDeleteProject] = useState(); const [invitationsRespond, setInvitationsRespond] = useState([]); const { projects, activeWorkspace, mutateProjects } = useUser(); const handleInvitation = (project_invitation: any, action: "accepted" | "withdraw") => { if (action === "accepted") { setInvitationsRespond((prevData) => { return [...prevData, project_invitation.id]; }); } else if (action === "withdraw") { setInvitationsRespond((prevData) => { return prevData.filter((item: string) => item !== project_invitation.id); }); } }; const submitInvitations = () => { projectService .joinProject((activeWorkspace as any)?.slug, { project_ids: invitationsRespond }) .then(async (res: any) => { console.log(res); setInvitationsRespond([]); await mutateProjects(); }) .catch((err: any) => { console.log(err); }); }; useEffect(() => { if (isOpen) return; const timer = setTimeout(() => { setDeleteProject(undefined); clearTimeout(timer); }, 300); }, [isOpen]); return ( {projects ? ( <> {projects.length === 0 ? (
Use{" "}
Ctrl/Command + P
{" "} shortcut to create a new project } Icon={PlusIcon} action={() => setIsOpen(true)} />
) : (

Projects

setIsOpen(true)} />
{projects.map((item) => ( ))}
{invitationsRespond.length > 0 && (
)}
)} ) : (
)}
); }; export default withAuth(Projects);