forked from github/plane
93 lines
3.0 KiB
TypeScript
93 lines
3.0 KiB
TypeScript
import { FC, ReactNode } from "react";
|
|
import { useRouter } from "next/router";
|
|
import { observer } from "mobx-react-lite";
|
|
import useSWR from "swr";
|
|
// hooks
|
|
import { useMobxStore } from "lib/mobx/store-provider";
|
|
// components
|
|
import { Spinner } from "@plane/ui";
|
|
import { JoinProject } from "components/auth-screens";
|
|
import { EmptyState } from "components/common";
|
|
// images
|
|
import emptyProject from "public/empty-state/project.svg";
|
|
|
|
interface IProjectAuthWrapper {
|
|
children: ReactNode;
|
|
}
|
|
|
|
export const ProjectAuthWrapper: FC<IProjectAuthWrapper> = observer((props) => {
|
|
const { children } = props;
|
|
// store
|
|
const { user: userStore, project: projectStore } = useMobxStore();
|
|
// router
|
|
const router = useRouter();
|
|
const { workspaceSlug, projectId } = router.query;
|
|
|
|
// fetching user project member information
|
|
useSWR(
|
|
workspaceSlug && projectId ? `PROJECT_MEMBERS_ME_${workspaceSlug}_${projectId}` : null,
|
|
workspaceSlug && projectId
|
|
? () => userStore.fetchUserProjectInfo(workspaceSlug.toString(), projectId.toString())
|
|
: null
|
|
);
|
|
// fetching project labels
|
|
useSWR(
|
|
workspaceSlug && projectId ? `PROJECT_LABELS_${workspaceSlug}_${projectId}` : null,
|
|
workspaceSlug && projectId
|
|
? () => projectStore.fetchProjectLabels(workspaceSlug.toString(), projectId.toString())
|
|
: null
|
|
);
|
|
// fetching project members
|
|
useSWR(
|
|
workspaceSlug && projectId ? `PROJECT_MEMBERS_${workspaceSlug}_${projectId}` : null,
|
|
workspaceSlug && projectId
|
|
? () => projectStore.fetchProjectMembers(workspaceSlug.toString(), projectId.toString())
|
|
: null
|
|
);
|
|
// fetching project states
|
|
useSWR(
|
|
workspaceSlug && projectId ? `PROJECT_STATES_${workspaceSlug}_${projectId}` : null,
|
|
workspaceSlug && projectId
|
|
? () => projectStore.fetchProjectStates(workspaceSlug.toString(), projectId.toString())
|
|
: null
|
|
);
|
|
|
|
// check if the project member apis is loading
|
|
if (!userStore.projectMemberInfo && userStore.hasPermissionToProject === null) {
|
|
return (
|
|
<div className="grid h-screen place-items-center p-4 bg-custom-background-100">
|
|
<div className="flex flex-col items-center gap-3 text-center">
|
|
<Spinner />
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
// check if the user don't have permission to access the project
|
|
if (userStore.hasPermissionToProject === false && !userStore.projectNotFound) {
|
|
<JoinProject />;
|
|
}
|
|
|
|
// check if the project info is not found.
|
|
if (userStore.hasPermissionToProject === false && userStore.projectNotFound) {
|
|
<div className="container grid h-screen place-items-center bg-custom-background-100">
|
|
<EmptyState
|
|
title="No such project exists"
|
|
description="Try creating a new project"
|
|
image={emptyProject}
|
|
primaryButton={{
|
|
text: "Create Project",
|
|
onClick: () => {
|
|
const e = new KeyboardEvent("keydown", {
|
|
key: "p",
|
|
});
|
|
document.dispatchEvent(e);
|
|
},
|
|
}}
|
|
/>
|
|
</div>;
|
|
}
|
|
|
|
return <>{children}</>;
|
|
});
|