feat: allow controlling interface with environment variable

Author: pan93412

app/(app)/page.tsx

@@ -1,5 +1,10 @@
+import { ENABLE_STATISTICS_PAGE } from "@/lib/features";
 import { redirect } from "next/navigation";
 
 export default function App() {
+  if (!ENABLE_STATISTICS_PAGE) {
+    redirect("/challenges");
+  }
+
   redirect("/statistics");
 }

app/(app)/statistics/page.tsx

@@ -1,3 +1,6 @@
+import { Alert, AlertDescription, AlertTitle } from "@/components/ui/alert";
+import { ENABLE_STATISTICS_PAGE } from "@/lib/features";
+import { AlertCircle } from "lucide-react";
 import type { Metadata } from "next";
 import { Suspense } from "react";
 import Board from "./_components/board";
@@ -10,6 +13,19 @@ export const metadata: Metadata = {
 };
 
 export default function StatisticsPage() {
+  if (!ENABLE_STATISTICS_PAGE) {
+    return (
+      <Alert>
+        <AlertCircle />
+        <AlertTitle>系統管理員停用了「統計資料」頁面。</AlertTitle>
+        <AlertDescription>
+          如果您需要統計資料，請聯絡系統管理員開啟。<br />
+          如果您是系統管理員：請將環境變數中 NEXT_PUBLIC_FEATURE_STATISTICS_PAGE 的否定值改為 true。
+        </AlertDescription>
+      </Alert>
+    );
+  }
+
   return (
     <div>
       <Board />

app/login/page.tsx

@@ -1,4 +1,5 @@
 import { Logo } from "@/components/logo";
+import { ENABLE_SOCIAL_PLATFORM } from "@/lib/features";
 import type { Metadata } from "next";
 import Link from "next/link";
 import { Suspense } from "react";
@@ -59,13 +60,17 @@ export default async function LoginPage() {
               <UpstreamStatus />
             </Suspense>
 
-            <Separator />
+            {ENABLE_SOCIAL_PLATFORM && (
+              <>
+                <Separator />
 
-            <GithubLink />
+                <GithubLink />
 
-            <Separator />
+                <Separator />
 
-            <DiscordLink />
+                <DiscordLink />
+              </>
+            )}
           </div>
         </div>
       </div>

components/app-navbar.tsx

@@ -2,6 +2,7 @@ import AppAvatar from "@/components/avatar";
 import { Logo } from "@/components/logo";
 import { Button } from "@/components/ui/button";
 import useUser from "@/hooks/use-user";
+import { ENABLE_SOCIAL_PLATFORM, ENABLE_STATISTICS_PAGE } from "@/lib/features";
 import { cn } from "@/lib/utils";
 import { BarChart3, BookOpen, ChevronDown, Menu, MessageSquare, Swords, X } from "lucide-react";
 import Link from "next/link";
@@ -171,11 +172,13 @@ interface ExternalNavItem extends BaseNavItem {
 type NavItem = InternalNavItem | ExternalNavItem;
 
 const navItems: NavItem[] = [
-  {
-    icon: <BarChart3 className="h-full w-full" />,
-    label: "統計資料",
-    pathPrefix: "/statistics",
-  },
+  ENABLE_STATISTICS_PAGE
+    ? {
+      icon: <BarChart3 className="h-full w-full" />,
+      label: "統計資料",
+      pathPrefix: "/statistics",
+    }
+    : undefined,
   {
     icon: <Swords className="h-full w-full" />,
     label: "挑戰題目",
@@ -186,12 +189,14 @@ const navItems: NavItem[] = [
     label: "補充資料",
     pathPrefix: "/materials",
   },
-  {
-    icon: <MessageSquare className="h-full w-full" />,
-    label: "意見分享",
-    externalLink: "https://community.dbplay.app/discord",
-  },
-];
+  ENABLE_SOCIAL_PLATFORM
+    ? {
+      icon: <MessageSquare className="h-full w-full" />,
+      label: "意見分享",
+      externalLink: "https://community.dbplay.app/discord",
+    }
+    : undefined,
+].filter((item) => item !== undefined);
 
 function getActiveNavItemLabel(path: string): string | null {
   for (const item of navItems) {

lib/features.ts

@@ -0,0 +1,9 @@
+export const ENABLE_STATISTICS_PAGE = requireExplicitlyDisabled(process.env.NEXT_PUBLIC_FEATURE_STATISTICS_PAGE);
+export const ENABLE_SOCIAL_PLATFORM = requireExplicitlyDisabled(process.env.NEXT_PUBLIC_FEATURE_SOCIAL_PLATFORM);
+
+/**
+ * Return false if the feature is explicitly disabled; true otherwise.
+ */
+function requireExplicitlyDisabled(feature: string | undefined) {
+  return !(feature === "false" || feature === "0");
+}