diff --git a/frontend/components/dashboard/ScanTerminalDashboard.tsx b/frontend/components/dashboard/ScanTerminalDashboard.tsx index 9a60911b..29a64e78 100644 --- a/frontend/components/dashboard/ScanTerminalDashboard.tsx +++ b/frontend/components/dashboard/ScanTerminalDashboard.tsx @@ -6,22 +6,15 @@ import { Activity, BarChart3, Bell, - ChevronDown, ChevronLeft, - ChevronRight, - CloudSun, - CreditCard, Gauge, LineChart, - LockKeyhole, - LogIn, Menu, - RefreshCw, Search, Table2, UserRound, } from "lucide-react"; -import { Fragment, useCallback, useEffect, useMemo, useRef, useState } from "react"; +import { useEffect, useMemo, useRef, useState } from "react"; import { Area, AreaChart, @@ -65,7 +58,6 @@ import { scanRootClass } from "@/components/dashboard/scan-root-styles"; import { useRelativeTime } from "@/hooks/useRelativeTime"; import { Panel } from "@/components/dashboard/scan-terminal/Panel"; import { GroupedMarketTable } from "@/components/dashboard/scan-terminal/GroupedMarketTable"; -import { RunwayMeteorologyPanel } from "@/components/dashboard/scan-terminal/RunwayMeteorologyPanel"; import { rowName, pct, money, temp, edgeClass } from "@/components/dashboard/scan-terminal/utils"; function createEmptyAccess(loading = true): ProAccessState { @@ -297,6 +289,566 @@ function ProbabilityDistributionChart({ ); } +function tablePrice(row: ScanOpportunityRow) { + return formatPrice(row.midpoint, row.ask, row.bid); +} + +function ticker(row: ScanOpportunityRow) { + return String(row.airport || row.market_key || row.city || "--") + .replace(/[^A-Za-z0-9]/g, "") + .slice(0, 6) + .toUpperCase(); +} + +function KoyfinRowsTable({ + compact = false, + isEn, + onSelect, + rows, + selectedId, +}: { + compact?: boolean; + isEn: boolean; + onSelect: (row: ScanOpportunityRow) => void; + rows: ScanOpportunityRow[]; + selectedId?: string | null; +}) { + return ( + + + + + + {!compact && ( + + )} + + + + + + + {rows.map((row) => { + const edge = Number(row.edge_percent ?? row.signed_gap ?? row.gap ?? 0); + const positive = edge >= 0; + return ( + onSelect(row)} + className={clsx( + "cursor-pointer border-b border-slate-100 hover:bg-blue-50/70", + selectedId === row.id && "bg-blue-50", + )} + > + + + {!compact && ( + + )} + + + + + ); + })} + +
+ + + {isEn ? "Weather Contract" : "天气合约"} + + {isEn ? "Ticker" : "代码"} + + {isEn ? "Price" : "价格"} + + {isEn ? "Chg" : "变化"} + %
+ + +
+ {rowName(row)} +
+
+ {row.target_label || row.market_question || row.airport || "--"} +
+
+ {ticker(row)} + + {tablePrice(row)} + + {Number.isFinite(edge) ? `${positive ? "+" : ""}${edge.toFixed(1)}` : "--"} + + {pct(row.market_probability ?? row.market_event_probability ?? row.model_probability)} +
+ ); +} + +function KoyfinMarketPanel({ + compact, + isEn, + onSelect, + rows, + selectedId, + title, +}: { + compact?: boolean; + isEn: boolean; + onSelect: (row: ScanOpportunityRow) => void; + rows: ScanOpportunityRow[]; + selectedId?: string | null; + title: string; +}) { + return ( + + + + ); +} + +function WeatherNewsPanel({ + isEn, + rows, +}: { + isEn: boolean; + rows: ScanOpportunityRow[]; +}) { + const items = rows.slice(0, 3).map((row) => ({ + title: + (isEn ? row.ai_city_thesis_en || row.ai_reason_en : row.ai_city_thesis_zh || row.ai_reason_zh) || + row.market_question || + `${rowName(row)} ${isEn ? "weather contract update" : "天气合约更新"}`, + source: row.airport || "PolyWeather", + time: row.local_time || row.selected_date || "--", + })); + return ( + +
+ {items.map((item, index) => ( +
+
+ {item.title} +
+
{item.source}
+
{item.time}
+
+ ))} +
+
+ ); +} + +function performanceSeries(row: ScanOpportunityRow | null) { + return buildEvidenceChart(row).data; +} + +type ObsPoint = { time?: string | null; temp?: number | null }; + +type EvidenceSeries = { + key: string; + label: string; + source: string; + color: string; + dashed?: boolean; + featured?: boolean; + values: Array; +}; + +type RunwayObsPayload = { + runway_pairs?: Array<[string, string] | string[] | null> | null; + temperatures?: Array<[number | null, number | null] | Array | null> | null; + point_temperatures?: Array<{ + runway?: string | null; + tdz_temp?: number | null; + mid_temp?: number | null; + end_temp?: number | null; + } | null> | null; +}; + +function validNumber(value: unknown): number | null { + return typeof value === "number" && Number.isFinite(value) ? value : null; +} + +function normalizeObs(points?: ObsPoint[] | null, limit = 88) { + return (points || []) + .filter((point) => validNumber(point.temp) !== null) + .slice(-limit) + .map((point, index) => ({ + label: point.time || String(index + 1), + value: Number(point.temp), + })); +} + +function formatChartLabel(value: string) { + if (!value) return ""; + const maybeDate = new Date(value); + if (!Number.isNaN(maybeDate.getTime())) { + return maybeDate.toLocaleTimeString("zh-CN", { hour: "2-digit", minute: "2-digit", hour12: false }); + } + return value.length > 8 ? value.slice(-8) : value; +} + +function seriesStats(values: Array) { + const nums = values.filter((value): value is number => validNumber(value) !== null); + const latest = nums.length ? nums[nums.length - 1] : null; + const high = nums.length ? Math.max(...nums) : null; + const first15 = nums.length > 1 ? nums[Math.max(0, nums.length - 15)] : null; + const delta15 = latest !== null && first15 !== null ? latest - first15 : null; + return { latest, high, delta15 }; +} + +function buildModelPoints(row: ScanOpportunityRow | null, length: number) { + const modelEntries = Object.entries(row?.model_cluster_sources || {}) + .map(([label, value]) => [label, validNumber(value)] as const) + .filter((entry): entry is readonly [string, number] => entry[1] !== null) + .slice(0, 4); + const constants: EvidenceSeries[] = modelEntries.map(([label, value], index) => ({ + key: `model_${index}`, + label, + source: "Multi-model", + color: ["#2563eb", "#14b8a6", "#7c3aed", "#64748b"][index] || "#64748b", + dashed: true, + values: Array.from({ length }, () => value), + })); + const deb = validNumber(row?.deb_prediction); + if (deb !== null) { + constants.unshift({ + key: "deb", + label: "DEB", + source: "DEB", + color: "#f97316", + dashed: true, + values: Array.from({ length }, () => deb), + }); + } + return constants; +} + +function extractRunwayPointSeries(row: ScanOpportunityRow | null, length: number): EvidenceSeries[] { + const payload = row as + | (ScanOpportunityRow & { + amos?: { runway_obs?: RunwayObsPayload | null; source_label?: string | null; source?: string | null } | null; + runway_obs?: RunwayObsPayload | null; + }) + | null; + const runwayObs = payload?.amos?.runway_obs || payload?.runway_obs; + if (!runwayObs) return []; + const pairs = runwayObs.runway_pairs || []; + const runwayTemps = runwayObs.temperatures || []; + const pointTemps = runwayObs.point_temperatures || []; + const source = payload?.amos?.source_label || payload?.amos?.source || "Runway"; + const series: EvidenceSeries[] = []; + pairs.forEach((pair, index) => { + const pairLabel = Array.isArray(pair) && pair.length + ? pair.filter(Boolean).join("/") + : pointTemps[index]?.runway || `RWY ${index + 1}`; + const values = [ + ...(Array.isArray(runwayTemps[index]) ? runwayTemps[index] || [] : []), + pointTemps[index]?.tdz_temp, + pointTemps[index]?.mid_temp, + pointTemps[index]?.end_temp, + ] + .map(validNumber) + .filter((value): value is number => value !== null); + if (!values.length) return; + const maxTemp = Math.max(...values); + series.push({ + key: `runway_${index}`, + label: `${pairLabel} runway`, + source, + color: ["#009688", "#f97316", "#0ea5e9", "#ef4444"][index] || "#64748b", + featured: index === 0, + dashed: index !== 0, + values: Array.from({ length }, () => maxTemp), + }); + }); + return series.slice(0, 4); +} + +function buildEvidenceChart(row: ScanOpportunityRow | null) { + const settlement = normalizeObs(row?.settlement_today_obs || row?.metar_context?.settlement_today_obs); + const metar = normalizeObs(row?.metar_today_obs || row?.metar_context?.today_obs || row?.metar_recent_obs || row?.metar_context?.recent_obs); + const baseLabels = settlement.length >= metar.length ? settlement.map((point) => point.label) : metar.map((point) => point.label); + const length = Math.max(baseLabels.length, settlement.length, metar.length, 24); + const labels = length === baseLabels.length + ? baseLabels + : Array.from({ length }, (_, index) => baseLabels[index] || `${String(index).padStart(2, "0")}:00`); + + const align = (points: Array<{ label: string; value: number }>) => { + if (!points.length) return Array.from({ length }, () => null); + const offset = Math.max(0, length - points.length); + return Array.from({ length }, (_, index) => (index < offset ? null : points[index - offset]?.value ?? null)); + }; + + const series: EvidenceSeries[] = []; + series.push(...extractRunwayPointSeries(row, length)); + if (settlement.length) { + series.push({ + key: "settlement", + label: "Settlement runway", + source: row?.metar_context?.station_label || row?.metar_context?.station || row?.airport || "Settlement", + color: "#009688", + featured: true, + values: align(settlement), + }); + } + if (metar.length) { + series.push({ + key: "metar", + label: "METAR official", + source: row?.airport || row?.metar_context?.source || "METAR", + color: "#0ea5e9", + dashed: true, + values: align(metar), + }); + } + series.push(...buildModelPoints(row, length)); + + const fallbackValue = + validNumber(row?.current_temp) ?? + validNumber(row?.current_max_so_far) ?? + validNumber(row?.deb_prediction) ?? + validNumber(row?.target_value) ?? + validNumber(row?.target_threshold); + if (!series.length && fallbackValue !== null) { + series.push({ + key: "current", + label: "Current reference", + source: row?.metar_context?.source || "Live", + color: "#009688", + featured: true, + values: Array.from({ length }, () => fallbackValue), + }); + } + + const data = labels.map((label, index) => { + const point: Record = { label: formatChartLabel(label) }; + series.forEach((item) => { + point[item.key] = item.values[index] ?? null; + }); + return point; + }); + return { data, series }; +} + +function NormalizedPerformancePanel({ + isEn, + row, + rows = [], + onSelect, +}: { + isEn: boolean; + row: ScanOpportunityRow | null; + rows?: ScanOpportunityRow[]; + onSelect?: (row: ScanOpportunityRow) => void; +}) { + const { data, series } = useMemo(() => buildEvidenceChart(row), [row]); + const threshold = validNumber(row?.target_threshold) ?? validNumber(row?.target_value); + const tableRows = series.slice(0, 5).map((item) => ({ ...item, ...seriesStats(item.values) })); + return ( + + {isEn ? "Export" : "导出"} + + } + > +
+
+ {rows.slice(0, 18).map((item) => ( + + ))} +
+
+
+
+
+ {isEn ? "Settlement live" : "跑道实测"} {temp(validNumber(row?.current_temp))} +
+
+ METAR {temp(validNumber(row?.metar_context?.airport_current_temp ?? row?.metar_context?.last_temp))} +
+
+
+ {isEn ? "Threshold" : "当日阈值"} {temp(threshold)} +
+
+
+ {tableRows.map((item) => ( +
+
+ + {item.label} +
+
+ now: {temp(item.latest)} + max: {temp(item.high)} + 15m: {item.delta15 === null ? "--" : `${item.delta15 >= 0 ? "+" : ""}${item.delta15.toFixed(1)}°`} +
+
+ ))} +
+
+
+
+ {rowName(row)} {row?.target_label || row?.market_direction || ""} +
+ + + + + `${Number(v).toFixed(1)}°`} orientation="right" axisLine={{ stroke: "#cbd5e1" }} tickLine={false} /> + {threshold !== null && ( + + )} + `${Number(value).toFixed(2)}°`} + /> + {series.map((item) => ( + + ))} + + +
+
+
+ ); +} + +function FactorMatrix({ + isEn, + rows, +}: { + isEn: boolean; + rows: ScanOpportunityRow[]; +}) { + const buckets = [ + [isEn ? "Heat" : "高温", rows.filter((r) => r.risk_level === "high")], + [isEn ? "Live Edge" : "实况优势", rows.filter((r) => Number(r.edge_percent || 0) > 0)], + [isEn ? "Tradable" : "可交易", rows.filter((r) => r.tradable)], + [isEn ? "AI Approved" : "AI 通过", rows.filter((r) => String(r.ai_decision || "").includes("approve"))], + [isEn ? "Watch" : "观察", rows.filter((r) => getSignalState(r) === "watch")], + [isEn ? "Closed" : "关闭", rows.filter((r) => r.closed)], + ]; + return ( + +
+ {buckets.map(([label, list]) => { + const count = Array.isArray(list) ? list.length : 0; + const ratio = rows.length ? count / rows.length : 0; + const tone = + ratio >= 0.5 ? "bg-emerald-100 text-emerald-800 border-emerald-200" : + ratio >= 0.2 ? "bg-amber-100 text-amber-800 border-amber-200" : + "bg-slate-100 text-slate-600 border-slate-200"; + return ( +
+
{(ratio * 100).toFixed(1)}%
+
{String(label)}
+
+ ); + })} +
+
+ ); +} + +function YieldLikeTable({ + isEn, + rows, +}: { + isEn: boolean; + rows: ScanOpportunityRow[]; +}) { + const regionStats = TRADING_REGIONS.map((region) => { + const regionRows = rows.filter((row) => String(row.trading_region).toLowerCase() === region.key); + const avgEdge = regionRows.reduce((sum, row) => sum + Number(row.edge_percent || 0), 0) / Math.max(regionRows.length, 1); + const avgProb = regionRows.reduce((sum, row) => sum + Number(row.model_probability ?? row.model_event_probability ?? 0), 0) / Math.max(regionRows.length, 1); + return { + label: isEn ? region.labelEn : region.labelZh, + edge: avgEdge, + prob: avgProb, + liq: regionRows.reduce((sum, row) => sum + Number(row.book_liquidity || row.market_liquidity || 0), 0), + count: regionRows.length, + }; + }).filter((row) => row.count > 0).slice(0, 7); + return ( + + + + + + + + + + + + + {regionStats.map((row) => ( + + + + + + + + ))} + +
{isEn ? "Region" : "区域"}1D5D10D{isEn ? "Liq" : "流动性"}
{row.label}{pct(row.edge)}{pct(row.prob)}{pct(row.edge + row.prob * 0.2)}{money(row.liq)}
+
+ ); +} + function PolyWeatherTerminal({ generatedText, isEn, @@ -381,6 +933,23 @@ function PolyWeatherTerminal({ .filter((row) => decisionLabel(row) === "Watch" || !row.tradable) .slice(0, 8); }, [filteredRegionRows]); + const topRows = filteredRegionRows.slice(0, 18); + const activeRows = filteredRegionRows + .filter((row) => getSignalState(row) === "active" || row.tradable) + .slice(0, 10); + const heatRows = filteredRegionRows + .filter((row) => row.risk_level === "high" || Number(row.current_temp ?? 0) >= 30) + .slice(0, 10); + const liquidRows = [...filteredRegionRows] + .sort( + (a, b) => + Number(b.book_liquidity || b.market_liquidity || b.volume || 0) - + Number(a.book_liquidity || a.market_liquidity || a.volume || 0), + ) + .slice(0, 9); + const negativeRows = filteredRegionRows + .filter((row) => Number(row.edge_percent ?? row.signed_gap ?? row.gap ?? 0) < 0) + .slice(0, 8); const selectedSignal = selectedRow ? getSignalState(selectedRow) : "data" as const; const selectedLabel = selectedRow ? getSignalLabel(selectedSignal, isEn) : ""; @@ -389,6 +958,9 @@ function PolyWeatherTerminal({ () => buildContinentGroups(filteredRegionRows, isEn), [filteredRegionRows, isEn] ); + const firstRegionRows = + continentGroups.find((group) => group.key !== "active_signals")?.rows.slice(0, 8) || + topRows.slice(0, 8); const [mobileTab, setMobileTab] = useState("active_signals"); const mobileActiveGroup = useMemo( () => continentGroups.find((g) => g.key === mobileTab) || continentGroups[0], @@ -586,11 +1158,9 @@ function PolyWeatherTerminal({ {/* Desktop layout */} -
- {/* Column 1 */} -
- {/* Koyfin-style Region Selector */} -
+
+
+
{regionTabs.map((tab) => { const isActive = selectedRegionKey === tab.key; return ( @@ -611,188 +1181,91 @@ function PolyWeatherTerminal({ })}
- -
-
-
- {t("rows", isEn)} -
-
{filteredRegionRows.length}
-
-
-
- {t("avgEdge", isEn)} -
-
- {pct(avgEdge)} -
-
-
-
- {t("liquidity", isEn)} -
-
- {money(totalLiquidity)} -
-
-
-
- -
-
+ + +
- {/* Column 2 */} -
- -
-
-
-

- {rowName(selectedRow)} -

- - {selectedLabel} - -
-

- {isEn - ? selectedRow?.ai_city_thesis_en || selectedRow?.ai_reason_en || selectedRow?.market_question || t("selectContract", isEn) - : selectedRow?.ai_city_thesis_zh || selectedRow?.ai_reason_zh || selectedRow?.market_question || t("selectContract", isEn)} -

-
- {[ - [t("live", isEn), temp(selectedRow?.current_max_so_far ?? selectedRow?.current_temp, selectedRow?.temp_symbol)], - [t("deb", isEn), temp(selectedRow?.deb_prediction, selectedRow?.temp_symbol)], - [t("model", isEn), pct(selectedRow?.model_probability ?? selectedRow?.model_event_probability)], - [t("mkt", isEn), pct(selectedRow?.market_probability ?? selectedRow?.market_event_probability)], - ].map(([label, value]) => ( -
-
- {label} -
-
{value}
-
- ))} -
-
-
-
-
- {t("intradayPerformance", isEn)} -
-
- = 0 - ? "#059669" - : "#dc2626" - } - data={ - selectedRow?.distribution_preview?.map((p) => ({ - v: - typeof p === "number" - ? p - : p.model_probability ?? 0, - })) || [] - } - /> -
-
-
- - {t("edge", isEn)} {pct(selectedRow?.edge_percent)} - - - {t("spread", isEn)} {pct(selectedRow?.spread)} - -
-
-
-
- - - - +
+ + +
+ + +
- {/* Column 3 */} -
- -
- {(watchRows.length ? watchRows : rows.slice(0, 8)).map((row) => ( - - ))} -
-
- - -
+
+ + + + +
{[ - [t("heat", isEn), rows.filter((r) => r.risk_level === "high").length], - [t("active", isEn), rows.filter((r) => r.active).length], - [t("tradable", isEn), rows.filter((r) => r.tradable).length], - [t("primary", isEn), rows.filter((r) => r.is_primary_signal).length], - [t("ai", isEn), rows.filter((r) => r.ai_decision).length], - [t("closed", isEn), rows.filter((r) => r.closed).length], + [t("rows", isEn), filteredRegionRows.length], + [t("avgEdge", isEn), pct(avgEdge)], + [t("liquidity", isEn), money(totalLiquidity)], + [t("tsData", isEn), generatedText || t("tsDataLive", isEn)], + [t("tsAccess", isEn), t("tsAccessPaid", isEn)], + [t("tsLayout", isEn), "Koyfin"], ].map(([label, value]) => ( -
-
{value}
-
+
+
{label}
+
+ {value} +
))}
- - -
-
- {t("tsData", isEn)} - - {generatedText || t("tsDataLive", isEn)} - -
-
- {t("tsAccess", isEn)} - {t("tsAccessPaid", isEn)} -
-
- {t("tsLayout", isEn)} - {t("tsLayoutValue", isEn)} -
-
-