fix: Add cache fix for request Usage

Added cache: 'no-store' parameter to fetch to avoid caching issue in non-Vercel deployment environment(ref: https://beta.nextjs.org/docs/data-fetching/fetching#dynamic-data-fetching)

app/api/common.ts

@@ -8,6 +8,8 @@ const BASE_URL = process.env.BASE_URL ?? OPENAI_URL;
 export async function requestOpenai(req: NextRequest) {
   const apiKey = req.headers.get("token");
   const openaiPath = req.headers.get("path");
+  const fetchCache =
+    req.headers.get("fetch-cache") == "enable" ? "default" : "no-store";
 
   let baseUrl = BASE_URL;
 
@@ -23,6 +25,7 @@ export async function requestOpenai(req: NextRequest) {
       "Content-Type": "application/json",
       Authorization: `Bearer ${apiKey}`,
     },
+    cache: fetchCache,
     method: req.method,
     body: req.body,
   });

app/components/settings.tsx

@@ -193,7 +193,7 @@ export function Settings(props: { closeSettings: () => void }) {
   const remoteId = updateStore.remoteVersion;
   const hasNewVersion = currentVersion !== remoteId;
 
-  function checkUpdate(force = false) {
+  function checkUpdate(force: boolean = false) {
     setCheckingUpdate(true);
     updateStore.getLatestVersion(force).then(() => {
       setCheckingUpdate(false);
@@ -205,9 +205,9 @@ export function Settings(props: { closeSettings: () => void }) {
     subscription: updateStore.subscription,
   };
   const [loadingUsage, setLoadingUsage] = useState(false);
-  function checkUsage() {
+  function checkUsage(force: boolean = false) {
     setLoadingUsage(true);
-    updateStore.updateUsage().finally(() => {
+    updateStore.updateUsage(true).finally(() => {
       setLoadingUsage(false);
     });
   }
@@ -499,7 +499,9 @@ export function Settings(props: { closeSettings: () => void }) {
               <IconButton
                 icon={<ResetIcon></ResetIcon>}
                 text={Locale.Settings.Usage.Check}
-                onClick={checkUsage}
+                onClick={() => {
+                  checkUsage(true);
+                }}
               />
             )}
           </SettingItem>

app/requests.ts

@@ -49,15 +49,17 @@ function getHeaders() {
 }
 
 export function requestOpenaiClient(path: string) {
-  return (body: any, method = "POST") =>
+  return (body: any, method: string = "POST", fetchCache: boolean = true) =>
     fetch("/api/openai?_vercel_no_cache=1", {
       method,
       headers: {
         "Content-Type": "application/json",
         path,
         ...getHeaders(),
+        "fetch-cache": fetchCache ? "enable" : "disable",
       },
       body: body && JSON.stringify(body),
+      cache: fetchCache ? "default" : "no-store", //https://beta.nextjs.org/docs/data-fetching/fetching#dynamic-data-fetching
     });
 }
 
@@ -75,6 +77,7 @@ export async function requestChat(messages: Message[]) {
 }
 
 export async function requestUsage() {
+  const useFetchCache = false;
   const formatDate = (d: Date) =>
     `${d.getFullYear()}-${(d.getMonth() + 1).toString().padStart(2, "0")}-${d
       .getDate()
@@ -89,8 +92,12 @@ export async function requestUsage() {
   const [used, subs] = await Promise.all([
     requestOpenaiClient(
       `dashboard/billing/usage?start_date=${startDate}&end_date=${endDate}`,
-    )(null, "GET"),
-    requestOpenaiClient("dashboard/billing/subscription")(null, "GET"),
+    )(null, "GET", useFetchCache),
+    requestOpenaiClient("dashboard/billing/subscription")(
+      null,
+      "GET",
+      useFetchCache,
+    ),
   ]);
 
   const response = (await used.json()) as {

app/store/update.ts

@@ -68,7 +68,7 @@ export const useUpdateStore = create<UpdateStore>()(
         }
       },
 
-      async updateUsage(force = false) {
+      async updateUsage(force: boolean = false) {
         const overOneMinute = Date.now() - get().lastUpdateUsage >= ONE_MINUTE;
         if (!overOneMinute && !force) return;