shine-code-submit 0.2.11 → 1.0.1

package/ui/components/App.tsx

@@ -7,6 +7,7 @@ import { CommitsModule } from "./CommitsModule";
 import { OverviewModule } from "./OverviewModule";
 import { StatsModule } from "./StatsModule";
 import { ReportModule } from "./ReportModule";
+import { SettingsModule } from "./SettingsModule";
 import { SystemModule } from "./SystemModule";
 
 /** 模块路由：按 activeModule 渲染对应模块。 */
@@ -21,10 +22,12 @@ function ModuleRouter() {
     //   return <EventsModule />;        // 暂时屏蔽
     // case "commits":
     //   return <CommitsModule />;       // 暂时屏蔽
-    case "stats":
-      return <StatsModule />;
+    // case "stats":
+    //   return <StatsModule />;        // 暂时屏蔽
     case "report":
       return <ReportModule />;
+    case "settings":
+      return <SettingsModule />;
     case "system":
       return <SystemModule />;
     default:

package/ui/components/Icon.tsx

@@ -17,7 +17,8 @@ export type IconName =
   | "home"
   | "git"
   | "chart"
-  | "server";
+  | "server"
+  | "sliders";
 
 const PATHS: Record<IconName, ReactNode> = {
   sessions: (
@@ -84,6 +85,12 @@ const PATHS: Record<IconName, ReactNode> = {
       <path d="M8 7h.01M8 17h.01" />
     </>
   ),
+  sliders: (
+    <>
+      <path d="M4 21v-7M4 10V3M12 21v-9M12 8V3M20 21v-5M20 12V3" />
+      <path d="M1 14h6M9 8h6M17 16h6" />
+    </>
+  ),
 };
 
 export function Icon({

package/ui/components/ReportModule.tsx

@@ -1,201 +1,186 @@
-// 「数据上报」模块:跨项目聚合(版本/git 用户/会话数+每会话 token/提交次数+行数+时间)。
-// 数据来自 GET /api/report?since=<ms>(0=全部)。后期要真·上报服务器时,把底部占位按钮接上即可。
+// 「数据上报」模块:顶部汇总标题 + 左侧项目导航(仅项目名) + 右侧 session 表格(分页,隐藏 0 token)。
+// 表格列:Session / 时间 / 输入 token / 输出 token;标题显示该项目的输入/输出 token 汇总。
+// 数据来自 GET /api/report?since=0(全部)。后期真·上报服务器时,把顶部占位按钮接上即可。
 import { useEffect, useState } from "react";
 import { useApi } from "../hooks/useApi";
 import { useApp } from "../state/AppContext";
+import { Icon } from "./Icon";
+import { Splitter } from "./Splitter";
 import type { ReportProject, ReportResponse } from "../types";
-import { fmtDateTime, fmtTokens, fmtUsage, fmtUsageFull, shortDir } from "../lib/util";
+import { fmtDateTime, fmtTokens, fmtUsageFull, shortDir } from "../lib/util";
 
-type Range = "all" | "7d" | "30d";
-
-const RANGES: Array<{ id: Range; label: string; days: number }> = [
-  { id: "all", label: "全部", days: 0 },
-  { id: "7d", label: "近 7 天", days: 7 },
-  { id: "30d", label: "近 30 天", days: 30 },
-];
-
-function rangeSince(r: Range): number {
-  const days = RANGES.find((x) => x.id === r)!.days;
-  return days > 0 ? Date.now() - days * 86400000 : 0;
-}
+const PAGE = 20; // 每页 session 数
 
 export function ReportModule() {
   const { token } = useApp();
   const api = useApi(token);
-  const [range, setRange] = useState<Range>("all");
   const [data, setData] = useState<ReportResponse | null>(null);
   const [err, setErr] = useState<string | null>(null);
-  const [openCwd, setOpenCwd] = useState<string | null>(null);
+  const [selCwd, setSelCwd] = useState<string | null>(null);
 
   useEffect(() => {
     let cancelled = false;
     setErr(null);
-    setData(null);
-    api<ReportResponse>(`/api/report?since=${rangeSince(range)}`)
+    api<ReportResponse>(`/api/report?since=0`)
       .then((d) => !cancelled && setData(d))
       .catch((e) => !cancelled && setErr(String(e)));
     return () => {
       cancelled = true;
     };
-  }, [api, range]);
+  }, [api]);
+
+  // 默认选中第一个项目
+  useEffect(() => {
+    if (data && !selCwd && data.projects[0]) setSelCwd(data.projects[0].cwd);
+  }, [data, selCwd]);
+
+  const sel = data?.projects.find((p) => p.cwd === selCwd) ?? null;
 
   return (
     <div className="stats-view">
-      <div className="toolbar">
-        <div className="tabs">
-          {RANGES.map((r) => (
+      {/* 顶部汇总标题 */}
+      <div
+        className="panel-header"
+        style={{ display: "flex", gap: "1.1rem", alignItems: "baseline", flexWrap: "wrap" }}
+      >
+        {data ? (
+          <>
+            <b>报表</b>
+            <span title="软件版本">v{data.version}</span>
+            <span title="git 用户">👤 {data.gitUser ?? "—"}</span>
+            <span>{data.totals.projects} 项目</span>
+            <span>{data.totals.sessions} 会话</span>
+            <span title={fmtUsageFull(data.totals.tokens)}>
+              token {fmtTokens(data.totals.tokens.input + data.totals.tokens.output)}
+            </span>
+            <span>
+              {data.totals.commitCount} 提交 · +{fmtTokens(data.totals.added)}/-{fmtTokens(data.totals.deleted)}
+            </span>
+            {/* 占位:后期接「上报到服务器」(POST 本报告到远端)。现在禁用。 */}
             <button
-              key={r.id}
               type="button"
-              className={`tab${range === r.id ? " active" : ""}`}
-              onClick={() => setRange(r.id)}
+              className="tab"
+              disabled
+              title="后期接入:把本报告上报到服务器(占位)"
+              style={{ marginLeft: "auto" }}
             >
-              {r.label}
+              ☁ 上报(敬请期待)
             </button>
-          ))}
-        </div>
-        {/* 占位:后期接「上报到服务器」(POST 本报告到远端)。现在禁用,提示敬请期待。 */}
-        <button type="button" className="tab" disabled title="后期接入:把本报告上报到服务器(占位)">
-          ☁ 上报到服务器(敬请期待)
-        </button>
+          </>
+        ) : (
+          <span>{err ? `加载失败:${err}` : "加载中…"}</span>
+        )}
       </div>
 
-      <div className="stats-body">
-        {err && <div className="sum-empty">加载失败:{err}</div>}
-        {!err && !data && <div className="sum-empty">加载中…</div>}
-        {data && (
-          <>
-            <section className="sum-section">
-              <div className="sum-head">
-                <h3>汇总</h3>
-              </div>
-              <div className="bar-list">
-                <div className="bar-row">
-                  <span className="bar-label">软件版本</span>
-                  <span className="bar-val">{data.version}</span>
-                </div>
-                <div className="bar-row">
-                  <span className="bar-label">git 用户</span>
-                  <span className="bar-val">{data.gitUser ?? "—"}</span>
-                </div>
-                <div className="bar-row">
-                  <span className="bar-label">项目数</span>
-                  <span className="bar-val">{data.totals.projects}</span>
-                </div>
-                <div className="bar-row">
-                  <span className="bar-label">会话总数</span>
-                  <span className="bar-val">{data.totals.sessions}</span>
-                </div>
-                <div className="bar-row">
-                  <span className="bar-label">token 总量</span>
-                  <span className="bar-val" title={fmtUsageFull(data.totals.tokens)}>
-                    {fmtUsage(data.totals.tokens) || "—"}
-                  </span>
-                </div>
-                <div className="bar-row">
-                  <span className="bar-label">提交总数</span>
-                  <span className="bar-val">
-                    {data.totals.commitCount} · +{fmtTokens(data.totals.added)}/-{fmtTokens(data.totals.deleted)}
-                  </span>
-                </div>
-              </div>
-            </section>
+      {/* 项目导航 | 详情表格 */}
+      <div className="sessions-with-tree">
+        <aside className="sessions-tree-panel panel">
+          <div className="panel-header">
+            <h2>项目 · {data?.projects.length ?? 0}</h2>
+          </div>
+          {!data || data.projects.length === 0 ? (
+            <div className="empty-state" style={{ padding: "2rem 1rem" }}>
+              <span className="es-hint">暂无项目</span>
+              <span className="es-sub">启动 Claude Code 后会出现</span>
+            </div>
+          ) : (
+            <ul className="report-nav">
+              {data.projects.map((p) => (
+                <li
+                  key={p.cwd}
+                  className={p.cwd === selCwd ? "active" : undefined}
+                  title={p.cwd}
+                  onClick={() => setSelCwd(p.cwd)}
+                >
+                  {shortDir(p.cwd) || p.cwd}
+                </li>
+              ))}
+            </ul>
+          )}
+        </aside>
 
-            {data.projects.length === 0 && <div className="sum-empty">窗口内无项目数据</div>}
-            {data.projects.map((p) => (
-              <ReportCard
-                key={p.cwd}
-                p={p}
-                open={openCwd === p.cwd}
-                onToggle={() => setOpenCwd(openCwd === p.cwd ? null : p.cwd)}
-              />
-            ))}
-          </>
-        )}
+        <Splitter orient="v" varName="--tree-w" />
+
+        <div className="sessions-main">
+          {sel ? (
+            <ProjectDetail key={sel.cwd} p={sel} />
+          ) : (
+            <div className="empty-state">
+              <Icon name="log" size={30} />
+              <span className="es-hint">选左侧项目查看详情</span>
+            </div>
+          )}
+        </div>
       </div>
     </div>
   );
 }
 
-function ReportCard({ p, open, onToggle }: { p: ReportProject; open: boolean; onToggle: () => void }) {
+/** 右侧详情:标题(输入/输出 token 汇总 + 提交汇总) + session 表格(分页,隐藏 0 token)。
+ *  key=sel.cwd:换项目时重挂载,分页回到第 1 页。 */
+function ProjectDetail({ p }: { p: ReportProject }) {
+  const [page, setPage] = useState(1);
+  // 过滤掉 0 token 的 session(tokenTotal 为 null 或 input+output=0)
+  const rows = p.sessions.filter((s) => s.tokenTotal && s.tokenTotal.input + s.tokenTotal.output > 0);
+  const pageCount = Math.max(1, Math.ceil(rows.length / PAGE));
+  const cur = Math.min(page, pageCount);
+  const pageRows = rows.slice((cur - 1) * PAGE, cur * PAGE);
+
   return (
-    <section className="sum-section">
-      <div className="sum-head">
-        <h3 title={p.cwd}>{shortDir(p.cwd) || p.cwd}</h3>
-        <span style={{ marginLeft: "auto", opacity: 0.65, fontSize: "var(--fs-xs)" }}>
-          {p.gitUser ? `@${p.gitUser}` : "@—"}
-          {p.gitError ? " · git 不可用" : ""}
+    <>
+      <div className="report-title">
+        <span className="rt-sum" title={fmtUsageFull(p.totalTokens)}>
+          输入 token <b>{fmtTokens(p.totalTokens.input)}</b>
+        </span>
+        <span className="rt-sum" title={fmtUsageFull(p.totalTokens)}>
+          输出 token <b>{fmtTokens(p.totalTokens.output)}</b>
+        </span>
+        <span className="rt-sum" style={{ marginLeft: "auto" }}>
+          {p.commits.count} 提交 · +{fmtTokens(p.commits.added)}/-{fmtTokens(p.commits.deleted)}
+          {p.commits.lastTime ? ` · 最近 ${fmtDateTime(p.commits.lastTime)}` : ""}
         </span>
-        <button type="button" className="tab" onClick={onToggle} style={{ marginLeft: "0.5rem" }}>
-          {open ? "收起" : "展开"}
-        </button>
-      </div>
-      <div className="bar-list">
-        <div className="bar-row">
-          <span className="bar-label">会话</span>
-          <span className="bar-val">{p.sessionCount}</span>
-        </div>
-        <div className="bar-row">
-          <span className="bar-label">token</span>
-          <span className="bar-val" title={fmtUsageFull(p.totalTokens)}>
-            {fmtUsage(p.totalTokens) || "—"}
-          </span>
-        </div>
-        <div className="bar-row">
-          <span className="bar-label">提交</span>
-          <span className="bar-val">
-            {p.commits.count} · +{fmtTokens(p.commits.added)}/-{fmtTokens(p.commits.deleted)}
-          </span>
-        </div>
-        <div className="bar-row">
-          <span className="bar-label">最近提交</span>
-          <span className="bar-val">{p.commits.lastTime ? fmtDateTime(p.commits.lastTime) : "—"}</span>
-        </div>
       </div>
 
-      {open && (
-        <>
-          <div className="sum-head" style={{ marginTop: "0.8rem" }}>
-            <h3>会话 token 明细 · {p.sessions.length}</h3>
-          </div>
-          {p.sessions.length === 0 ? (
-            <div className="sum-empty">无会话</div>
-          ) : (
-            <div className="bar-list">
-              {p.sessions.map((s) => (
-                <div className="bar-row" key={s.sessionId}>
-                  <span className="bar-label" title={s.sessionId}>
-                    {s.sessionId.slice(0, 8)} · {fmtDateTime(s.lastActive)}
-                  </span>
-                  <span className="bar-val" title={fmtUsageFull(s.tokenTotal)}>
-                    {fmtUsage(s.tokenTotal) || "—"}
-                  </span>
-                </div>
-              ))}
-            </div>
-          )}
+      <div style={{ overflow: "auto", flex: "1 1 0", minHeight: 0 }}>
+        <table className="report-table">
+          <thead>
+            <tr>
+              <th className="rt-idx">#</th>
+              <th>Session</th>
+              <th>时间</th>
+              <th className="rt-num">输入 token</th>
+              <th className="rt-num">输出 token</th>
+            </tr>
+          </thead>
+          <tbody>
+            {pageRows.map((s, idx) => (
+              <tr key={s.sessionId}>
+                <td className="rt-idx">{(cur - 1) * PAGE + idx + 1}</td>
+                <td className="rt-sid" title={s.sessionId}>
+                  {s.sessionId.slice(0, 8)}
+                </td>
+                <td>{fmtDateTime(s.lastActive)}</td>
+                <td className="rt-num">{fmtTokens(s.tokenTotal!.input)}</td>
+                <td className="rt-num">{fmtTokens(s.tokenTotal!.output)}</td>
+              </tr>
+            ))}
+          </tbody>
+        </table>
+        {rows.length === 0 && <div className="sum-empty">无有效会话(均已隐藏 0 token)</div>}
+      </div>
 
-          <div className="sum-head" style={{ marginTop: "0.8rem" }}>
-            <h3>最近提交 · {p.recentCommits.length}</h3>
-          </div>
-          {p.recentCommits.length === 0 ? (
-            <div className="sum-empty">无提交</div>
-          ) : (
-            <div className="bar-list">
-              {p.recentCommits.map((c) => (
-                <div className="bar-row" key={c.hash}>
-                  <span className="bar-label" title={c.subject}>
-                    {(c.subject || c.hash).slice(0, 40)}
-                  </span>
-                  <span className="bar-val">
-                    {fmtDateTime(c.time)} · +{c.added}/-{c.deleted}
-                  </span>
-                </div>
-              ))}
-            </div>
-          )}
-        </>
-      )}
-    </section>
+      <div className="report-pager">
+        <button type="button" disabled={cur <= 1} onClick={() => setPage(cur - 1)}>
+          ‹ 上一页
+        </button>
+        <span>
+          第 {cur} / {pageCount} 页
+        </span>
+        <button type="button" disabled={cur >= pageCount} onClick={() => setPage(cur + 1)}>
+          下一页 ›
+        </button>
+        <span style={{ marginLeft: "auto" }}>共 {rows.length} 个会话(已隐藏 0 token)</span>
+      </div>
+    </>
   );
 }

package/ui/components/SettingsModule.tsx

@@ -0,0 +1,127 @@
+// 「设置」模块:上报地址 + 自动上报间隔(分钟)。
+// GET /api/settings 读、PUT /api/settings 写。daemon 侧按间隔定时 POST 报表到上报地址。
+import { useEffect, useState } from "react";
+import { useApi } from "../hooks/useApi";
+import { useApp } from "../state/AppContext";
+
+interface Settings {
+  reportUrl?: string | null;
+  reportIntervalMin?: number | null;
+}
+
+export function SettingsModule() {
+  const { token } = useApp();
+  const api = useApi(token);
+  const base = location.origin;
+  const [url, setUrl] = useState("");
+  const [intervalStr, setIntervalStr] = useState("");
+  const [loading, setLoading] = useState(true);
+  const [saving, setSaving] = useState(false);
+  const [msg, setMsg] = useState<{ kind: "ok" | "err"; text: string } | null>(null);
+
+  useEffect(() => {
+    api<Settings>("/api/settings")
+      .then((s) => {
+        setUrl(s.reportUrl ?? "");
+        setIntervalStr(s.reportIntervalMin != null ? String(s.reportIntervalMin) : "");
+        setLoading(false);
+      })
+      .catch(() => {
+        setMsg({ kind: "err", text: "读取设置失败" });
+        setLoading(false);
+      });
+  }, [api]);
+
+  const save = async () => {
+    setSaving(true);
+    setMsg(null);
+    const iv = parseInt(intervalStr, 10);
+    const body = {
+      reportUrl: url.trim() || null,
+      reportIntervalMin: Number.isFinite(iv) && iv > 0 ? iv : null,
+    };
+    try {
+      const res = await fetch(base + "/api/settings", {
+        method: "PUT",
+        headers: { Authorization: "Bearer " + token, "content-type": "application/json" },
+        body: JSON.stringify(body),
+      });
+      if (!res.ok) throw new Error(String(res.status));
+      const s = (await res.json()) as Settings;
+      setUrl(s.reportUrl ?? "");
+      setIntervalStr(s.reportIntervalMin != null ? String(s.reportIntervalMin) : "");
+      setMsg({ kind: "ok", text: "已保存" });
+      setTimeout(() => setMsg(null), 2000);
+    } catch {
+      setMsg({ kind: "err", text: "保存失败,请重试" });
+    } finally {
+      setSaving(false);
+    }
+  };
+
+  return (
+    <div className="stats-view">
+      <div className="panel-header">
+        <h2>设置</h2>
+      </div>
+      <div className="stats-body">
+        {loading ? (
+          <div className="sum-empty">加载中…</div>
+        ) : (
+          <>
+            <section className="sum-section">
+              <div className="sum-head">
+                <h3>上报</h3>
+              </div>
+              <div className="field-row">
+                <label>上报地址</label>
+                <input
+                  className="field-input"
+                  type="url"
+                  placeholder="https://your-server/api/report"
+                  value={url}
+                  onChange={(e) => setUrl(e.target.value)}
+                  spellCheck={false}
+                />
+              </div>
+              <div className="field-row">
+                <label>上报间隔</label>
+                <input
+                  className="field-input"
+                  type="number"
+                  min={1}
+                  placeholder="0 = 不自动上报"
+                  value={intervalStr}
+                  onChange={(e) => setIntervalStr(e.target.value)}
+                  spellCheck={false}
+                  style={{ flex: "0 0 120px" }}
+                />
+                <span className="field-hint" style={{ padding: 0 }}>
+                  分钟(填了地址且间隔大于 0 才会自动上报)
+                </span>
+              </div>
+              <div className="field-row">
+                <label /> {/* 占位对齐 */}
+                <button
+                  type="button"
+                  className="tab"
+                  onClick={save}
+                  disabled={saving}
+                  title="保存设置"
+                >
+                  {saving ? "保存中…" : "保存"}
+                </button>
+                {msg && (
+                  <span className={msg.kind === "ok" ? "field-ok" : "field-err"}>{msg.text}</span>
+                )}
+              </div>
+              <div className="field-hint">
+                daemon 每分钟检查一次:地址 + 间隔都配了,就把「报表」数据 POST 到该地址;留空 / 间隔 0 = 不上报。改完无需重启。
+              </div>
+            </section>
+          </>
+        )}
+      </div>
+    </div>
+  );
+}

package/ui/components/SideNav.tsx

@@ -8,8 +8,9 @@ const ITEMS: Array<{ id: ModuleId; label: string; icon: IconName }> = [
   { id: "sessions", label: "会话", icon: "sessions" },
   // { id: "events", label: "事件", icon: "activity" },   // 暂时屏蔽，恢复取消注释即可
   // { id: "commits", label: "提交", icon: "git" },        // 暂时屏蔽，恢复取消注释即可
-  { id: "stats", label: "统计", icon: "chart" },
-  { id: "report", label: "数据上报", icon: "log" },
+  // { id: "stats", label: "统计", icon: "chart" },   // 暂时屏蔽,恢复取消注释即可
+  { id: "report", label: "报表", icon: "log" },
+  { id: "settings", label: "设置", icon: "sliders" },
   { id: "system", label: "系统", icon: "server" },
 ];
 

package/ui/style.css

@@ -847,3 +847,31 @@ ul { list-style: none; margin: 0; padding: 0; }
 .cf-add { color: #9bcd97; text-align: right; }
 .cf-del { color: #fc533a; text-align: right; }
 .cf-path { color: var(--text); overflow: hidden; text-overflow: ellipsis; }
+
+/* 数据上报模块:表格 + 标题汇总 */
+.report-title { display: flex; gap: 1.2rem; align-items: baseline; flex-wrap: wrap; padding: 0.55rem 0.8rem; border-bottom: 1px solid var(--border); flex: 0 0 auto; }
+.report-title h2 { margin: 0; font-size: var(--fs-md); }
+.report-title .rt-sum { color: var(--muted); font-size: var(--fs-xs); white-space: nowrap; }
+.report-title .rt-sum b { color: var(--text); font-family: Consolas, "Courier New", monospace; font-variant-numeric: tabular-nums; }
+.report-table { width: 100%; border-collapse: collapse; font-size: var(--fs-xs); }
+.report-table th { position: sticky; top: 0; background: var(--bg); text-align: left; color: var(--muted); font-weight: 600; padding: 0.45rem 0.6rem; border-bottom: 1px solid var(--border-light); white-space: nowrap; }
+.report-table td { padding: 0.32rem 0.6rem; border-bottom: 1px solid var(--border); color: var(--text); white-space: nowrap; }
+.report-table th.rt-num, .report-table td.rt-num { text-align: right; font-family: Consolas, "Courier New", monospace; font-variant-numeric: tabular-nums; color: var(--muted); }
+.report-table td.rt-sid { font-family: Consolas, "Courier New", monospace; color: var(--c-session); }
+.report-table th.rt-idx, .report-table td.rt-idx { text-align: center; width: 3rem; color: var(--muted); }
+.report-table tr:hover td { background: var(--hover); }
+.report-nav { list-style: none; margin: 0; padding: 0.3rem; }
+.report-nav li { padding: 0.45rem 0.7rem; border-radius: 4px; cursor: pointer; color: var(--text); font-size: var(--fs-sm); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
+.report-nav li:hover { background: var(--hover); }
+.report-nav li.active { background: var(--accent); color: #fff; }
+.report-pager { display: flex; align-items: center; gap: 0.6rem; padding: 0.4rem 0.8rem; border-top: 1px solid var(--border); color: var(--muted); font-size: var(--fs-xs); flex: 0 0 auto; }
+.report-pager button { background: none; border: 1px solid var(--border-light); color: var(--text); border-radius: 4px; padding: 0.15rem 0.55rem; cursor: pointer; font-size: var(--fs-xs); }
+.report-pager button:disabled { opacity: 0.4; cursor: default; }
+/* 设置模块:表单输入 */
+.field-row { display: flex; align-items: center; gap: 0.6rem; padding: 0.55rem 0.8rem; }
+.field-row label { flex: 0 0 88px; color: var(--muted); font-size: var(--fs-xs); }
+.field-input { background: var(--bg); border: 1px solid var(--border-light); color: var(--text); border-radius: 4px; padding: 0.4rem 0.6rem; font-size: var(--fs-sm); font-family: Consolas, "Courier New", monospace; min-width: 0; flex: 1 1 auto; }
+.field-input:focus { outline: none; border-color: var(--accent-line); }
+.field-hint { color: var(--muted); font-size: var(--fs-xs); padding: 0.3rem 0.8rem; }
+.field-ok { color: #9bcd97; }
+.field-err { color: var(--c-err, #fc533a); }

package/ui/types.ts

@@ -49,4 +49,4 @@ export type Payload = Record<string, unknown>;
 export type ViewMode = "events" | "conversation" | "commits" | "summary";
 
 /** 左侧导航模块（渐进重构：Step 1 起与 viewMode 并存，selectModule 经映射驱动 viewMode）。 */
-export type ModuleId = "overview" | "sessions" | "events" | "commits" | "stats" | "report" | "system";
+export type ModuleId = "overview" | "sessions" | "events" | "commits" | "stats" | "report" | "settings" | "system";