import { FC } from "react"; // react-hook-form import { Control, Controller, UseFormWatch } from "react-hook-form"; // hooks import useProjects from "hooks/use-projects"; // components import { SelectRepository, TFormValues, TIntegrationSteps } from "components/integration"; // ui import { CustomSearchSelect, PrimaryButton, SecondaryButton, ToggleSwitch } from "components/ui"; // helpers import { truncateText } from "helpers/string.helper"; // types import { IWorkspaceIntegration } from "types"; type Props = { handleStepChange: (value: TIntegrationSteps) => void; integration: IWorkspaceIntegration | false | undefined; control: Control; watch: UseFormWatch; }; export const GithubImportData: FC = ({ handleStepChange, integration, control, watch }) => { const { projects } = useProjects(); const options = projects ? projects.map((project) => ({ value: project.id, query: project.name, content:

{truncateText(project.name, 25)}

, })) : undefined; return (

Select Repository

Select the repository that you want the issues to be imported from.

{integration && ( ( Select Repository ) } onChange={onChange} characterLimit={50} /> )} /> )}

Select Project

Select the project to import the issues to.

{projects && ( ( p.id === value)?.name ) : ( Select Project ) } onChange={onChange} options={options} optionsClassName="w-full" /> )} /> )}

Sync Issues

Set whether you want to sync the issues or not.

( onChange(!value)} /> )} />
handleStepChange("import-configure")}>Back handleStepChange("repo-details")} disabled={!watch("github") || !watch("project")} > Next
); };