feat: implement FutureForecastModal and PanelSections for advanced weather visualization and dashboard data display

frontend/components/dashboard/FutureForecastModal.tsx

@@ -736,24 +736,39 @@ export function FutureForecastModal() {
     if (!cityName || !dateStr) return;
 
     let cancelled = false;
-    dashboardClient
+    let intervalId: ReturnType<typeof setInterval> | null = null;
-      .getCityMarketScan(cityName, {
+
-        force: false,
+    const refreshMarketScan = () => {
-        marketSlug: detail.market_scan?.primary_market?.slug || null,
+      dashboardClient
-        targetDate: dateStr,
+        .getCityMarketScan(cityName, {
-      })
+          force: false,
-      .then((payload) => {
+          marketSlug: detail.market_scan?.primary_market?.slug || null,
-        if (cancelled) return;
+          targetDate: dateStr,
-        setFreshMarketScan(payload.market_scan || null);
+        })
-      })
+        .then((payload) => {
-      .catch(() => {
+          if (cancelled) return;
-        if (!cancelled) {
+          setFreshMarketScan(payload.market_scan || null);
-          setFreshMarketScan(null);
+        })
-        }
+        .catch(() => {
-      });
+          if (!cancelled) {
+            setFreshMarketScan(null);
+          }
+        });
+    };
+
+    refreshMarketScan();
+    intervalId = setInterval(() => {
+      if (typeof document !== "undefined" && document.visibilityState === "hidden") {
+        return;
+      }
+      refreshMarketScan();
+    }, 3000);
 
     return () => {
       cancelled = true;
+      if (intervalId != null) {
+        clearInterval(intervalId);
+      }
     };
   }, [
     dateStr,

frontend/components/dashboard/PanelSections.tsx

@@ -924,6 +924,14 @@ export function ProbabilityDistribution({
           row.probability > best.probability ? row : best,
         )
       : null;
+  const displayTopLabel = topContractRow?.label || topProbabilityLabel || null;
+  const displayTopProbability =
+    topContractRow?.probability ??
+    (topProbability?.probability != null
+      ? Number(topProbability.probability)
+      : null);
+  const displayTopProbabilityText = toPercent(displayTopProbability);
+  const displayUsesMarketBuckets = marketContractRows.length > 0;
   const linkedMarketBucket = useMemo(() => {
     if (topContractRow?.marketBucket) return topContractRow.marketBucket;
     if (topProbabilityTemp == null) return null;
@@ -1092,10 +1100,14 @@ export function ProbabilityDistribution({
           <div>
             <span className="prob-source-chip">{probabilityEngineLabel}</span>
             <strong>
-              {topProbability && topProbabilityText
+              {displayTopLabel && displayTopProbabilityText
                 ? locale === "en-US"
-                  ? `${topProbabilityLabel} is the top single bucket at ${topProbabilityText}`
+                  ? displayUsesMarketBuckets
-                  : `${topProbabilityLabel} 单点最高，${topProbabilityText}`
+                    ? `${displayTopLabel} is the top displayed contract bucket at ${displayTopProbabilityText}`
+                    : `${displayTopLabel} is the top single bucket at ${displayTopProbabilityText}`
+                  : displayUsesMarketBuckets
+                    ? `${displayTopLabel} 为当前显示分布最高，${displayTopProbabilityText}`
+                    : `${displayTopLabel} 单点最高，${displayTopProbabilityText}`
                 : locale === "en-US"
                   ? "Awaiting calibrated buckets"
                   : "等待校准概率桶"}