feat: implement dashboard state management, API proxy layer, and modular UI components for weather monitoring and payments

frontend/app/api/cities/route.ts

@@ -1,13 +1,5 @@
 import { NextRequest, NextResponse } from "next/server";
-import {
-  applyAuthResponseCookies,
-  buildBackendRequestHeaders,
-} from "@/lib/backend-auth";
-import {
-  buildProxyExceptionResponse,
-  buildUpstreamErrorResponse,
-} from "@/lib/api-proxy";
-import { buildCachedJsonResponse } from "@/lib/http-cache";
+import { proxyBackendJsonGet } from "@/lib/api-proxy";
 
 const API_BASE = process.env.POLYWEATHER_API_BASE_URL;
 
@@ -20,30 +12,10 @@ export async function GET(req: NextRequest) {
     return response;
   }
 
-  try {
-    const auth = await buildBackendRequestHeaders(req, {
-      includeSupabaseIdentity: false,
-    });
-    const res = await fetch(`${API_BASE}/api/cities`, {
-      headers: auth.headers,
-      next: { revalidate: 60 },
-    });
-    if (!res.ok) {
-      const raw = await res.text();
-      const response = buildUpstreamErrorResponse(res.status, raw);
-      return applyAuthResponseCookies(response, auth.response);
-    }
-    const data = await res.json();
-    const response = buildCachedJsonResponse(
-      req,
-      data,
-      "public, max-age=0, s-maxage=60, stale-while-revalidate=300",
-    );
-    return applyAuthResponseCookies(response, auth.response);
-  } catch (error) {
-    const response = buildProxyExceptionResponse(error, {
-      publicMessage: "Failed to fetch cities",
-    });
-    return response;
-  }
+  return proxyBackendJsonGet(req, {
+    cacheControl: "public, max-age=0, s-maxage=60, stale-while-revalidate=300",
+    publicMessage: "Failed to fetch cities",
+    revalidateSeconds: 60,
+    url: `${API_BASE}/api/cities`,
+  });
 }

frontend/app/api/city/[name]/detail/route.ts

@@ -1,13 +1,5 @@
 import { NextRequest, NextResponse } from "next/server";
-import {
-  applyAuthResponseCookies,
-  buildBackendRequestHeaders,
-} from "@/lib/backend-auth";
-import {
-  buildProxyExceptionResponse,
-  buildUpstreamErrorResponse,
-} from "@/lib/api-proxy";
-import { buildCachedJsonResponse } from "@/lib/http-cache";
+import { proxyBackendJsonGet } from "@/lib/api-proxy";
 import { buildCityDetailProxyCachePolicy } from "@/lib/proxy-cache-policy";
 
 const API_BASE = process.env.POLYWEATHER_API_BASE_URL;
@@ -44,32 +36,12 @@ export async function GET(
   }
   const url = `${API_BASE}/api/city/${encodeURIComponent(name)}/detail?${searchParams.toString()}`;
 
-  try {
-    const auth = await buildBackendRequestHeaders(req, {
-      includeSupabaseIdentity: false,
-    });
-    const res = await fetch(url, {
-      headers: auth.headers,
-      ...(cachePolicy.fetchMode === "no-store"
-        ? { cache: "no-store" as const }
-        : { next: { revalidate: cachePolicy.revalidateSeconds ?? 15 } }),
-    });
-    if (!res.ok) {
-      const raw = await res.text();
-      const response = buildUpstreamErrorResponse(res.status, raw);
-      return applyAuthResponseCookies(response, auth.response);
-    }
-    const data = await res.json();
-    const response = buildCachedJsonResponse(
-      req,
-      data,
-      cachePolicy.responseCacheControl,
-    );
-    return applyAuthResponseCookies(response, auth.response);
-  } catch (error) {
-    const response = buildProxyExceptionResponse(error, {
-      publicMessage: "Failed to fetch city detail aggregate",
-    });
-    return response;
-  }
+  return proxyBackendJsonGet(req, {
+    cacheControl: cachePolicy.responseCacheControl,
+    fetchCache:
+      cachePolicy.fetchMode === "no-store" ? "no-store" : undefined,
+    publicMessage: "Failed to fetch city detail aggregate",
+    revalidateSeconds: cachePolicy.revalidateSeconds,
+    url,
+  });
 }

frontend/app/api/city/[name]/market-scan/route.ts

@@ -1,13 +1,6 @@
 import { NextRequest, NextResponse } from "next/server";
-import {
-  applyAuthResponseCookies,
-  buildBackendRequestHeaders,
-} from "@/lib/backend-auth";
-import {
-  buildProxyExceptionResponse,
-  buildUpstreamErrorResponse,
-} from "@/lib/api-proxy";
-import { buildCachedJsonResponse } from "@/lib/http-cache";
+import { proxyBackendJsonGet } from "@/lib/api-proxy";
+import { buildForceRefreshProxyCachePolicy } from "@/lib/proxy-cache-policy";
 
 const API_BASE = process.env.POLYWEATHER_API_BASE_URL;
 
@@ -27,6 +20,7 @@ export async function GET(
   const params = new URLSearchParams();
   const forceRefresh = req.nextUrl.searchParams.get("force_refresh") ?? "false";
   params.set("force_refresh", forceRefresh);
+  const cachePolicy = buildForceRefreshProxyCachePolicy(forceRefresh, 20);
 
   const targetDate = req.nextUrl.searchParams.get("target_date");
   if (targetDate) {
@@ -45,34 +39,15 @@ export async function GET(
 
   const url = `${API_BASE}/api/city/${encodeURIComponent(name)}/market-scan?${params.toString()}`;
 
-  try {
-    const auth = await buildBackendRequestHeaders(req, {
-      includeSupabaseIdentity: false,
-    });
-    const res = await fetch(url, {
-      headers: auth.headers,
-      next: { revalidate: 20 },
-    });
-    if (!res.ok) {
-      const raw = await res.text();
-      const response = buildUpstreamErrorResponse(res.status, raw, {
-        detailLimit: 800,
-        error: "Backend city market scan failed",
-      });
-      return applyAuthResponseCookies(response, auth.response);
-    }
-    const data = await res.json();
-    const response = buildCachedJsonResponse(
-      req,
-      data,
-      "public, max-age=0, s-maxage=20, stale-while-revalidate=60",
-    );
-    return applyAuthResponseCookies(response, auth.response);
-  } catch (error) {
-    const response = buildProxyExceptionResponse(error, {
-      publicMessage: "Failed to fetch city market scan",
-      status: 502,
-    });
-    return response;
-  }
+  return proxyBackendJsonGet(req, {
+    cacheControl: cachePolicy.responseCacheControl,
+    detailLimit: 800,
+    error: "Backend city market scan failed",
+    fetchCache:
+      cachePolicy.fetchMode === "no-store" ? "no-store" : undefined,
+    publicMessage: "Failed to fetch city market scan",
+    revalidateSeconds: cachePolicy.revalidateSeconds,
+    statusOnException: 502,
+    url,
+  });
 }

frontend/app/api/city/[name]/summary/route.ts

@@ -1,13 +1,6 @@
 import { NextRequest, NextResponse } from "next/server";
-import {
-  applyAuthResponseCookies,
-  buildBackendRequestHeaders,
-} from "@/lib/backend-auth";
-import {
-  buildProxyExceptionResponse,
-  buildUpstreamErrorResponse,
-} from "@/lib/api-proxy";
-import { buildCachedJsonResponse } from "@/lib/http-cache";
+import { proxyBackendJsonGet } from "@/lib/api-proxy";
+import { buildForceRefreshProxyCachePolicy } from "@/lib/proxy-cache-policy";
 
 const API_BASE = process.env.POLYWEATHER_API_BASE_URL;
 
@@ -25,50 +18,15 @@ export async function GET(
 
   const { name } = await context.params;
   const forceRefresh = req.nextUrl.searchParams.get("force_refresh") ?? "false";
-  const bypassCache = forceRefresh === "true";
+  const cachePolicy = buildForceRefreshProxyCachePolicy(forceRefresh, 20);
   const url = `${API_BASE}/api/city/${encodeURIComponent(name)}/summary?force_refresh=${forceRefresh}`;
 
-  try {
-    const auth = await buildBackendRequestHeaders(req, {
-      includeSupabaseIdentity: false,
-    });
-    const fetchOptions =
-      bypassCache
-        ? {
-            headers: auth.headers,
-            cache: "no-store" as const,
-          }
-        : {
-            headers: auth.headers,
-            next: { revalidate: 20 },
-          };
-    const res = await fetch(url, {
-      ...fetchOptions,
-    });
-    if (!res.ok) {
-      const raw = await res.text();
-      const response = buildUpstreamErrorResponse(res.status, raw);
-      return applyAuthResponseCookies(response, auth.response);
-    }
-    const data = await res.json();
-    if (bypassCache) {
-      const response = NextResponse.json(data, {
-        headers: {
-          "Cache-Control": "no-store",
-        },
-      });
-      return applyAuthResponseCookies(response, auth.response);
-    }
-    const response = buildCachedJsonResponse(
-      req,
-      data,
-      "public, max-age=0, s-maxage=20, stale-while-revalidate=60",
-    );
-    return applyAuthResponseCookies(response, auth.response);
-  } catch (error) {
-    const response = buildProxyExceptionResponse(error, {
-      publicMessage: "Failed to fetch city summary",
-    });
-    return response;
-  }
+  return proxyBackendJsonGet(req, {
+    cacheControl: cachePolicy.responseCacheControl,
+    fetchCache:
+      cachePolicy.fetchMode === "no-store" ? "no-store" : undefined,
+    publicMessage: "Failed to fetch city summary",
+    revalidateSeconds: cachePolicy.revalidateSeconds,
+    url,
+  });
 }

frontend/app/api/history/[name]/route.ts

@@ -1,13 +1,5 @@
 import { NextRequest, NextResponse } from "next/server";
-import {
-  applyAuthResponseCookies,
-  buildBackendRequestHeaders,
-} from "@/lib/backend-auth";
-import {
-  buildProxyExceptionResponse,
-  buildUpstreamErrorResponse,
-} from "@/lib/api-proxy";
-import { buildCachedJsonResponse } from "@/lib/http-cache";
+import { proxyBackendJsonGet } from "@/lib/api-proxy";
 
 const API_BASE = process.env.POLYWEATHER_API_BASE_URL;
 
@@ -26,33 +18,10 @@ export async function GET(
   const { name } = await context.params;
   const url = `${API_BASE}/api/history/${encodeURIComponent(name)}`;
 
-  try {
-    const auth = await buildBackendRequestHeaders(req, {
-      includeSupabaseIdentity: false,
-    });
-    const fetchOptions = {
-      headers: auth.headers,
-      next: { revalidate: 60 },
-    } as const;
-    const res = await fetch(url, {
-      ...fetchOptions,
-    });
-    if (!res.ok) {
-      const raw = await res.text();
-      const response = buildUpstreamErrorResponse(res.status, raw);
-      return applyAuthResponseCookies(response, auth.response);
-    }
-    const data = await res.json();
-    const response = buildCachedJsonResponse(
-      req,
-      data,
-      "public, max-age=0, s-maxage=60, stale-while-revalidate=300",
-    );
-    return applyAuthResponseCookies(response, auth.response);
-  } catch (error) {
-    const response = buildProxyExceptionResponse(error, {
-      publicMessage: "Failed to fetch history",
-    });
-    return response;
-  }
+  return proxyBackendJsonGet(req, {
+    cacheControl: "public, max-age=0, s-maxage=60, stale-while-revalidate=300",
+    publicMessage: "Failed to fetch history",
+    revalidateSeconds: 60,
+    url,
+  });
 }

frontend/app/api/payments/config/route.ts

@@ -1,13 +1,5 @@
 import { NextRequest, NextResponse } from "next/server";
-import {
-  applyAuthResponseCookies,
-  buildBackendRequestHeaders,
-} from "@/lib/backend-auth";
-import {
-  buildProxyExceptionResponse,
-  buildUpstreamErrorResponse,
-} from "@/lib/api-proxy";
-import { buildCachedJsonResponse } from "@/lib/http-cache";
+import { proxyBackendJsonGet } from "@/lib/api-proxy";
 
 const API_BASE = process.env.POLYWEATHER_API_BASE_URL;
 
@@ -18,30 +10,12 @@ export async function GET(req: NextRequest) {
       { status: 500 },
     );
   }
-  try {
-    const auth = await buildBackendRequestHeaders(req);
-    const res = await fetch(`${API_BASE}/api/payments/config`, {
-      headers: auth.headers,
-      next: { revalidate: 300 },
-    });
-    if (!res.ok) {
-      const raw = await res.text();
-      const response = buildUpstreamErrorResponse(res.status, raw, {
-        detailLimit: 350,
-      });
-      return applyAuthResponseCookies(response, auth.response);
-    }
-    const data = await res.json();
-    const response = buildCachedJsonResponse(
-      req,
-      data,
-      "public, max-age=0, s-maxage=300, stale-while-revalidate=900",
-    );
-    return applyAuthResponseCookies(response, auth.response);
-  } catch (error) {
-    return buildProxyExceptionResponse(error, {
-      publicMessage: "Failed to fetch payment config",
-    });
-  }
+  return proxyBackendJsonGet(req, {
+    cacheControl: "public, max-age=0, s-maxage=300, stale-while-revalidate=900",
+    detailLimit: 350,
+    includeSupabaseIdentity: true,
+    publicMessage: "Failed to fetch payment config",
+    revalidateSeconds: 300,
+    url: `${API_BASE}/api/payments/config`,
+  });
 }
-

frontend/app/api/payments/intents/[intentId]/route.ts

@@ -1,12 +1,5 @@
 import { NextRequest, NextResponse } from "next/server";
-import {
-  applyAuthResponseCookies,
-  buildBackendRequestHeaders,
-} from "@/lib/backend-auth";
-import {
-  buildProxyExceptionResponse,
-  buildUpstreamErrorResponse,
-} from "@/lib/api-proxy";
+import { proxyBackendJsonGet } from "@/lib/api-proxy";
 
 const API_BASE = process.env.POLYWEATHER_API_BASE_URL;
 
@@ -21,29 +14,11 @@ export async function GET(
     );
   }
   const { intentId } = await context.params;
-  try {
-    const auth = await buildBackendRequestHeaders(req);
-    const res = await fetch(
-      `${API_BASE}/api/payments/intents/${encodeURIComponent(intentId)}`,
-      {
-        method: "GET",
-        headers: auth.headers,
-        cache: "no-store",
-      },
-    );
-    if (!res.ok) {
-      const raw = await res.text();
-      const response = buildUpstreamErrorResponse(res.status, raw, {
-        detailLimit: 350,
-      });
-      return applyAuthResponseCookies(response, auth.response);
-    }
-    const data = await res.json();
-    const response = NextResponse.json(data);
-    return applyAuthResponseCookies(response, auth.response);
-  } catch (error) {
-    return buildProxyExceptionResponse(error, {
-      publicMessage: "Failed to fetch payment intent",
-    });
-  }
+  return proxyBackendJsonGet(req, {
+    detailLimit: 350,
+    fetchCache: "no-store",
+    includeSupabaseIdentity: true,
+    publicMessage: "Failed to fetch payment intent",
+    url: `${API_BASE}/api/payments/intents/${encodeURIComponent(intentId)}`,
+  });
 }

frontend/app/api/payments/runtime/route.ts

@@ -1,12 +1,5 @@
 import { NextRequest, NextResponse } from "next/server";
-import {
-  applyAuthResponseCookies,
-  buildBackendRequestHeaders,
-} from "@/lib/backend-auth";
-import {
-  buildProxyExceptionResponse,
-  buildUpstreamErrorResponse,
-} from "@/lib/api-proxy";
+import { proxyBackendJsonGet } from "@/lib/api-proxy";
 
 const API_BASE = process.env.POLYWEATHER_API_BASE_URL;
 
@@ -18,28 +11,13 @@ export async function GET(req: NextRequest) {
     );
   }
 
-  try {
-    const auth = await buildBackendRequestHeaders(req);
-    const res = await fetch(`${API_BASE}/api/payments/runtime`, {
-      headers: auth.headers,
-      cache: "no-store",
-    });
-    if (!res.ok) {
-      const raw = await res.text();
-      const response = buildUpstreamErrorResponse(res.status, raw, {
-        detailLimit: 500,
-      });
-      return applyAuthResponseCookies(response, auth.response);
-    }
-
-    const data = await res.json();
-    const response = NextResponse.json(data, {
-      headers: { "Cache-Control": "no-store" },
-    });
-    return applyAuthResponseCookies(response, auth.response);
-  } catch (error) {
-    return buildProxyExceptionResponse(error, {
-      publicMessage: "Failed to fetch payment runtime",
-    });
-  }
+  return proxyBackendJsonGet(req, {
+    cacheControl: "no-store",
+    conditionalResponse: false,
+    detailLimit: 500,
+    fetchCache: "no-store",
+    includeSupabaseIdentity: true,
+    publicMessage: "Failed to fetch payment runtime",
+    url: `${API_BASE}/api/payments/runtime`,
+  });
 }

frontend/app/api/payments/wallets/route.ts

@@ -5,6 +5,7 @@ import {
 } from "@/lib/backend-auth";
 import {
   buildProxyExceptionResponse,
+  proxyBackendJsonGet,
   buildUpstreamErrorResponse,
 } from "@/lib/api-proxy";
 
@@ -17,29 +18,15 @@ export async function GET(req: NextRequest) {
       { status: 500 },
     );
   }
-  try {
-    const auth = await buildBackendRequestHeaders(req);
-    const res = await fetch(`${API_BASE}/api/payments/wallets`, {
-      headers: auth.headers,
-      cache: "no-store",
-    });
-    if (!res.ok) {
-      const raw = await res.text();
-      const response = buildUpstreamErrorResponse(res.status, raw, {
-        detailLimit: 350,
-      });
-      return applyAuthResponseCookies(response, auth.response);
-    }
-    const data = await res.json();
-    const response = NextResponse.json(data, {
-      headers: { "Cache-Control": "no-store" },
-    });
-    return applyAuthResponseCookies(response, auth.response);
-  } catch (error) {
-    return buildProxyExceptionResponse(error, {
-      publicMessage: "Failed to fetch wallets",
-    });
-  }
+  return proxyBackendJsonGet(req, {
+    cacheControl: "no-store",
+    conditionalResponse: false,
+    detailLimit: 350,
+    fetchCache: "no-store",
+    includeSupabaseIdentity: true,
+    publicMessage: "Failed to fetch wallets",
+    url: `${API_BASE}/api/payments/wallets`,
+  });
 }
 
 export async function DELETE(req: NextRequest) {

frontend/app/api/scan/terminal/route.ts

@@ -1,13 +1,5 @@
 import { NextRequest, NextResponse } from "next/server";
-import {
-  applyAuthResponseCookies,
-  buildBackendRequestHeaders,
-} from "@/lib/backend-auth";
-import {
-  buildProxyExceptionResponse,
-  buildUpstreamErrorResponse,
-} from "@/lib/api-proxy";
-import { buildCachedJsonResponse } from "@/lib/http-cache";
+import { proxyBackendJsonGet } from "@/lib/api-proxy";
 import { buildForceRefreshProxyCachePolicy } from "@/lib/proxy-cache-policy";
 
 const API_BASE = process.env.POLYWEATHER_API_BASE_URL;
@@ -48,42 +40,20 @@ export async function GET(req: NextRequest) {
 
   const url = `${API_BASE}/api/scan/terminal?${params.toString()}`;
 
-  let auth: Awaited<ReturnType<typeof buildBackendRequestHeaders>> | null = null;
   const controller = new AbortController();
   const timeoutId = setTimeout(() => controller.abort(), SCAN_TERMINAL_PROXY_TIMEOUT_MS);
 
   try {
-    auth = await buildBackendRequestHeaders(req, {
-      includeSupabaseIdentity: false,
-    });
-    const res = await fetch(url, {
-      headers: auth.headers,
-      ...(cachePolicy.fetchMode === "no-store"
-        ? { cache: "no-store" as const }
-        : { next: { revalidate: cachePolicy.revalidateSeconds ?? 10 } }),
+    return await proxyBackendJsonGet(req, {
+      cacheControl: cachePolicy.responseCacheControl,
+      fetchCache:
+        cachePolicy.fetchMode === "no-store" ? "no-store" : undefined,
+      publicMessage: "Failed to fetch scan terminal data",
+      revalidateSeconds: cachePolicy.revalidateSeconds,
       signal: controller.signal,
+      timeoutPublicMessage: "Scan terminal request timed out",
+      url,
     });
-    if (!res.ok) {
-      const raw = await res.text();
-      const response = buildUpstreamErrorResponse(res.status, raw);
-      return applyAuthResponseCookies(response, auth.response);
-    }
-    const data = await res.json();
-    const response = buildCachedJsonResponse(
-      req,
-      data,
-      cachePolicy.responseCacheControl,
-    );
-    return applyAuthResponseCookies(response, auth.response);
-  } catch (error) {
-    const timedOut = controller.signal.aborted;
-    const response = buildProxyExceptionResponse(error, {
-      publicMessage: timedOut
-        ? "Scan terminal request timed out"
-        : "Failed to fetch scan terminal data",
-      status: timedOut ? 504 : 500,
-    });
-    return auth ? applyAuthResponseCookies(response, auth.response) : response;
   } finally {
     clearTimeout(timeoutId);
   }

frontend/app/api/system/status/route.ts

@@ -1,13 +1,5 @@
 import { NextRequest, NextResponse } from "next/server";
-import {
-  applyAuthResponseCookies,
-  buildBackendRequestHeaders,
-} from "@/lib/backend-auth";
-import {
-  buildProxyExceptionResponse,
-  buildUpstreamErrorResponse,
-} from "@/lib/api-proxy";
-import { buildCachedJsonResponse } from "@/lib/http-cache";
+import { proxyBackendJsonGet } from "@/lib/api-proxy";
 
 const API_BASE = process.env.POLYWEATHER_API_BASE_URL;
 
@@ -19,32 +11,11 @@ export async function GET(req: NextRequest) {
     );
   }
 
-  try {
-    const auth = await buildBackendRequestHeaders(req, {
-      includeSupabaseIdentity: false,
-    });
-    const res = await fetch(`${API_BASE}/api/system/status`, {
-      headers: auth.headers,
-      next: { revalidate: 30 },
-    });
-    if (!res.ok) {
-      const raw = await res.text();
-      const response = buildUpstreamErrorResponse(res.status, raw, {
-        detailLimit: 500,
-      });
-      return applyAuthResponseCookies(response, auth.response);
-    }
-
-    const data = await res.json();
-    const response = buildCachedJsonResponse(
-      req,
-      data,
-      "public, max-age=0, s-maxage=30, stale-while-revalidate=120",
-    );
-    return applyAuthResponseCookies(response, auth.response);
-  } catch (error) {
-    return buildProxyExceptionResponse(error, {
-      publicMessage: "Failed to fetch system status",
-    });
-  }
+  return proxyBackendJsonGet(req, {
+    cacheControl: "public, max-age=0, s-maxage=30, stale-while-revalidate=120",
+    detailLimit: 500,
+    publicMessage: "Failed to fetch system status",
+    revalidateSeconds: 30,
+    url: `${API_BASE}/api/system/status`,
+  });
 }