feat: dynamic config

app/store/access.ts

@@ -1,26 +1,33 @@
 import { create } from "zustand";
 import { persist } from "zustand/middleware";
-import { getClientSideConfig } from "../config/client";
 
 export interface AccessControlStore {
   accessCode: string;
   token: string;
 
+  needCode: boolean;
+
   updateToken: (_: string) => void;
   updateCode: (_: string) => void;
   enabledAccessControl: () => boolean;
   isAuthorized: () => boolean;
+  fetch: () => void;
 }
 
 export const ACCESS_KEY = "access-control";
 
+let fetchState = 0; // 0 not fetch, 1 fetching, 2 done
+
 export const useAccessStore = create<AccessControlStore>()(
   persist(
     (set, get) => ({
       token: "",
       accessCode: "",
+      needCode: true,
       enabledAccessControl() {
-        return !!getClientSideConfig()?.needCode;
+        get().fetch();
+
+        return get().needCode;
       },
       updateCode(code: string) {
         set((state) => ({ accessCode: code }));
@@ -34,6 +41,25 @@ export const useAccessStore = create<AccessControlStore>()(
           !!get().token || !!get().accessCode || !get().enabledAccessControl()
         );
       },
+      fetch() {
+        if (fetchState > 0) return;
+        fetchState = 1;
+        fetch("/api/config", {
+          method: "post",
+          body: null,
+        })
+          .then((res) => res.json())
+          .then((res: DangerConfig) => {
+            console.log("[Config] got config from server", res);
+            set(() => ({ ...res }));
+          })
+          .catch(() => {
+            console.error("[Config] failed to fetch config");
+          })
+          .finally(() => {
+            fetchState = 2;
+          });
+      },
     }),
     {
       name: ACCESS_KEY,

app/store/update.ts

@@ -1,28 +1,46 @@
 import { create } from "zustand";
 import { persist } from "zustand/middleware";
-import { getClientSideConfig } from "../config/client";
 import { FETCH_COMMIT_URL, FETCH_TAG_URL } from "../constant";
 
 export interface UpdateStore {
   lastUpdate: number;
-  remoteId: string;
+  remoteVersion: string;
 
-  getLatestCommitId: (force: boolean) => Promise<string>;
+  version: string;
+  getLatestVersion: (force: boolean) => Promise<string>;
 }
 
 export const UPDATE_KEY = "chat-update";
 
+function queryMeta(key: string, defaultValue?: string): string {
+  let ret: string;
+  if (document) {
+    const meta = document.head.querySelector(
+      `meta[name='${key}']`,
+    ) as HTMLMetaElement;
+    ret = meta?.content ?? "";
+  } else {
+    ret = defaultValue ?? "";
+  }
+
+  return ret;
+}
+
 export const useUpdateStore = create<UpdateStore>()(
   persist(
     (set, get) => ({
       lastUpdate: 0,
-      remoteId: "",
+      remoteVersion: "",
+
+      version: "unknown",
+
+      async getLatestVersion(force = false) {
+        set(() => ({ version: queryMeta("version") }));
 
-      async getLatestCommitId(force = false) {
         const overTenMins = Date.now() - get().lastUpdate > 10 * 60 * 1000;
         const shouldFetch = force || overTenMins;
         if (!shouldFetch) {
-          return getClientSideConfig()?.version ?? "";
+          return get().version ?? "unknown";
         }
 
         try {
@@ -32,13 +50,13 @@ export const useUpdateStore = create<UpdateStore>()(
           const remoteId = (data[0].sha as string).substring(0, 7);
           set(() => ({
             lastUpdate: Date.now(),
-            remoteId,
+            remoteVersion: remoteId,
           }));
           console.log("[Got Upstream] ", remoteId);
           return remoteId;
         } catch (error) {
           console.error("[Fetch Upstream Commit Id]", error);
-          return getClientSideConfig()?.version ?? "";
+          return get().version ?? "";
         }
       },
     }),