import { useState } from "react"; import Link from "next/link"; import Image from "next/image"; import { useRouter } from "next/router"; import useSWR, { mutate } from "swr"; import { observer } from "mobx-react-lite"; import { useTheme } from "next-themes"; // hooks import { useUser } from "hooks/store"; import useUserAuth from "hooks/use-user-auth"; // services import { IntegrationService } from "services/integrations"; // components import { DeleteImportModal, GithubImporterRoot, JiraImporterRoot, SingleImport } from "components/integration"; import { EmptyState, getEmptyStateImagePath } from "components/empty-state"; // ui import { Button } from "@plane/ui"; import { ImportExportSettingsLoader } from "components/ui"; // icons import { RefreshCw } from "lucide-react"; // types import { IImporterService } from "@plane/types"; // fetch-keys import { IMPORTER_SERVICES_LIST } from "constants/fetch-keys"; // constants import { IMPORTERS_LIST } from "constants/workspace"; import { WORKSPACE_SETTINGS_EMPTY_STATE_DETAILS } from "constants/empty-state"; // services const integrationService = new IntegrationService(); const IntegrationGuide = observer(() => { // states const [refreshing, setRefreshing] = useState(false); const [deleteImportModal, setDeleteImportModal] = useState(false); const [importToDelete, setImportToDelete] = useState(null); // router const router = useRouter(); const { workspaceSlug, provider } = router.query; // theme const { resolvedTheme } = useTheme(); // store hooks const { currentUser, currentUserLoader } = useUser(); // custom hooks const {} = useUserAuth({ user: currentUser, isLoading: currentUserLoader }); const { data: importerServices } = useSWR( workspaceSlug ? IMPORTER_SERVICES_LIST(workspaceSlug as string) : null, workspaceSlug ? () => integrationService.getImporterServicesList(workspaceSlug as string) : null ); const emptyStateDetail = WORKSPACE_SETTINGS_EMPTY_STATE_DETAILS["import"]; const isLightMode = resolvedTheme ? resolvedTheme === "light" : currentUser?.theme.theme === "light"; const emptyStateImage = getEmptyStateImagePath("workspace-settings", "imports", isLightMode); const handleDeleteImport = (importService: IImporterService) => { setImportToDelete(importService); setDeleteImportModal(true); }; return ( <> setDeleteImportModal(false)} data={importToDelete} user={currentUser} />
{(!provider || provider === "csv") && ( <> {/*
Relocation Guide
You can now transfer all the issues that you{"'"}ve created in other tracking services. This tool will guide you to relocate the issue to Plane.
Read More
*/} {IMPORTERS_LIST.map((service) => (
{`${service.title}

{service.title}

{service.description}

))}

Previous Imports

{importerServices ? ( importerServices.length > 0 ? (
{importerServices.map((service) => ( handleDeleteImport(service)} /> ))}
) : (
) ) : ( )}
)} {provider && provider === "github" && } {provider && provider === "jira" && }
); }); export default IntegrationGuide;