refactor admin navigation; update links to ingest pages and improve loading of data in parallel

This commit is contained in:
ImBenji 2026-04-24 00:48:49 +01:00
parent 1119ba015e
commit 3c57896aa0
2 changed files with 85 additions and 16 deletions

View file

@ -454,14 +454,14 @@ body.page-graph #graph-info {
/* ── signal cards ── */ /* ── signal cards ── */
/* compact tiles just company + ticker + signal badge. everything else /* compact glance tile header row (co + ticker + badge), a short summary
(summary, drivers, risks, tags, timestamp, references) lives in the preview, and the conf/risk/timeframe tag row. drivers, risks, full
detail dialog opened via openSignalModal(). */ summary, refs and timestamp stay in the detail dialog. */
.signal-grid { .signal-grid {
display: grid; display: grid;
grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
gap: 10px; gap: 12px;
} }
.signal-card { .signal-card {
@ -470,9 +470,8 @@ body.page-graph #graph-info {
border-radius: var(--radius); border-radius: var(--radius);
padding: 12px 14px; padding: 12px 14px;
display: flex; display: flex;
align-items: center; flex-direction: column;
justify-content: space-between; gap: 10px;
gap: 12px;
cursor: pointer; cursor: pointer;
transition: border-color .15s, background .15s; transition: border-color .15s, background .15s;
} }
@ -482,6 +481,13 @@ body.page-graph #graph-info {
background: #13203a; background: #13203a;
} }
.signal-card-head {
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
}
.signal-card-main { .signal-card-main {
min-width: 0; /* so the text children can truncate if ever needed */ min-width: 0; /* so the text children can truncate if ever needed */
display: flex; display: flex;
@ -505,6 +511,28 @@ body.page-graph #graph-info {
letter-spacing: .04em; letter-spacing: .04em;
} }
.signal-card-summary {
margin: 0;
font-size: 12px;
line-height: 1.45;
color: var(--muted);
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.signal-card-tags {
display: flex;
flex-wrap: wrap;
gap: 5px;
}
.signal-card-tags .signal-tag {
font-size: 10.5px;
padding: 2px 6px;
}
.signal-badge { .signal-badge {
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
@ -608,6 +636,33 @@ body.page-graph #graph-info {
padding: 20px 24px; padding: 20px 24px;
overflow-y: auto; overflow-y: auto;
min-height: 0; min-height: 0;
/* firefox */
scrollbar-width: thin;
scrollbar-color: var(--border) transparent;
}
/* webkit — chrome, safari, edge */
.signal-modal-col::-webkit-scrollbar {
width: 8px;
}
.signal-modal-col::-webkit-scrollbar-track {
background: transparent;
}
.signal-modal-col::-webkit-scrollbar-thumb {
background: var(--border);
border-radius: 4px;
/* inset padding so the thumb doesnt hug the dialog edge */
border: 2px solid transparent;
background-clip: padding-box;
}
.signal-modal-col::-webkit-scrollbar-thumb:hover {
background: var(--muted-dark);
background-clip: padding-box;
border: 2px solid transparent;
} }
.signal-modal-col-main { .signal-modal-col-main {

View file

@ -29,17 +29,31 @@ async function loadSignals() {
empty.style.display = "none"; empty.style.display = "none";
// compact tile — everything else (summary, drivers, risks, refs, ts) // glance tile — header, a short summary preview, and the three meta tags
// lives in the dialog. this stays a pure at-a-glance signal. // (conf/risk/timeframe). drivers, risks, refs etc live in the dialog.
grid.innerHTML = data.map(s => ` grid.innerHTML = data.map(s => {
const summary = (s.summary || "").trim();
return `
<div class="signal-card" onclick="openSignalModal(${s.company_id})"> <div class="signal-card" onclick="openSignalModal(${s.company_id})">
<div class="signal-card-head">
<div class="signal-card-main"> <div class="signal-card-main">
<div class="signal-company">${escapeHtml(s.company_name)}</div> <div class="signal-company">${escapeHtml(s.company_name)}</div>
<div class="signal-ticker">${escapeHtml(s.ticker)}</div> <div class="signal-ticker">${escapeHtml(s.ticker)}</div>
</div> </div>
<span class="signal-badge ${s.signal}">${s.signal}</span> <span class="signal-badge ${s.signal}">${s.signal}</span>
</div> </div>
`).join("");
${summary ? `<p class="signal-card-summary">${escapeHtml(summary)}</p>` : ""}
<div class="signal-card-tags">
<span class="signal-tag">conf: ${escapeHtml(s.confidence)}</span>
<span class="signal-tag">risk: ${escapeHtml(s.risk_level)}</span>
<span class="signal-tag">${escapeHtml(s.timeframe)}</span>
</div>
</div>
`;
}).join("");
} }