Add maintenance mode (#24)

aberonni · Mar 9, 2024 · ee5ab33 · ee5ab33
1 parent a3bb24c
commit ee5ab33
Show file tree

Hide file tree

Showing 7 changed files with 116 additions and 5 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -44,6 +44,7 @@
     "@trpc/react-query": "^10.43.6",
     "@trpc/server": "^10.43.6",
     "@upstash/ratelimit": "^1.0.0",
+    "@vercel/edge-config": "^1.1.0",
     "@vercel/speed-insights": "^1.0.10",
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.1.0",

diff --git a/src/middleware.ts b/src/middleware.ts
@@ -1,3 +1,50 @@
-export { default } from "next-auth/middleware";
+import { get } from "@vercel/edge-config";
+import { NextResponse } from "next/server";
+import type { NextRequest } from "next/server";
 
-export const config = { matcher: ["/user/(.*)", "/admin/(.*)"] };
+export const config = {
+  matcher: [
+    /*
+     * Match all request paths except for the ones starting with:
+     * - api (API routes)
+     * - _next/static (static files)
+     * - _next/image (image optimization files)
+     * - favicon.ico (favicon file)
+     */
+    {
+      source: "/((?!api|_next/static|_next/image|favicon.ico).*)?",
+      missing: [
+        { type: "header", key: "next-router-prefetch" },
+        { type: "header", key: "purpose", value: "prefetch" },
+      ],
+    },
+  ],
+};
+
+export async function middleware(request: NextRequest) {
+  let isInMaintenanceMode = false;
+
+  try {
+    isInMaintenanceMode =
+      // Don't show the maintenance page in development
+      process.env.VERCEL_ENV === "production" &&
+      // Check Edge Config to see if the maintenance page should be shown
+      ((await get("maintenanceMode")) ?? false);
+  } catch (e) {
+    // Edge Config not accessible, log the error
+    console.error(e);
+  }
+
+  if (isInMaintenanceMode) {
+    request.nextUrl.pathname = `/maintenance`;
+    return NextResponse.rewrite(request.nextUrl);
+  }
+
+  const response = NextResponse.next({
+    request: {
+      headers: request.headers,
+    },
+  });
+
+  return response;
+}
diff --git a/src/pages/maintenance.tsx b/src/pages/maintenance.tsx
@@ -0,0 +1,24 @@
+import Head from "next/head";
+
+export default function Maintenance() {
+  return (
+    <>
+      <Head>
+        <title>Maintenance Mode - ImprovDB</title>
+      </Head>
+      <div className="min-h-full">
+        <main>
+          <div className="relative mx-auto max-w-7xl p-6 text-center lg:pt-12">
+            <h1 className="scroll-m-20 text-4xl font-extrabold tracking-tight lg:text-5xl">
+              Under Maintenance
+            </h1>
+            <p className="mt-6 leading-7">
+              The website is undergoing scheduled maintenance. Please try
+              reloading the page in a few minutes.
+            </p>
+          </div>
+        </main>
+      </div>
+    </>
+  );
+}
diff --git a/src/pages/user/my-lesson-plans.tsx b/src/pages/user/my-lesson-plans.tsx
@@ -12,7 +12,7 @@ export default function MyLessonPlansPage() {
       <Head>
         <title>My Lesson Plans - ImprovDB</title>
       </Head>
-      <PageLayout title="My Lesson Plans">
+      <PageLayout title="My Lesson Plans" authenticatedOnly>
         <LessonPlanList queryResult={queryResult} showVisibility />
       </PageLayout>
     </>

diff --git a/src/pages/user/my-profile.tsx b/src/pages/user/my-profile.tsx
@@ -136,7 +136,7 @@ export default function MyProfile() {
       <Head>
         <title>My Profile - ImprovDB</title>
       </Head>
-      <PageLayout title="My Profile">
+      <PageLayout title="My Profile" authenticatedOnly>
         <MyProfileForm user={data} />
       </PageLayout>
     </>

diff --git a/src/pages/user/my-proposed-resources.tsx b/src/pages/user/my-proposed-resources.tsx
@@ -12,7 +12,7 @@ export default function MyProposedResources() {
       <Head>
         <title>My Proposed Resources - ImprovDB</title>
       </Head>
-      <PageLayout title="My Proposed Resources">
+      <PageLayout title="My Proposed Resources" authenticatedOnly>
         <p className="mb-6 leading-7">
           These are resources you have proposed to the community. You can see
           the status of each resource below. Resources that are "Pending