import React, { Fragment } from "react"; import { Tab } from "@headlessui/react"; // hooks import useLocalStorage from "hooks/use-local-storage"; // components import { SingleProgressStats } from "components/core"; // ui import { Avatar } from "@plane/ui"; // types import { ICycle } from "types"; type Props = { cycle: ICycle; }; export const ActiveCycleProgressStats: React.FC = ({ cycle }) => { const { storedValue: tab, setValue: setTab } = useLocalStorage("activeCycleTab", "Assignees"); const currentValue = (tab: string | null) => { switch (tab) { case "Assignees": return 0; case "Labels": return 1; default: return 0; } }; return ( { switch (i) { case 0: return setTab("Assignees"); case 1: return setTab("Labels"); default: return setTab("Assignees"); } }} > `px-3 py-1 text-custom-text-100 rounded-3xl border border-custom-border-200 ${ selected ? " bg-custom-primary text-white" : " hover:bg-custom-background-80" }` } > Assignees `px-3 py-1 text-custom-text-100 rounded-3xl border border-custom-border-200 ${ selected ? " bg-custom-primary text-white" : " hover:bg-custom-background-80" }` } > Labels {cycle && cycle.total_issues > 0 ? ( {cycle.distribution?.assignees?.map((assignee, index) => { if (assignee.assignee_id) return ( {assignee.display_name} } completed={assignee.completed_issues} total={assignee.total_issues} /> ); else return (
User
No assignee } completed={assignee.completed_issues} total={assignee.total_issues} /> ); })}
{cycle.distribution?.labels?.map((label, index) => ( {label.label_name ?? "No labels"} } completed={label.completed_issues} total={label.total_issues} /> ))}
) : (
No issues present in the cycle.
)}
); };