CodexとClaude Codeの使用状況を確認できるWindowsウィジェットを作りました

AI

CodexとClaude Codeを使っていると、今どのくらい利用枠が残っているのか気になります。

そのたびに設定画面やコマンドを開くのも面倒なので、Windowsのデスクトップに常駐する使用状況ウィジェットを作りました。

今回は自分で最初から全部組むのではなく、Codexに相談しながら、調査、実装、修正、動作確認まで進めています。

GitHubでウィジェットの土台を探す

最初に探したのは、見た目を自由に変えられて、Windowsで常駐できるウィジェットアプリです。

GitHubにある候補を比べ、土台にはZebarを使いました。

ZebarはHTML、CSS、JavaScriptでデスクトップウィジェットを作れます。

Webページに近い感覚でデザインでき、ウィンドウサイズや表示位置、透明度なども調整しやすいところが選んだ理由です。

Codexの5時間枠と週間枠を円グラフで表示

Codexの画面には、5時間枠と週間枠の残量を円グラフで表示しました。

使用率だけではなく、残り何%なのか、次のリセット時刻はいつなのかも確認できます。

最初は棒グラフ中心の表示でしたが、数字を探さなくても状態が分かるように円グラフへ変更しました。

色も固定ではなく、ライム、シアン、バイオレット、コーラルから選べます。

背景の透明度、自動更新の間隔、コンパクト表示も設定できるようにしました。

最小化すると消えてしまった

作ってすぐに気付いたのが、ウィジェットを最小化すると画面から消え、戻せなくなる問題です。

終了したわけではなく、タスクバーに復元する入口が出ていませんでした。

そこで、Zebarの設定を直してタスクバーに表示されるようにしました。

修正後は、実際のウィンドウを最小化し、タスクバーから復元できるところまで確認しています。

見た目が完成していても、普段の操作で戻せなければ使いにくいです。

こういうところは、画像だけを見ていても分かりませんね。

CodexとClaude Codeは別画面にした

次にClaude Codeの使用状況も追加しました。

最初は一つの画面にCodexとClaude Codeを並べましたが、情報が詰まりすぎて円グラフも小さくなりました。

そこで上部にタブを置き、CodexとClaude Codeを別画面で切り替える形にしています。

どちらの画面にも5時間枠と週間枠の円グラフがあり、一方のデータ取得に失敗しても、もう一方は表示を続けます。

キーボードの左右キーでもタブを切り替えられるようにしました。

Claudeデスクトップの再起動では直らなかった

Claude Code側は少し苦労しました。

Claudeデスクトップを再起動しても、ウィジェットには「残量を取得できません」と表示されたままでした。

調べてみると、この環境ではClaudeデスクトップのログインと、独立したClaude Code CLIのログインが別になっていました。

デスクトップアプリが使えていても、Claude Code CLIは未ログインだったのです。

Claude Code CLIで認証し、端末版のClaude Codeから実際に1回応答を受け取ると、5時間枠と週間枠がウィジェットへ同期されました。

Claude Codeの公式仕様でも、カスタムステータスラインはセッション情報をJSONで受け取り、ProまたはMax契約の利用枠は最初のAPI応答後に渡されます。

Claude Code公式:ステータスラインの仕様

ですから、Claudeデスクトップを再起動するだけでは足りません。

初回はClaude Code CLIへログインし、端末版で1回メッセージを送る必要があります。

認証情報はウィジェットに保存しない

利用率を表示するために、OAuthトークンや認証ファイルを直接読む仕組みにはしませんでした。

Codexはローカルで利用状況を照会し、Claude Codeは公式ステータスラインから渡される使用率とリセット時刻だけをキャッシュします。

Claude Codeを閉じている間は最後に取得した数値を表示し、古くなった場合は「キャッシュ」と分かるようにしています。

残量が表示できても、認証情報まで別のプログラムへ渡すのは避けたいところです。

配布用ZIPからも動作を確認

最後はソースコードを動かすだけではなく、配布用ZIPを展開してインストールしました。

CodexとClaude Codeの切り替え、円グラフ、更新、設定画面、最小化と復元を確認し、Codex側の取得がClaude Code追加後も壊れていないことも確認しています。

自動テストは8件すべて通り、別の確認担当(サブエージェント)にもインストール済みファイルと取得結果を再確認してもらいました。

ただし、Codex側は現在のローカル動作を利用しているため、将来の更新で追随が必要になる可能性があります。

Claude Code側も、初回のCLIログインと最初の応答が必要です。

それでも、普段はデスクトップの小さな画面を見るだけで両方の残量が分かります。

毎日使うものは、数字そのものより、確認するまでの手間を減らすほうが効きますね。

コメント

タイトルとURLをコピーしました