github/plane
0
0
Fork 1
mirror of https://github.com/makeplane/plane synced 2024-06-14 14:31:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

chore: user auth wrapper.

Browse Source
This commit is contained in:
Prateek Shourya 2024-02-15 18:24:01 +05:30
parent 5a6a754a70
commit 5ebd64d729
11 changed files with 188 additions and 106 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

56
god-mode/app/layout.tsx
View File

@ -1,6 +1,6 @@
// lib
import { ThemeProvider } from "lib/theme-provider";
import { ToastContextProvider } from "lib/toast-provider";
import AppWrapper from "lib/wrappers/app-wrapper";
import { UserAuthWrapper } from "lib/wrappers/user-auth-wrapper";
// components
import { InstanceSidebar } from "./sidebar";
import { InstanceHeader } from "./header";
@ -16,38 +16,26 @@ interface RootLayoutProps {
children: React.ReactNode;
}
export const RootLayout = async ({ children }: RootLayoutProps) => {
const isUserInstanceAdmin = true;
return (
<html lang="en">
<body className={`antialiased`}>
{/* <AuthWrapper> */}
{/* {isUserInstanceAdmin || true ? ( */}
<ThemeProvider
themes={["light", "dark"]}
defaultTheme="system"
enableSystem
>
<ToastContextProvider>
<div className="relative flex h-screen w-full overflow-hidden">
<InstanceSidebar />
<main className="relative flex h-full w-full flex-col overflow-hidden bg-custom-background-100">
<InstanceHeader />
<div className="h-full w-full overflow-hidden px-10 py-12">
<div className="relative h-full w-full overflow-x-hidden overflow-y-scroll">
{children}
</div>
export const RootLayout = async ({ children }: RootLayoutProps) => (
<html lang="en">
<body className={`antialiased`}>
<AppWrapper>
<UserAuthWrapper>
<div className="relative flex h-screen w-full overflow-hidden">
<InstanceSidebar />
<main className="relative flex h-full w-full flex-col overflow-hidden bg-custom-background-100">
<InstanceHeader />
<div className="h-full w-full overflow-hidden px-10 py-12">
<div className="relative h-full w-full overflow-x-hidden overflow-y-scroll">
{children}
</div>
</main>
</div>
</ToastContextProvider>
</ThemeProvider>
{/* ) : (
<div>Login</div>
)} */}
</body>
</html>
);
};
</div>
</main>
</div>
</UserAuthWrapper>
</AppWrapper>
</body>
</html>
);
export default RootLayout;

60
god-mode/app/page.tsx
View File

@ -1,41 +1,51 @@
"use client";
import useSWR from "swr";
import useSWRImmutable from "swr/immutable";
import { observer } from "mobx-react-lite";
// hooks
import useUser from "hooks/use-user";
import useInstance from "hooks/use-instance";
// ui
import { Loader } from "@plane/ui";
// components
import { GeneralView } from "components/views";
import { InstanceGeneralForm } from "components/forms";
export default function Home() {
const {
// isUserInstanceAdmin,
fetchCurrentUser,
fetchCurrentUserInstanceAdminStatus,
} = useUser();
const { fetchInstanceInfo, fetchInstanceAdmins } = useInstance();
const GeneralSettingsPage = observer(() => {
// store
const { instance, instanceAdmins, fetchInstanceInfo, fetchInstanceAdmins } =
useInstance();
// fetching user information
useSWR("CURRENT_USER_DETAILS", () => fetchCurrentUser(), {
shouldRetryOnError: false,
});
// fetching current user instance admin status
useSWRImmutable(
"CURRENT_USER_INSTANCE_ADMIN_STATUS",
() => fetchCurrentUserInstanceAdminStatus(),
{
shouldRetryOnError: false,
}
);
// fetching instance information
useSWR("INSTANCE_INFO", () => fetchInstanceInfo());
// fetching instance admins
useSWR("INSTANCE_ADMINS", () => fetchInstanceAdmins());
return (
<div className="flex">
<GeneralView />
<div className="flex h-full w-full flex-col gap-8">
<div className="mb-2 border-b border-custom-border-100 pb-3">
<div className="pb-1 text-xl font-medium text-custom-text-100">
ID your instance easily
</div>
<div className="text-sm font-normal text-custom-text-300">
Change the name of your instance and instance admin e-mail addresses.
If you have a paid subscription, you will find your license key here.
</div>
</div>
{instance && instanceAdmins ? (
<InstanceGeneralForm
instance={instance}
instanceAdmins={instanceAdmins}
/>
) : (
<Loader className="space-y-4">
<div className="grid grid-cols-2 gap-x-8 gap-y-4">
<Loader.Item height="50px" />
<Loader.Item height="50px" />
</div>
<Loader.Item height="50px" />
</Loader>
)}
</div>
);
}
});
export default GeneralSettingsPage;

38
god-mode/components/views/general-view.tsx
View File

@ -1,38 +0,0 @@
import { observer } from "mobx-react-lite";
// hooks
import useInstance from "hooks/use-instance";
// ui
import { Loader } from "@plane/ui";
// components
import { InstanceGeneralForm } from "components/forms";
export const GeneralView = observer(() => {
const { instance, instanceAdmins } = useInstance();
return (
<div className="flex h-full w-full flex-col gap-8">
<div className="mb-2 border-b border-custom-border-100 pb-3">
<div className="pb-1 text-xl font-medium text-custom-text-100">
ID your instance easily
</div>
<div className="text-sm font-normal text-custom-text-300">
Change the name of your instance and instance admin e-mail addresses.
If you have a paid subscription, you will find your license key here.
</div>
</div>
{instance && instanceAdmins ? (
<InstanceGeneralForm
instance={instance}
instanceAdmins={instanceAdmins}
/>
) : (
<Loader className="space-y-4">
<div className="grid grid-cols-2 gap-x-8 gap-y-4">
<Loader.Item height="50px" />
<Loader.Item height="50px" />
</div>
<Loader.Item height="50px" />
</Loader>
)}
</div>
);
});

1
god-mode/components/views/index.ts
View File

@ -1 +0,0 @@
export * from "./general-view";

8
god-mode/constants/swr-config.ts Normal file
View File

@ -0,0 +1,8 @@
export const SWR_CONFIG = {
refreshWhenHidden: false,
revalidateIfStale: false,
revalidateOnFocus: false,
revalidateOnMount: true,
refreshInterval: 600000,
errorRetryCount: 3,
};

3
god-mode/helpers/common.helper.ts Normal file
View File

@ -0,0 +1,3 @@
export const API_BASE_URL = process.env.NEXT_PUBLIC_API_BASE_URL
? process.env.NEXT_PUBLIC_API_BASE_URL
: "";

53
god-mode/lib/wrappers/app-wrapper.tsx Normal file
View File

@ -0,0 +1,53 @@
"use client";
import { FC, ReactNode, useEffect } from "react";
import { observer } from "mobx-react-lite";
import { SWRConfig } from "swr";
// lib
import { ThemeProvider } from "lib/theme-provider";
import { ToastContextProvider } from "lib/toast-provider";
// hooks
import useAppTheme from "hooks/use-theme";
import useUser from "hooks/use-user";
// constants
import { SWR_CONFIG } from "constants/swr-config";
interface IAppWrapper {
children: ReactNode;
}
const AppWrapper: FC<IAppWrapper> = observer(({ children }) => {
// store hooks
const { sidebarCollapsed, toggleSidebar } = useAppTheme();
const { currentUser } = useUser();
/**
* Sidebar collapsed fetching from local storage
*/
useEffect(() => {
const localValue =
localStorage && localStorage.getItem("god_mode_sidebar_collapsed");
const localBoolValue = localValue
? localValue === "true"
? true
: false
: false;
if (localValue && sidebarCollapsed === undefined)
toggleSidebar(localBoolValue);
}, [sidebarCollapsed, currentUser, toggleSidebar]);
return (
<ThemeProvider
themes={["light", "dark"]}
defaultTheme="system"
enableSystem
>
<ToastContextProvider>
<SWRConfig value={SWR_CONFIG}>{children}</SWRConfig>
</ToastContextProvider>
</ThemeProvider>
);
});
export default AppWrapper;

61
god-mode/lib/wrappers/user-auth-wrapper.tsx Normal file
View File

@ -0,0 +1,61 @@
"use client";
import { FC, ReactNode } from "react";
// import { useRouter, usePathname } from "next/navigation";
import { observer } from "mobx-react-lite";
import useSWR from "swr";
import useSWRImmutable from "swr/immutable";
// hooks
import useUser from "hooks/use-user";
// ui
import { Spinner } from "@plane/ui";
export interface IUserAuthWrapper {
children: ReactNode;
}
export const UserAuthWrapper: FC<IUserAuthWrapper> = observer((props) => {
const { children } = props;
// store hooks
const {
currentUser,
currentUserLoader,
currentUserError,
fetchCurrentUser,
fetchCurrentUserInstanceAdminStatus,
} = useUser();
// router
// const router = useRouter();
// const pathname = usePathname();
// fetching user information
useSWR("CURRENT_USER_DETAILS", () => fetchCurrentUser(), {
shouldRetryOnError: false,
});
// fetching current user instance admin status
useSWRImmutable(
"CURRENT_USER_INSTANCE_ADMIN_STATUS",
() => fetchCurrentUserInstanceAdminStatus(),
{
shouldRetryOnError: false,
}
);
if (currentUserLoader && !currentUser && !currentUserError) {
return (
<div className="grid h-screen place-items-center bg-custom-background-100 p-4">
<div className="flex flex-col items-center gap-3 text-center">
<Spinner />
</div>
</div>
);
}
// TODO: Login page
if (currentUserError) {
// router.push(`/?next_path=${pathname}`);
// return null;
return <div>Login Page</div>;
}
return <>{children}</>;
});

4
god-mode/services/auth.service.ts
View File

@ -8,8 +8,8 @@ import {
IMagicSignInData,
IPasswordSignInData,
} from "@plane/types";
const API_BASE_URL = process.env.NEXT_PUBLIC_API_BASE_URL ? process.env.NEXT_PUBLIC_API_BASE_URL : "";
// helpers
import { API_BASE_URL } from "helpers/common.helper";
export class AuthService extends APIService {
constructor() {

4
god-mode/services/instance.service.ts
View File

@ -1,8 +1,8 @@
import { APIService } from "services/api.service";
// types
import type { IFormattedInstanceConfiguration, IInstance, IInstanceAdmin, IInstanceConfiguration } from "@plane/types";
const API_BASE_URL = process.env.NEXT_PUBLIC_API_BASE_URL ? process.env.NEXT_PUBLIC_API_BASE_URL : "";
// helpers
import { API_BASE_URL } from "helpers/common.helper";
export class InstanceService extends APIService {
constructor() {

6
god-mode/services/user.service.ts
View File

@ -2,10 +2,8 @@
import { APIService } from "services/api.service";
// types
import type { IUser, IInstanceAdminStatus } from "@plane/types";
const API_BASE_URL = process.env.NEXT_PUBLIC_API_BASE_URL
? process.env.NEXT_PUBLIC_API_BASE_URL
: "";
// helpers
import { API_BASE_URL } from "helpers/common.helper";
export class UserService extends APIService {
constructor() {