fix: tsconfig

next.config.js

@@ -1,5 +1,5 @@
-const withOffline = require("next-offline");
 const withImages = require("next-images");
+const withOffline = require("next-offline");
 
 module.exports = withOffline(
   withImages({

src/components/Header/index.tsx

@@ -1,9 +1,19 @@
 import React from "react";
+
+// Libraries
 import clsx from "clsx";
+
+// Authentication
 import { useSession } from "next-auth/client";
+
+// Routes
+import { homeRoutes, authRoutes } from "./routes";
+
+// Components
 import NavLink from "../NavLink";
 import UserIcon from "./UserIcon";
-import { homeRoutes, authRoutes } from "./routes";
+
+// Styling
 import classes from "./Header.module.scss";
 
 interface PropTypes {
@@ -27,8 +37,13 @@ const Header: React.FC<PropTypes> = ({ currentRoute }) => {
   return (
     <div className={classes.root}>
       <NavLink href="/" key="Logo">
-        <img src="/static/text-logo.png" className={classes.headerImg} />
+        <img
+          alt="Bits of Good Logo"
+          src="/static/text-logo.png"
+          className={classes.headerImg}
+        />
       </NavLink>
+
       {routes.map(({ name, link }) => (
         <NavLink href={link} key={name}>
           <div
@@ -41,6 +56,7 @@ const Header: React.FC<PropTypes> = ({ currentRoute }) => {
           </div>
         </NavLink>
       ))}
+
       {!loading && <UserIcon />}
     </div>
   );

src/screens/App/Home/index.tsx

@@ -1,3 +1,34 @@
-import HomePage from "./HomePage";
+import React from "react";
+import { useRouter } from "next/router";
+import { useSession } from "next-auth/client";
+import urls from "../../../../utils/urls";
+import classes from "./HomePage.module.scss";
+
+const HomePage: React.FC = () => {
+  const router = useRouter();
+  const [session, loading] = useSession();
+
+  React.useEffect(() => {
+    if (!loading && !session) {
+      void router.replace(urls.pages.index);
+    }
+  }, [router, loading, session]);
+
+  if (loading) {
+    return <h1>Loading...</h1>;
+  }
+
+  return (
+    <div className={classes.root}>
+      <h2 className={classes.centerText}>
+        Welcome to our app, {session?.user?.name ?? "User"}!
+      </h2>
+      <h3>
+        This page can only be accessed by logged-in users, because _app.js
+        reroutes users who are not logged-in away from this page.
+      </h3>
+    </div>
+  );
+};
 
 export default HomePage;

tsconfig.json

@@ -1,28 +1,35 @@
 {
   "compilerOptions": {
-    "target": "es5",
-    "lib": ["dom", "dom.iterable", "esnext"],
+    /* Basic Options */
+    "jsx": "react",
+    "lib": ["es6"],
+    "noEmit": true,
     "allowJs": true,
+    "target": "esnext",
+    "module": "commonjs",
+    "isolatedModules": true,
+
+    /* Strict Type-Checking Options */
+    "strict": true /* Enable all strict type-checking options. */,
     "skipLibCheck": true,
-    "strict": true,
-    "forceConsistentCasingInFileNames": true,
-    "noEmit": true,
+
+    /* Module Resolution Options */
+    "baseUrl": "./src",
     "esModuleInterop": true,
-    "module": "esnext",
     "moduleResolution": "node",
+    "paths": {
+      "&pages/*": ["./pages/*"],
+      "&utils/*": ["../utils/*"],
+      "&styles/*": ["./styles/*"],
+      "&screens/*": ["./screens/*"],
+      "&actions/*": ["./actions/*"],
+      "&components/*": ["./components/*"]
+    },
+    "allowSyntheticDefaultImports": true,
+
+    /* Experimental Options */
     "resolveJsonModule": true,
-    "isolatedModules": true,
-    "jsx": "preserve",
-    "baseUrl": "."
+    "experimentalDecorators": true
   },
-  "exclude": ["node_modules"],
-  "include": [
-    "next-env.d.ts",
-    ".eslintrc.json",
-    "**/*.ts",
-    "**/*.tsx",
-    "**/*.js",
-    "**/*.jsx",
-    "**/*.json"
-  ]
+  "exclude": ["node_modules"]
 }