coder · bryphe-coder · Jan 19, 2022 · Jan 19, 2022 · Jan 19, 2022 · Jan 19, 2022
diff --git a/site/pages/_app.tsx b/site/pages/_app.tsx
@@ -40,16 +40,27 @@ const Contents: React.FC<AppProps> = ({ Component, pageProps }) => {
   )
 }
 
+/**
+ * ClientRender is a component that only allows its children to be rendered
+ * client-side. This check is performed by querying the existence of the window
+ * global.
+ */
+const ClientRender: React.FC = ({ children }) => (
+  <div suppressHydrationWarning>{typeof window === "undefined" ? null : children}</div>
+)
+
 /**
  * <App /> is the root rendering logic of the application - setting up our router
  * and any contexts / global state management.
  */
 const MyApp: React.FC<AppProps> = (appProps) => {
   return (
-    <ThemeProvider theme={dark}>
-      <CssBaseline />
-      <Contents {...appProps} />
-    </ThemeProvider>
+    <ClientRender>
+      <ThemeProvider theme={dark}>
+        <CssBaseline />
+        <Contents {...appProps} />
+      </ThemeProvider>
+    </ClientRender>
   )
 }
 

diff --git a/site/pages/_document.tsx b/site/pages/_document.tsx
@@ -0,0 +1,33 @@
+import Document, { DocumentContext, Head, Html, Main, NextScript } from "next/document"
+import React from "react"
+
+class MyDocument extends Document {
+  // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
+  static async getInitialProps(ctx: DocumentContext) {
+    const initialProps = await Document.getInitialProps(ctx)
+    return { ...initialProps }
+  }
+
+  render(): JSX.Element {
+    return (
+      <Html>
+        <Head>
+          <meta charSet="utf-8" />
+          <meta name="theme-color" content="#17172E" />
+          <meta name="application-name" content="Coder" />
+          <meta property="og:type" content="website" />
+          <meta property="csp-nonce" content="{{ .CSP.Nonce }}" />
+          <link crossOrigin="use-credentials" rel="mask-icon" href="/static/favicon.svg" color="#000000" />
+          <link rel="alternate icon" type="image/png" href="/static/favicon.png" />
+          <link rel="icon" type="image/svg+xml" href="/static/favicon.svg" />
+        </Head>
+        <body>
+          <Main />
+          <NextScript />
+        </body>
+      </Html>
+    )
+  }
+}
+
+export default MyDocument
diff --git a/site/static/favicon.ico b/site/static/favicon.ico
diff --git a/site/static/favicon.png b/site/static/favicon.png
diff --git a/site/static/favicon.svg b/site/static/favicon.svg