import React, { useState } from "react"; import { useRouter } from "next/router"; import { observer } from "mobx-react-lite"; import { Dialog, Transition } from "@headlessui/react"; // mobx store import { useMobxStore } from "lib/mobx/store-provider"; // services import { ProjectExportService } from "services/project"; // hooks import useToast from "hooks/use-toast"; // ui import { Button, CustomSearchSelect } from "@plane/ui"; // types import { IUser, IImporterService } from "types"; type Props = { isOpen: boolean; handleClose: () => void; data: IImporterService | null; user: IUser | undefined; provider: string | string[]; mutateServices: () => void; }; const projectExportService = new ProjectExportService(); export const Exporter: React.FC = observer((props) => { const { isOpen, handleClose, user, provider, mutateServices } = props; const [exportLoading, setExportLoading] = useState(false); const router = useRouter(); const { workspaceSlug } = router.query; const { project: projectStore } = useMobxStore(); const projects = workspaceSlug ? projectStore.projects[workspaceSlug.toString()] : undefined; const { setToastAlert } = useToast(); const options = projects?.map((project) => ({ value: project.id, query: project.name + project.identifier, content: (
{project.identifier} {project.name}
), })); const [value, setValue] = React.useState([]); const [multiple, setMultiple] = React.useState(false); const onChange = (val: any) => { setValue(val); }; const ExportCSVToMail = async () => { setExportLoading(true); if (workspaceSlug && user && typeof provider === "string") { const payload = { provider: provider, project: value, multiple: multiple, }; await projectExportService .csvExport(workspaceSlug as string, payload, user) .then(() => { mutateServices(); router.push(`/${workspaceSlug}/settings/exports`); setExportLoading(false); setToastAlert({ type: "success", title: "Export Successful", message: `You will be able to download the exported ${ provider === "csv" ? "CSV" : provider === "xlsx" ? "Excel" : provider === "json" ? "JSON" : "" } from the previous export.`, }); }) .catch(() => { setExportLoading(false); setToastAlert({ type: "error", title: "Error!", message: "Export was unsuccessful. Please try again.", }); }); } }; return (

Export to{" "} {provider === "csv" ? "CSV" : provider === "xlsx" ? "Excel" : provider === "json" ? "JSON" : ""}

onChange(val)} options={options} input={true} label={ value && value.length > 0 ? projects && projects .filter((p) => value.includes(p.id)) .map((p) => p.identifier) .join(", ") : "All projects" } optionsClassName="min-w-full" multiple />
setMultiple(!multiple)} className="flex items-center gap-2 max-w-min cursor-pointer" > setMultiple(!multiple)} />
Export the data into separate files
); });