finish login story

src/pages/_app.tsx

@@ -0,0 +1,11 @@
+import { AppProps } from 'next/app';
+import * as React from 'react';
+import { InjectTypekitFont } from 'roleypoly/design-system/atoms/fonts';
+
+const App = (props: AppProps) => (
+    <>
+        <InjectTypekitFont />
+        <props.Component {...props.pageProps} />
+    </>
+);
+export default App;

src/pages/_document.tsx

@@ -0,0 +1,30 @@
+import Document, { DocumentContext } from 'next/document';
+import { ServerStyleSheet } from 'styled-components';
+
+export default class MyDocument extends Document {
+    static async getInitialProps(ctx: DocumentContext) {
+        const sheet = new ServerStyleSheet();
+        const originalRenderPage = ctx.renderPage;
+
+        try {
+            ctx.renderPage = () =>
+                originalRenderPage({
+                    enhanceApp: (App) => (props) =>
+                        sheet.collectStyles(<App {...props} />),
+                });
+
+            const initialProps = await Document.getInitialProps(ctx);
+            return {
+                ...initialProps,
+                styles: (
+                    <>
+                        {initialProps.styles}
+                        {sheet.getStyleElement()}
+                    </>
+                ),
+            };
+        } finally {
+            sheet.seal();
+        }
+    }
+}

src/pages/auth/login.tsx

@@ -0,0 +1,16 @@
+import * as React from 'react';
+import { AuthLogin } from 'roleypoly/design-system/templates/auth-login';
+
+const loginPage = () => {
+    const onSendSecretCode = (code: string) => {
+        console.log(code);
+    };
+    return (
+        <AuthLogin
+            onSendSecretCode={onSendSecretCode}
+            discordOAuthLink="http://localhost:6600/login-bounce"
+        />
+    );
+};
+
+export default loginPage;

src/pages/index.tsx

@@ -0,0 +1,5 @@
+import * as React from 'react';
+import { LandingTemplate } from 'roleypoly/design-system/templates/landing';
+
+const Index = () => <LandingTemplate />;
+export default Index;

src/pages/machinery/error.tsx

@@ -0,0 +1,17 @@
+import { NextPageContext } from 'next';
+import * as React from 'react';
+import { Error } from 'roleypoly/design-system/templates/errors';
+
+type Props = {
+    errorCode: string | number | any;
+};
+
+const ErrorPage = (props: Props) => <Error code={props.errorCode} />;
+
+ErrorPage.getInitialProps = (context: NextPageContext): Props => {
+    return {
+        errorCode: context.err || context.query.error_code,
+    };
+};
+
+export default ErrorPage;

src/pages/machinery/new-session.tsx

@@ -0,0 +1,27 @@
+import { NextPageContext } from 'next';
+import * as React from 'react';
+
+type Props = {
+    sessionID: string;
+};
+
+const NewSession = (props: Props) => {
+    const { sessionID } = props;
+    React.useEffect(() => {
+        sessionStorage.setItem('session_key', sessionID);
+        location.href = '/';
+    }, [sessionID]);
+
+    return <div>Logging you in...</div>;
+};
+
+NewSession.getInitialProps = (context: NextPageContext): Props => {
+    const sessionID = context.query.session_id;
+    if (!sessionID) {
+        throw new Error("I shouldn't be here today.");
+    }
+
+    return { sessionID: sessionID as string };
+};
+
+export default NewSession;