diff --git a/src/app/layout.tsx b/src/app/layout.tsx index dd5adbc..a23bc7e 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -15,6 +15,7 @@ import { ModalsProvider } from "@mantine/modals"; import { Notifications } from "@mantine/notifications"; import { theme } from "@/styles/theme"; import { AppProvider } from "./provider"; +import SuperTokensProvider from "@/components/auth/SuperTokensProvider"; /** * Basic configuration for wrapper services @@ -55,14 +56,19 @@ export default function RootLayout({ /> - - - - {children} - - - - + + + + + {children} + + + + + ); diff --git a/src/components/auth/SessionAuthWithRoles.tsx b/src/components/auth/SessionAuthWithRoles.tsx index 7e4cfa5..623b968 100644 --- a/src/components/auth/SessionAuthWithRoles.tsx +++ b/src/components/auth/SessionAuthWithRoles.tsx @@ -1,12 +1,11 @@ +"use client"; + import React, { PropsWithChildren, useEffect, useState } from "react"; import { useUserRoles } from "@/components/auth/hooks/useUserRoles"; import { SessionAuth } from "supertokens-auth-react/recipe/session"; import { EUserRoles } from "@/components/auth/roles"; import { UserRoleClaim } from "supertokens-auth-react/recipe/userroles"; -import CenteredLoading from "@/components/general/CenteredLoading"; -import { Stack } from "@mantine/core"; import { AccessDeniedScreen } from "supertokens-auth-react/recipe/session/prebuiltui"; -import { redirectToAuth } from "supertokens-auth-react"; interface Props extends PropsWithChildren { roles: EUserRoles[]; diff --git a/src/components/auth/SuperTokensProvider.tsx b/src/components/auth/SuperTokensProvider.tsx index 4620965..2084142 100755 --- a/src/components/auth/SuperTokensProvider.tsx +++ b/src/components/auth/SuperTokensProvider.tsx @@ -1,3 +1,5 @@ +"use client"; + import SuperTokensReact, { SuperTokensWrapper } from "supertokens-auth-react"; import React from "react"; import Session from "supertokens-auth-react/recipe/session"; @@ -9,68 +11,66 @@ import { usePathname, useRouter } from "next/navigation"; const IS_DEV = process.env.NODE_ENV !== "production"; const routerInfo: { router?: ReturnType; pathName?: string } = - {}; + {}; export function setRouter( - router: ReturnType, - pathName: string + router: ReturnType, + pathName: string, ) { - routerInfo.router = router; - routerInfo.pathName = pathName; + routerInfo.router = router; + routerInfo.pathName = pathName; } export const frontendConfig = (): SuperTokensConfig => { - return { - appInfo: { - appName: "GameNode Admin", - apiDomain: process.env.NEXT_PUBLIC_DOMAIN_SERVER as string, - websiteDomain: process.env.NEXT_PUBLIC_DOMAIN_WEBSITE as string, - apiBasePath: "/v1/auth", - websiteBasePath: "/auth", - }, - recipeList: [ - Passwordless.init({ - contactMethod: "EMAIL", - }), - ThirdParty.init({ - signInAndUpFeature: { - providers: [ - // TODO: Enable once it's approved - // ThirdPartyPasswordlessReact.Google.init(), - ThirdParty.Discord.init(), - ], - }, - }), - Session.init({ - sessionTokenFrontendDomain: IS_DEV - ? undefined - : (process.env.NEXT_PUBLIC_SESSION_DOMAIN as string), - }), - ], - getRedirectionURL: async () => { - return "/dashboard"; - }, - windowHandler: (original) => ({ - ...original, - location: { - ...original.location, - getPathName: () => routerInfo.pathName!, - assign: (url) => routerInfo.router!.push(url.toString()), - setHref: (url) => routerInfo.router!.push(url.toString()), - }, - }), - }; + return { + appInfo: { + appName: "GameNode Admin", + apiDomain: process.env.NEXT_PUBLIC_DOMAIN_SERVER as string, + websiteDomain: process.env.NEXT_PUBLIC_DOMAIN_WEBSITE as string, + apiBasePath: "/v1/auth", + websiteBasePath: "/auth", + }, + recipeList: [ + Passwordless.init({ + contactMethod: "EMAIL", + }), + ThirdParty.init({ + signInAndUpFeature: { + providers: [ + // TODO: Enable once it's approved + // ThirdPartyPasswordlessReact.Google.init(), + ThirdParty.Discord.init(), + ], + }, + }), + Session.init({ + sessionTokenFrontendDomain: IS_DEV + ? undefined + : (process.env.NEXT_PUBLIC_SESSION_DOMAIN as string), + }), + ], + windowHandler: (original) => ({ + ...original, + location: { + ...original.location, + getPathName: () => routerInfo.pathName!, + assign: (url) => routerInfo.router!.push(url.toString()), + setHref: (url) => routerInfo.router!.push(url.toString()), + }, + }), + }; }; if (typeof window !== "undefined") { - // we only want to call this init function on the frontend, so we check typeof window !== 'undefined' - SuperTokensReact.init(frontendConfig()); + // we only want to call this init function on the frontend, so we check typeof window !== 'undefined' + console.log("Supertokens init with routerInfo: ", routerInfo); + SuperTokensReact.init(frontendConfig()); } const SuperTokensProvider = ({ children }: { children: React.ReactNode }) => { - setRouter(useRouter(), usePathname() || window.location.pathname); + setRouter(useRouter(), usePathname() || window.location.pathname); - return {children}; + return {children}; }; export default SuperTokensProvider;