Read Claude Code usage from local session logs, redesign panel as separate cards
This commit is contained in:
+12
-12
@@ -5,18 +5,18 @@ import { shell } from "../lib/utils"
|
||||
type ClaudeUsage = {
|
||||
available: boolean
|
||||
tokens: number
|
||||
costUsd: number
|
||||
messages: number
|
||||
}
|
||||
|
||||
const usage = createPoll<ClaudeUsage>(
|
||||
{ available: false, tokens: 0, costUsd: 0 },
|
||||
{ available: false, tokens: 0, messages: 0 },
|
||||
60000,
|
||||
shell("bash $HOME/.config/ags/lib/claude-usage.sh"),
|
||||
(stdout) => {
|
||||
try {
|
||||
return JSON.parse(stdout.trim())
|
||||
} catch {
|
||||
return { available: false, tokens: 0, costUsd: 0 }
|
||||
return { available: false, tokens: 0, messages: 0 }
|
||||
}
|
||||
},
|
||||
)
|
||||
@@ -29,26 +29,26 @@ function formatTokens(tokens: number) {
|
||||
|
||||
export function ClaudeUsageCard() {
|
||||
return (
|
||||
<box class="side-card" vertical spacing={6}>
|
||||
<box class="panel widget-card" vertical spacing={6}>
|
||||
<box spacing={8}>
|
||||
<label class="side-card-icon" label={""} />
|
||||
<label class="side-card-title" label="Claude Code" xalign={0} halign={Gtk.Align.START} hexpand />
|
||||
<label class="widget-card-icon" label={""} />
|
||||
<label class="widget-card-title" label="Claude Code" xalign={0} halign={Gtk.Align.START} hexpand />
|
||||
</box>
|
||||
<label
|
||||
class="side-card-empty"
|
||||
label="No admin key set"
|
||||
class="widget-card-empty"
|
||||
label="No usage logs found"
|
||||
xalign={0}
|
||||
halign={Gtk.Align.START}
|
||||
visible={usage.as((u) => !u.available)}
|
||||
/>
|
||||
<box vertical spacing={4} visible={usage.as((u) => u.available)}>
|
||||
<box spacing={8}>
|
||||
<label class="side-card-label" label="Tokens today" xalign={0} halign={Gtk.Align.START} hexpand />
|
||||
<label class="side-card-value" label={usage.as((u) => formatTokens(u.tokens))} />
|
||||
<label class="widget-card-label" label="Tokens today" xalign={0} halign={Gtk.Align.START} hexpand />
|
||||
<label class="widget-card-value" label={usage.as((u) => formatTokens(u.tokens))} />
|
||||
</box>
|
||||
<box spacing={8}>
|
||||
<label class="side-card-label" label="Cost today" xalign={0} halign={Gtk.Align.START} hexpand />
|
||||
<label class="side-card-value" label={usage.as((u) => `$${u.costUsd.toFixed(2)}`)} />
|
||||
<label class="widget-card-label" label="Messages today" xalign={0} halign={Gtk.Align.START} hexpand />
|
||||
<label class="widget-card-value" label={usage.as((u) => `${u.messages}`)} />
|
||||
</box>
|
||||
</box>
|
||||
</box>
|
||||
|
||||
Reference in New Issue
Block a user