2023-02-22 07:41:00 +00:00
|
|
|
import { ReactElement, useEffect } from 'react';
|
2023-01-09 11:45:20 +00:00
|
|
|
import { GetServerSideProps } from 'next';
|
2022-09-06 07:38:31 +00:00
|
|
|
import dynamic from 'next/dynamic';
|
2022-12-28 19:22:54 +00:00
|
|
|
import Head from 'next/head';
|
2023-07-31 12:55:35 +00:00
|
|
|
import { EmailVerificationPreBuiltUI } from 'supertokens-auth-react/recipe/emailverification/prebuiltui';
|
2023-07-19 09:24:08 +00:00
|
|
|
import { ThirdPartyEmailPasswordPreBuiltUI } from 'supertokens-auth-react/recipe/thirdpartyemailpassword/prebuiltui';
|
|
|
|
|
import { getRoutingComponent } from 'supertokens-auth-react/ui';
|
2022-12-28 19:22:54 +00:00
|
|
|
import { FullLogo } from '@/components/common/Logo';
|
2022-10-04 12:30:21 +00:00
|
|
|
import { env } from '@/env/frontend';
|
2022-11-03 15:45:17 +00:00
|
|
|
import { startAuthFlowForProvider } from '@/lib/supertokens/start-auth-flow-for-provider';
|
|
|
|
|
import { startAuthFlowForOIDCProvider } from '@/lib/supertokens/third-party-email-password-react-oidc-provider';
|
|
|
|
|
|
|
|
|
|
export const getServerSideProps: GetServerSideProps = async context => {
|
|
|
|
|
// See counter-part in '@/config/supertokens/frontend.ts'
|
|
|
|
|
if (env.auth.organizationOIDC === true) {
|
|
|
|
|
const url = new URL(env.appBaseUrl + (context.req.url ?? ''));
|
|
|
|
|
const oidcProviderId = url.searchParams.get('id');
|
|
|
|
|
|
|
|
|
|
if (url.pathname === '/auth/oidc' && oidcProviderId) {
|
|
|
|
|
return {
|
|
|
|
|
props: {
|
|
|
|
|
oidcProviderId,
|
|
|
|
|
},
|
|
|
|
|
};
|
|
|
|
|
}
|
|
|
|
|
}
|
2022-09-06 07:38:31 +00:00
|
|
|
|
2022-09-24 18:51:35 +00:00
|
|
|
return {
|
2023-02-22 07:41:00 +00:00
|
|
|
props: { oidcProviderId: null },
|
2022-09-24 18:51:35 +00:00
|
|
|
};
|
2022-11-03 15:45:17 +00:00
|
|
|
};
|
2022-09-24 18:51:35 +00:00
|
|
|
|
2022-11-24 10:00:41 +00:00
|
|
|
const SuperTokensComponentNoSSR = dynamic(
|
2023-07-31 12:55:35 +00:00
|
|
|
() =>
|
|
|
|
|
Promise.resolve(() =>
|
|
|
|
|
getRoutingComponent([ThirdPartyEmailPasswordPreBuiltUI, EmailVerificationPreBuiltUI]),
|
|
|
|
|
),
|
2023-07-19 09:24:08 +00:00
|
|
|
{
|
|
|
|
|
ssr: false,
|
|
|
|
|
},
|
2022-11-24 10:00:41 +00:00
|
|
|
);
|
2022-09-06 07:38:31 +00:00
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* Route for showing the SuperTokens login page.
|
|
|
|
|
*/
|
2023-02-22 07:41:00 +00:00
|
|
|
export default function Auth(props: { oidcProviderId: string | null }): ReactElement {
|
|
|
|
|
useEffect(() => {
|
2022-11-03 15:45:17 +00:00
|
|
|
if (props.oidcProviderId) {
|
2022-11-28 12:41:11 +00:00
|
|
|
void startAuthFlowForOIDCProvider(props.oidcProviderId);
|
2022-11-03 15:45:17 +00:00
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// In case we are directed here from the Okta dashboard we automatically start the login flow.
|
|
|
|
|
const isOkta =
|
|
|
|
|
env.auth.okta !== null &&
|
|
|
|
|
new URLSearchParams(globalThis.window?.location.search ?? '').get('provider') === 'okta';
|
|
|
|
|
|
|
|
|
|
if (isOkta) {
|
2022-11-28 12:41:11 +00:00
|
|
|
void startAuthFlowForProvider('okta');
|
2022-11-03 15:45:17 +00:00
|
|
|
}
|
|
|
|
|
}, []);
|
|
|
|
|
|
2022-09-06 07:38:31 +00:00
|
|
|
return (
|
2023-02-22 07:41:00 +00:00
|
|
|
<div>
|
|
|
|
|
<Head>
|
|
|
|
|
<title>Welcome to GraphQL Hive</title>
|
|
|
|
|
<meta property="og:title" content="Welcome to GraphQL Hive" key="title" />
|
|
|
|
|
<meta
|
|
|
|
|
name="description"
|
|
|
|
|
content="An open-source registry of schemas with many additional features to enhance your day-to-day work with GraphQL"
|
|
|
|
|
key="description"
|
|
|
|
|
/>
|
|
|
|
|
<meta property="og:url" key="og:url" content="https://app.graphql-hive.com" />
|
|
|
|
|
<meta property="og:type" key="og:type" content="website" />
|
|
|
|
|
<meta
|
|
|
|
|
property="og:image"
|
|
|
|
|
key="og:image"
|
|
|
|
|
content="https://the-guild-og-image.vercel.app/**Manage%20your%20GraphQL%20APIs**.png?theme=light&md=1&fontSize=100px&images=https://graphql-hive.com/logo.svg&widths=800&heights=400"
|
|
|
|
|
/>
|
|
|
|
|
</Head>
|
|
|
|
|
<FullLogo
|
|
|
|
|
className="mx-auto my-5 text-yellow-500"
|
|
|
|
|
width={150}
|
|
|
|
|
color={{ main: '#fff', sub: '#fff' }}
|
|
|
|
|
/>
|
|
|
|
|
{props.oidcProviderId ? null : <SuperTokensComponentNoSSR />}
|
|
|
|
|
</div>
|
2022-09-06 07:38:31 +00:00
|
|
|
);
|
|
|
|
|
}
|
