import React, { useState } from "react"; import useSWR from "swr"; import { useRouter } from "next/router"; // component import { CustomSearchSelect, CustomSelect, ToggleSwitch } from "components/ui"; import { SelectMonthModal } from "components/automation"; // icons import { ChevronDownIcon, Squares2X2Icon } from "@heroicons/react/24/outline"; import { getStateGroupIcon } from "components/icons"; // services import stateService from "services/state.service"; // constants import { PROJECT_AUTOMATION_MONTHS } from "constants/project"; import { STATES_LIST } from "constants/fetch-keys"; // types import { IProject } from "types"; // helper import { getStatesList } from "helpers/state.helper"; type Props = { projectDetails: IProject | undefined; handleChange: (formData: Partial) => Promise; }; export const AutoCloseAutomation: React.FC = ({ projectDetails, handleChange }) => { const [monthModal, setmonthModal] = useState(false); const router = useRouter(); const { workspaceSlug, projectId } = router.query; const { data: stateGroups } = useSWR( workspaceSlug && projectId ? STATES_LIST(projectId as string) : null, workspaceSlug && projectId ? () => stateService.getStates(workspaceSlug as string, projectId as string) : null ); const states = getStatesList(stateGroups ?? {}); const options = states ?.filter((state) => state.group === "cancelled") .map((state) => ({ value: state.id, query: state.name, content: (
{getStateGroupIcon(state.group, "16", "16", state.color)} {state.name}
), })); const multipleOptions = options.length > 1; const defaultState = stateGroups && stateGroups.cancelled ? stateGroups.cancelled[0].id : null; const selectedOption = states?.find( (s) => s.id === projectDetails?.default_state ?? defaultState ); const currentDefaultState = states.find((s) => s.id === defaultState); const initialValues: Partial = { close_in: 1, default_state: defaultState, }; return ( <> setmonthModal(false)} handleChange={handleChange} />

Auto-close inactive issues

Plane will automatically close the issues that have not been updated for the configured time period.

{ if (projectDetails?.close_in === 0) { handleChange({ close_in: 1, default_state: defaultState }); } else { handleChange({ close_in: 0, default_state: null }); } }} size="sm" />
{projectDetails?.close_in !== 0 && (
Auto-close issues that are inactive for
{`${projectDetails?.close_in} Months`}
Auto-close Status
{selectedOption ? ( getStateGroupIcon(selectedOption.group, "16", "16", selectedOption.color) ) : currentDefaultState ? ( getStateGroupIcon( currentDefaultState.group, "16", "16", currentDefaultState.color ) ) : ( )} {selectedOption?.name ? selectedOption.name : currentDefaultState?.name ?? ( State )}
{multipleOptions && (
)}
); };