feat: Move emails and protect dashboard sub-routes (#8)

.github/workflows/pr.yml

@@ -40,6 +40,18 @@ jobs:
       - name: Enforce formatting rules
         run: pnpm run check-format
 
+      - name: Create .env file
+        run: |
+          touch .env
+          echo "MONGODB_URI=${{ secrets.MONGODB_URI }}" >> .env
+          echo "NEXTAUTH_URL=${{ secrets.NEXTAUTH_URL }}" >> .env
+          echo "NEXTAUTH_SECRET=${{ secrets.NEXTAUTH_SECRET }}" >> .env
+          echo "SCF_GMAIL=${{ secrets.SCF_GMAIL }}" >> .env
+          echo "SCF_GMAIL_APP_PASSWORD=${{ secrets.SCF_GMAIL_APP_PASSWORD }}" >> .env
+
+      - name: Check that project builds
+        run: pnpm run build
+
       - name: Check that PR title follows conventional commits using regex
         env:
           TITLE: ${{ github.event.pull_request.title }}

package.json

@@ -10,9 +10,9 @@
     "check-lint": "next lint",
     "format": "prettier --write src",
     "check-format": "prettier --check src",
-    "email-dev": "email dev --dir ./src/emails",
-    "email-build": "email build --dir ./src/emails",
-    "email-export": "email export --dir ./src/emails"
+    "email-dev": "email dev --dir ./src/components/emails",
+    "email-build": "email build --dir ./src/components/emails",
+    "email-export": "email export --dir ./src/components/emails"
   },
   "dependencies": {
     "@emotion/cache": "^11.13.1",

src/app/dashboard/admin/page.tsx

@@ -1,3 +1,13 @@
+import { redirect } from "next/navigation";
+
+import getUserSession from "@/utils/getUserSession";
+
 export default async function AdminDashboardPage() {
+  const session = await getUserSession();
+
+  if (!session || session.user.role !== "admin") {
+    return redirect("/dashboard");
+  }
+
   return <p>Admin dashboard page</p>;
 }

src/app/dashboard/client/page.tsx

@@ -1,3 +1,13 @@
+import { redirect } from "next/navigation";
+
+import getUserSession from "@/utils/getUserSession";
+
 export default async function ClientDashboardPage() {
+  const session = await getUserSession();
+
+  if (!session || session.user.role !== "client") {
+    return redirect("/dashboard");
+  }
+
   return <p>Client dashboard page</p>;
 }

src/app/dashboard/page.tsx

@@ -1,13 +1,15 @@
 import { Typography } from "@mui/material";
 import { redirect } from "next/navigation";
 
-import getSession from "@/utils/getSession";
+import getUserSession from "@/utils/getUserSession";
 
 export default async function DashboardPage() {
-  const session = await getSession();
+  const session = await getUserSession();
 
   if (!session) {
-    return <Typography>You must be logged in to view this page</Typography>;
+    throw new Error(
+      "The dashboard page should be protected by a session middleware, so session should never be null",
+    );
   }
 
   const role = session.user.role;

src/app/test/client/page.tsx

@@ -1,5 +1,22 @@
 "use client";
 
+import { signOut } from "next-auth/react";
+
 export default function ClientComponentTestPage() {
-  return <p>Client component test page</p>;
+  const handleSignOut = () => {
+    signOut()
+      .then(() => {
+        alert("Signed out");
+      })
+      .catch(() => {
+        alert("Error signing out");
+      });
+  };
+
+  return (
+    <>
+      <p>Client component test page</p>
+      <button onClick={handleSignOut}>Sign out</button>
+    </>
+  );
 }

src/middleware.ts

@@ -1,3 +1,3 @@
 export { default } from "next-auth/middleware";
 
-export const config = { matcher: ["/dashboard"] };
+export const config = { matcher: ["/dashboard", "/dashboard/:path*"] };

src/utils/getSession.ts → src/utils/getUserSession.ts

@@ -3,7 +3,7 @@ import { getServerSession } from "next-auth";
 import authOptions from "@/app/api/auth/[...nextauth]/options";
 
 // get session in server components
-export default async function getSession() {
+export default async function getUserSession() {
   const session = await getServerSession(authOptions);
   return session;
 }