mirror of
https://github.com/AgentSeal/codeburn.git
synced 2026-05-21 02:07:12 +00:00
fix(desktop): add missing CSS classes, fix longest streak to iterate calendar days, fix insight pill padding
This commit is contained in:
parent
1b6f2f9946
commit
af44848af2
3 changed files with 34 additions and 10 deletions
|
|
@ -38,10 +38,20 @@ function computeStats(payload: MenubarPayload, currency: CurrencyState) {
|
|||
|
||||
let longestStreak = 0
|
||||
let running = 0
|
||||
const sorted = [...history].sort((a, b) => a.date.localeCompare(b.date))
|
||||
for (const d of sorted) {
|
||||
if (d.cost > 0) { running++; longestStreak = Math.max(longestStreak, running) }
|
||||
else running = 0
|
||||
if (history.length > 0) {
|
||||
const sorted = [...history].sort((a, b) => a.date.localeCompare(b.date))
|
||||
const first = new Date(sorted[0].date + 'T00:00:00Z')
|
||||
const last = addDays(today, 0)
|
||||
const totalDays = Math.round((last.getTime() - first.getTime()) / 86_400_000) + 1
|
||||
for (let i = 0; i < totalDays; i++) {
|
||||
const key = formatDateKey(addDays(first, i))
|
||||
if ((costByDate.get(key) ?? 0) > 0) {
|
||||
running++
|
||||
longestStreak = Math.max(longestStreak, running)
|
||||
} else {
|
||||
running = 0
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const lifetimeTotal = history.length > 0 ? history.reduce((s, d) => s + d.cost, 0) : null
|
||||
|
|
|
|||
|
|
@ -69,10 +69,8 @@ export function TrendInsight({ days, currency }: Props) {
|
|||
const avgVal = bars.length > 0 ? bars.reduce((s, b) => s + metric(b), 0) / bars.length : 0
|
||||
const totalCost = bars.reduce((s, b) => s + b.cost, 0)
|
||||
const peak = bars.filter(b => metric(b) > 0).sort((a, b) => metric(b) - metric(a))[0]
|
||||
const yesterday = bars.find(b => {
|
||||
const yd = formatDateKey(addDays(startOfDay(new Date()), -1))
|
||||
return b.date === yd
|
||||
})
|
||||
const yd = formatDateKey(addDays(startOfDay(new Date()), -1))
|
||||
const yesterday = bars.find(b => b.date === yd)
|
||||
const delta = computeDelta(bars, days)
|
||||
|
||||
const fmtVal = (v: number) => useTokens ? `${formatTokens(v)} tok` : formatCompactCurrency(v, currency)
|
||||
|
|
|
|||
|
|
@ -185,8 +185,8 @@ html, body, #root {
|
|||
/* ---- collapsible section header ---- */
|
||||
.section-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
width: 100%;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
|
|
@ -198,6 +198,21 @@ html, body, #root {
|
|||
letter-spacing: 0.2px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.section-header-left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
}
|
||||
.section-header-right {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
font-size: 10px;
|
||||
font-weight: 500;
|
||||
text-transform: uppercase;
|
||||
color: var(--text-tertiary);
|
||||
letter-spacing: 0.3px;
|
||||
}
|
||||
.section-dot {
|
||||
width: 5px; height: 5px; border-radius: 50%;
|
||||
background: var(--brand-accent);
|
||||
|
|
@ -214,6 +229,8 @@ html, body, #root {
|
|||
color: var(--text-tertiary);
|
||||
letter-spacing: 0.3px;
|
||||
}
|
||||
.col-header { min-width: 44px; text-align: right; }
|
||||
.section-body { padding-bottom: 6px; }
|
||||
.chevron {
|
||||
font-size: 10px;
|
||||
color: var(--text-tertiary);
|
||||
|
|
@ -347,7 +364,6 @@ html, body, #root {
|
|||
.insight-pills {
|
||||
display: flex;
|
||||
gap: 4px;
|
||||
padding: 0 var(--spacing-lg);
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.insight-pill {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue