Refactor head

reacherhq · Dec 21, 2023 · 7d45d3f · 7d45d3f
1 parent d862ec8
commit 7d45d3f
Show file tree

Hide file tree

Showing 6 changed files with 38 additions and 62 deletions.
diff --git a/src/app/global-error.tsx b/src/app/global-error.tsx
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
diff --git a/src/components/Crisp.tsx b/src/components/Crisp.tsx
@@ -1,9 +1,19 @@
 /* eslint-disable @typescript-eslint/ban-ts-comment */
 
+import { useUser } from "@/util/useUser";
+import { useRouter } from "next/router";
 import { useEffect } from "react";
 
 export default function Crisp(): null {
+	const router = useRouter();
+	const { user } = useUser();
+
 	useEffect(() => {
+		// @ts-expect-error
+		window.CRISP_RUNTIME_CONFIG = {
+			locale: router.locale || "en",
+		};
+
 		// @ts-ignore
 		window.$crisp = [];
 		// @ts-ignore
@@ -18,5 +28,14 @@ export default function Crisp(): null {
 		})();
 	}, []);
 
+	useEffect(() => {
+		if (!user?.email) {
+			return;
+		}
+
+		// @ts-expect-error
+		window.$crisp.push(["set", "user:email", user.email]);
+	}, []);
+
 	return null;
 }
diff --git a/src/components/Head.tsx b/src/components/Head.tsx
diff --git a/src/components/Layout.tsx b/src/components/Layout.tsx
@@ -1,8 +1,8 @@
 import React, { ReactElement } from "react";
 
 import { Footer } from "./Footer";
-import { Head } from "./Head";
 import { Nav } from "./Nav";
+import Head from "next/head";
 
 export interface LayoutProps {
 	children: React.ReactChild;
@@ -11,7 +11,9 @@ export interface LayoutProps {
 export function Layout({ children }: LayoutProps): ReactElement {
 	return (
 		<>
-			<Head />
+			<Head>
+				<title>Reacher Dashboard</title>
+			</Head>
 			<Nav />
 			{children}
 			<Footer />

diff --git a/src/pages/_document.tsx b/src/pages/_document.tsx
@@ -2,10 +2,10 @@ import { CssBaseline } from "@geist-ui/react";
 import Document, {
 	DocumentContext,
 	DocumentInitialProps,
-	Head,
 	Html,
 	Main,
 	NextScript,
+	Head,
 } from "next/document";
 import React from "react";
 
@@ -30,7 +30,20 @@ export default class MyDocument extends Document {
 	render(): React.ReactElement {
 		return (
 			<Html>
-				<Head />
+				<Head>
+					<meta charSet="utf-8" />
+
+					<link rel="shortcut icon" href="/favicon.png" />
+
+					<link
+						rel="stylesheet"
+						href="https://unpkg.com/spectre.css/dist/spectre.min.css"
+					></link>
+					<link
+						rel="stylesheet"
+						href="https://unpkg.com/spectre.css/dist/spectre-icons.min.css"
+					></link>
+				</Head>
 				<body>
 					<Main />
 					<NextScript />