import { FC } from "react"; import { useRouter } from "next/router"; import { observer } from "mobx-react-lite"; import { ContrastIcon, FileText, Inbox, Layers } from "lucide-react"; import { DiceIcon, ToggleSwitch } from "@plane/ui"; // mobx store import { useMobxStore } from "lib/mobx/store-provider"; // hooks import useToast from "hooks/use-toast"; // types import { IProject } from "types"; type Props = {}; const PROJECT_FEATURES_LIST = [ { title: "Cycles", description: "Cycles are enabled for all the projects in this workspace. Access them from the sidebar.", icon: , property: "cycle_view", }, { title: "Modules", description: "Modules are enabled for all the projects in this workspace. Access it from the sidebar.", icon: , property: "module_view", }, { title: "Views", description: "Views are enabled for all the projects in this workspace. Access it from the sidebar.", icon: , property: "issue_views_view", }, { title: "Pages", description: "Pages are enabled for all the projects in this workspace. Access it from the sidebar.", icon: , property: "page_view", }, { title: "Inbox", description: "Inbox are enabled for all the projects in this workspace. Access it from the issues views page.", icon: , property: "inbox_view", }, ]; export const ProjectFeaturesList: FC = observer(() => { // router const router = useRouter(); const { workspaceSlug, projectId } = router.query; // store const { workspace: { currentWorkspace }, project: { currentProjectDetails, updateProject }, user: { currentUser, currentProjectRole }, trackEvent: { setTrackElement, postHogEventTracker }, } = useMobxStore(); const isAdmin = currentProjectRole === 20; // hooks const { setToastAlert } = useToast(); const handleSubmit = async (formData: Partial) => { if (!workspaceSlug || !projectId || !currentProjectDetails) return; setToastAlert({ type: "success", title: "Success!", message: "Project feature updated successfully.", }); updateProject(workspaceSlug.toString(), projectId.toString(), formData); }; if (!currentUser) return <>; return (
{PROJECT_FEATURES_LIST.map((feature) => (
{feature.icon}

{feature.title}

{feature.description}

{ console.log(currentProjectDetails?.[feature.property as keyof IProject]); setTrackElement("PROJECT_SETTINGS_FEATURES_PAGE"); postHogEventTracker(`TOGGLE_${feature.title.toUpperCase()}`, { workspace_id: currentWorkspace?.id, workspace_slug: currentWorkspace?.slug, project_id: currentProjectDetails?.id, project_name: currentProjectDetails?.name, project_identifier: currentProjectDetails?.identifier, enabled: !currentProjectDetails?.[feature.property as keyof IProject] }); handleSubmit({ [feature.property]: !currentProjectDetails?.[feature.property as keyof IProject], }); }} disabled={!isAdmin} size="sm" />
))}
); });