Skip to content

Commit 9fd81ee

Browse files
committed
fix(app): compact Codex usage label
1 parent 3945ed5 commit 9fd81ee

3 files changed

Lines changed: 25 additions & 12 deletions

File tree

packages/app/src/components/codex-usage.test.tsx

Lines changed: 10 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -48,9 +48,9 @@ test.skipIf(isServer)(
4848
for (const direction of ["ltr", "rtl"] as const) {
4949
const view = mount(direction)
5050
const button = view.host.querySelector("button")!
51-
expect(button.textContent).toBe("Codex 58% remaining")
51+
expect(button.textContent).toBe("58%")
5252
expect(button.getAttribute("aria-label")).toBe("Codex 58% remaining")
53-
expect(button.querySelector("bdi")).not.toBeNull()
53+
expect(button.querySelector("bdi")?.dir).toBe("ltr")
5454
button.focus()
5555
expect(document.activeElement).toBe(button)
5656
}
@@ -75,11 +75,16 @@ test.skipIf(isServer)("most constrained window, stale and unavailable labels, an
7575
{ kind: "secondary", remainingPercent: 24.9, windowSeconds: 604800 },
7676
],
7777
})
78-
expect(view.host.textContent).toBe("Codex 24% remaining")
78+
expect(view.host.textContent).toBe("24%")
79+
expect(view.host.querySelector("button")!.getAttribute("aria-label")).toBe("Codex 24% remaining")
7980
view.setState("now", 92000)
80-
expect(view.host.textContent).toBe("Codex 24% · stale")
81+
expect(view.host.textContent).toBe("24%")
82+
expect(view.host.querySelector("button")!.getAttribute("aria-label")).toBe("Codex 24% · stale")
8183
view.setState("usage", { status: "unknown", windows: [] })
82-
expect(view.host.textContent).toBe("Codex —")
84+
expect(view.host.textContent).toBe("—")
85+
expect(view.host.querySelector("button")!.getAttribute("aria-label")).toBe("Codex —")
86+
view.setState("usage", { status: "fresh", windows: [{ kind: "primary", remainingPercent: 0, windowSeconds: 18000 }] })
87+
expect(view.host.textContent).toBe("0%")
8388
view.setState("usage", { status: "unsupported", windows: [] })
8489
expect(view.host.querySelector("button")).toBeNull()
8590
view.setState("capable", false)

packages/app/src/components/codex-usage.tsx

Lines changed: 13 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -35,16 +35,18 @@ export function CodexUsageDisplay(props: { state: ReturnType<typeof createShared
3535
return usage && codexUsageStale(usage, state.now) ? usage.updatedAt : undefined
3636
}
3737

38-
const label = () => {
38+
const percent = () => {
3939
const usage = state.usage
40-
if (!usage || usage.status === "unknown" || !usage.windows.length)
41-
return language.t("settings.providers.codexUsage.compactUnknown")
42-
const percent = Math.floor(Math.min(...usage.windows.map((window) => window.remainingPercent)))
40+
if (!usage || usage.status === "unknown" || !usage.windows.length) return
41+
return Math.floor(Math.min(...usage.windows.map((window) => window.remainingPercent)))
42+
}
43+
const label = () => {
44+
if (percent() === undefined) return language.t("settings.providers.codexUsage.compactUnknown")
4345
return language.t(
44-
codexUsageStale(usage, state.now)
46+
state.usage && codexUsageStale(state.usage, state.now)
4547
? "settings.providers.codexUsage.compactStale"
4648
: "settings.providers.codexUsage.compact",
47-
{ percent },
49+
{ percent: percent()! },
4850
)
4951
}
5052

@@ -122,7 +124,11 @@ export function CodexUsageDisplay(props: { state: ReturnType<typeof createShared
122124
if (event.key === "Escape") setFocus("active", false)
123125
}}
124126
>
125-
<bdi>{label()}</bdi>
127+
<bdi dir="ltr">
128+
{percent() === undefined
129+
? language.t("settings.providers.codexUsage.percentUnknown")
130+
: language.t("settings.providers.codexUsage.percent", { percent: percent()! })}
131+
</bdi>
126132
</button>
127133
</Tooltip>
128134
</Show>

packages/app/src/i18n/feature-fallback.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,8 @@ export const FEATURE_ENGLISH_FALLBACK = {
33
"settings.providers.codexUsage.compact": "Codex {{percent}}% remaining",
44
"settings.providers.codexUsage.compactStale": "Codex {{percent}}% · stale",
55
"settings.providers.codexUsage.compactUnknown": "Codex —",
6+
"settings.providers.codexUsage.percent": "{{percent}}%",
7+
"settings.providers.codexUsage.percentUnknown": "—",
68
"settings.providers.codexUsage.minimum": "Shows the lowest remaining percentage across windows.",
79
"settings.providers.codexUsage.lastKnown": "Last known usage · may be out of date",
810
"settings.providers.codexUsage.weekly": "{{percent}}% remaining · weekly window",

0 commit comments

Comments
 (0)