{t("dash.getting_started")}

{t("dash.steps_done", { done, total: steps.length })}

{/* "Open setup" is gone: the guided setup is a standalone first-run screen (onboarding revamp Phase 12), not re-enterable in-shell. */}

{steps.map((s, i) => ( ))}

); } function Dashboard({ onNavigate }) { const boot = window.LTQ.boot || {}; const projectId = boot.project && boot.project.id; const projectName = (boot.project && boot.project.name) || t("dash.your_project"); const [metricId, setMetricId] = React.useState("impressions"); const [days, setDays] = React.useState(() => { const v = Number((typeof localStorage !== "undefined" && localStorage.getItem("sqseo_days")) || 28); return [7, 28, 90, 365].includes(v) ? v : 28; }); const [compareOn, setCompareOn] = React.useState(false); const [dash, setDash] = React.useState(null); const [hist, setHist] = React.useState(null); const [loadErr, setLoadErr] = React.useState(false); // failed fetch -> honest retry, not eternal skeletons const [tick, setTick] = React.useState(0); React.useEffect(() => { try { localStorage.setItem("sqseo_days", String(days)); } catch (e) {} }, [days]); const gsc = useApi("/api/gsc/status"); const gscConnected = gsc.data && gsc.data.connected; React.useEffect(() => { let live = true; setDash(null); setLoadErr(false); api.get("/api/dashboard").then((r) => { if (!live) return; if (r.ok) setDash(r.data); else setLoadErr(true); }); return () => { live = false; }; }, [projectId, tick]); React.useEffect(() => { let live = true; setHist(null); api.get("/api/history?days=" + days).then((r) => { if (!live) return; if (r.ok) setHist(r.data); else setLoadErr(true); }); return () => { live = false; }; }, [projectId, days, tick]); const metric = METRICS.find((m) => m.id === metricId); const metrics = dash && dash.metrics; const summary = hist && hist.summary; const series = hist ? (metric.source === "ai" ? hist.aiHistory : hist.history) : []; const canCompare = metric.source === "history"; const compareSeries = compareOn && canCompare && hist ? hist.compare : null; const sumValue = summary ? summary[metric.sumKey] : 0; const delta = summary && metric.deltaKey ? summary.delta[metric.deltaKey] : null; const strip = metrics ? [ { l: t("dash.total_longtails"), v: metrics.total, icon: "list", sub: t("dash.n_clusters", { n: dash.clusters.length || 0 }) }, { l: t("kind.buyer"), v: metrics.buyer, icon: "shopping-bag", sub: metrics.total ? t("dash.pct_of_total", { pct: Math.round((metrics.buyer / metrics.total) * 100) }) : "—" }, { l: t("dash.low_competition"), v: metrics.lowDifficulty, icon: "trending-down", sub: t("dash.low_competition_sub") }, { l: t("dash.briefs_ready"), v: metrics.briefs, icon: "file-pen-line", sub: t("dash.briefs_ready_sub") }, ] : []; const SQ = window.LTQ.SQ; const hour = new Date().getHours(); const greetWord = hour < 12 ? t("dash.greet_morning") : hour < 18 ? t("dash.greet_afternoon") : t("dash.greet_evening"); const firstName = (((window.LTQ.boot || {}).user || {}).name || "").trim().split(/\s+/)[0]; const greeting = firstName ? t("dash.greet_named", { greet: greetWord, name: firstName }) : greetWord; return (

{/* A warm hello from SQ — waves on load, tracks the cursor. Additive; the dashboard below is unchanged. */}

{SQ && window.SQRobot &&

}

{greeting}

{t("dash.greet_sub")}

{loadErr && (

{t("chrome.load_failed")}

)} {gsc.data && gsc.data.needs_reconnect ? (

{t("dash.revoked_1")} {t("dash.revoked_bold")}{t("dash.revoked_2")} {t("dash.reconnect")}

) : gsc.data && !gscConnected ? (

{t("dash.sample_1")} {t("dash.sample_bold")} {t("dash.sample_2")}

) : null} {/* Header row */}

{t("nav.dashboard")}

{/* Chart + clusters */}

{METRICS.map((m) => setMetricId(m.id)} />)}

{/* big current value */}

{summary ? metric.fmt(sumValue) : "—"} {metric.id === "position" ? t("dash.avg_over") + " " : t("dash.total") + " · "}{days >= 365 ? t("dash.12_months") : t("dash.n_days", { n: days })} {summary && }

{hist ? :

} {/* Top clusters */}

{t("dash.top_clusters")}

{t("dash.top_clusters_sub")}

{!dash ? (

{[0,1,2,3,4].map((i)=>)}

) : dash.clusters.length === 0 ? (

{t("dash.run_to_build")}

) : ( {[["#","left"],[t("chrome.cluster"),"left"],[t("dash.metric.impressions"),"right"],[t("dash.diff_abbr"),"right"],[t("dash.opp_abbr"),"right"]].map((c,i)=>( ))} {dash.clusters.map((c,i)=>)}

{c[0]}

)}

{/* secondary metric strip: 4-up desktop, 2×2 on phones (.lt-keep-grid opts out of the shell's mobile 1fr fallback) */}

{(metrics ? strip : [0,1,2,3]).map((m, i) => ( {metrics ? <>

{m.l}

{m.v} {m.sub}

} ))}

{/* intent mix + top opportunities */}

{t("dash.intent_mix")}

{t("dash.intent_mix_sub")}

{!dash ?

{[0,1,2,3].map((i)=>)}

: dash.intentMix.length === 0 ?

{t("dash.no_keywords")}

: (() => { const maxN = Math.max(1, ...dash.intentMix.map((m) => m.n)); return (

{dash.intentMix.map((m) => { const [label, c] = kindMeta(m.kind); return (

{label} {m.n}

); })}

); })()}

{t("dash.top_opportunities")}

{t("dash.top_opportunities_sub")}

{!dash ? [0,1,2,3,4].map((i)=>

) : dash.topKeywords.length === 0 ?

{t("dash.run_to_surface")}

: dash.topKeywords.map((k, i) => { const [label, c] = kindMeta(k.kind); return (

{i + 1}

{k.keyword}

{label} · {t("dash.n_demand", { n: fmtCompact(k.demand) })}

= 80 ? "var(--viz-green)" : "var(--text-strong)", flex: "none" }}>{k.score}

); })}

); } window.LTQ = window.LTQ || {}; window.LTQ.Dashboard = Dashboard; })();