Initialize maintenance mode

package.json

@@ -23,6 +23,7 @@
     "@types/node": "20.6.0",
     "@types/react": "18.2.21",
     "@types/react-dom": "18.2.7",
+    "@vercel/edge-config": "^0.4.1",
     "eslint": "8.49.0",
     "eslint-config-next": "13.4.19",
     "next": "^13.5.2",

src/app/[locale]/maintenance/page.module.css

@@ -0,0 +1,3 @@
+.main {
+  min-height: 100vh;
+}

src/app/[locale]/maintenance/page.tsx

@@ -0,0 +1,18 @@
+"use client";
+
+import { useI18n } from "@/i18n/client";
+import styles from "./page.module.css";
+
+export default function Home() {
+  const { t } = useI18n();
+
+  return (
+    <main className={styles.main}>
+      <div>{t("welcome")}</div>
+      <br />
+      <br />
+      <br />
+      <div>Maintenance page</div>
+    </main>
+  );
+}

src/middleware.ts

@@ -1,7 +1,8 @@
 import { chain } from "@/middleware/utils";
-import { withI18n } from "@/middleware/index";
+import { withI18n } from "@/middleware/withI18n";
+import { withMaintenance } from "@/middleware/withMaintenance";
 
-const middlewares = [withI18n];
+const middlewares = [withI18n, withMaintenance];
 
 export default chain(middlewares);
 

src/middleware/utils/index.ts

@@ -1,10 +1,11 @@
 // middlewares/stackMiddlewares
+import { LiveAppConfig, MiddlewareFactory } from "@/middleware/utils/types";
+import { get } from "@vercel/edge-config";
 import { NextMiddleware, NextResponse } from "next/server";
-
-export type MiddlewareFactory = (middleware: NextMiddleware) => NextMiddleware;
+import PackageJson from "~/package.json";
 
 /**
- * @dev Utils function in order to chain middlewares.
+ * Utils function in order to chain middlewares.
  */
 export function chain(functions: MiddlewareFactory[] = [], index = 0): NextMiddleware {
   const current = functions[index];
@@ -14,3 +15,10 @@ export function chain(functions: MiddlewareFactory[] = [], index = 0): NextMiddl
   }
   return () => NextResponse.next();
 }
+
+/**
+ * Get live app config from the Edge Config.
+ */
+export const getAppConfig = async (): Promise<LiveAppConfig | undefined> => {
+  return await get(PackageJson.name);
+};

src/middleware/utils/types.ts

@@ -0,0 +1,13 @@
+import { NextMiddleware } from "next/server";
+
+/**
+ * Middleware util types.
+ */
+export type MiddlewareFactory = (middleware: NextMiddleware) => NextMiddleware;
+
+/**
+ * Edge Config util types.
+ */
+export type LiveAppConfig = {
+  enabled: boolean;
+};

src/middleware/withI18n.ts

@@ -1,7 +1,7 @@
 // middlewares/withHeaders.ts
 import { NextFetchEvent, NextMiddleware, NextRequest } from "next/server";
 import { I18nMiddleware } from "@/i18n/middleware";
-import { MiddlewareFactory } from "@/middleware/utils";
+import { MiddlewareFactory } from "@/middleware/utils/types";
 
 export const withI18n: MiddlewareFactory = (next: NextMiddleware) => {
   return async (request: NextRequest, _next: NextFetchEvent) => {

src/middleware/withMaintenance.ts

@@ -0,0 +1,17 @@
+import { NextFetchEvent, NextMiddleware, NextRequest, NextResponse } from "next/server";
+import { MiddlewareFactory } from "@/middleware/utils/types";
+import { getAppConfig } from "@/middleware/utils";
+
+export const withMaintenance: MiddlewareFactory = (next: NextMiddleware) => {
+  return async (request: NextRequest, _next: NextFetchEvent) => {
+    await next(request, _next);
+
+    const appConfig = await getAppConfig();
+
+    if (appConfig && !appConfig.enabled) {
+      request.nextUrl.pathname = `/maintenance`;
+
+      return NextResponse.rewrite(request.nextUrl);
+    }
+  };
+};

tsconfig.json

@@ -25,8 +25,9 @@
       "@/middleware/*": ["./src/middleware/*"],
       "@/styles/*": ["./src/styles/*"],
       "@/redux/*": ["./src/redux/*"],
+      "@/hooks/*": ["./src/hooks/*"],
       "@/tools-test/*": ["./tools/test/*"],
-      "@/hooks/*": ["./src/hooks/*"]
+      "~/*": ["./*"]
     }
   },
   "include": [

yarn.lock

@@ -3383,6 +3383,18 @@
     "@typescript-eslint/types" "6.7.2"
     eslint-visitor-keys "^3.4.1"
 
+"@vercel/edge-config-fs@0.1.0":
+  version "0.1.0"
+  resolved "https://registry.yarnpkg.com/@vercel/edge-config-fs/-/edge-config-fs-0.1.0.tgz#cda8327f611418c1d1cbb28c6bed02d782be928b"
+  integrity sha512-NRIBwfcS0bUoUbRWlNGetqjvLSwgYH/BqKqDN7vK1g32p7dN96k0712COgaz6VFizAm9b0g6IG6hR6+hc0KCPg==
+
+"@vercel/edge-config@^0.4.1":
+  version "0.4.1"
+  resolved "https://registry.yarnpkg.com/@vercel/edge-config/-/edge-config-0.4.1.tgz#c247011dcd05ce6a6b4d17139215c8f684d83cb3"
+  integrity sha512-4Mc3H7lE+x4RrL17nY8CWeEorvJHbkNbQTy9p8H1tO7y11WeKj5xeZSr07wNgfWInKXDUwj5FZ3qd/jIzjPxug==
+  dependencies:
+    "@vercel/edge-config-fs" "0.1.0"
+
 "@xmldom/xmldom@^0.8.3":
   version "0.8.10"
   resolved "https://registry.yarnpkg.com/@xmldom/xmldom/-/xmldom-0.8.10.tgz#a1337ca426aa61cef9fe15b5b28e340a72f6fa99"