import React from "react"; import { useRouter } from "next/router"; import { mutate } from "swr"; // headless ui import { Disclosure, Transition } from "@headlessui/react"; // services import { IssueLabelService } from "services/issue"; // ui import { CustomMenu } from "@plane/ui"; // icons import { ChevronDown, Component, Pencil, Plus, Trash2, X } from "lucide-react"; // types import { IUser, IIssueLabels } from "types"; // fetch-keys import { PROJECT_ISSUE_LABELS } from "constants/fetch-keys"; type Props = { label: IIssueLabels; labelChildren: IIssueLabels[]; addLabelToGroup: (parentLabel: IIssueLabels) => void; editLabel: (label: IIssueLabels) => void; handleLabelDelete: () => void; user: IUser | undefined; }; // services const issueLabelService = new IssueLabelService(); export const SingleLabelGroup: React.FC = ({ label, labelChildren, addLabelToGroup, editLabel, handleLabelDelete, user, }) => { const router = useRouter(); const { workspaceSlug, projectId } = router.query; const removeFromGroup = (label: IIssueLabels) => { if (!workspaceSlug || !projectId) return; mutate( PROJECT_ISSUE_LABELS(projectId as string), (prevData) => prevData?.map((l) => { if (l.id === label.id) return { ...l, parent: null }; return l; }), false ); issueLabelService .patchIssueLabel( workspaceSlug as string, projectId as string, label.id, { parent: null, }, user ) .then(() => { mutate(PROJECT_ISSUE_LABELS(projectId as string)); }); }; return ( {({ open }) => ( <>
{label.name}
addLabelToGroup(label)}> Add more labels editLabel(label)}> Edit label Delete label
{labelChildren.map((child) => (
{child.name}
} > removeFromGroup(child)}> Remove from group editLabel(child)}> Edit label
))}
)}
); };