ClaudeMods
☰
ZH-TW
● 0 人在線上 · 瀏覽 0 次
贊助提交作品
GitHub 儲存庫 · 發布者 hamzafer

prayer-times

目前的禮拜時間與剩餘時間、下一個禮拜時間,以及 zawal,顯示在提示列上方。由你的電腦依你的位置計算,不會傳送到任何地方。

hamzafer@hamzafer

hamzafer/claude-code-mods/tree/main/mods/prayer-times

原貼文圖片1
已翻譯

關於這個 mod

<p align="center"><img src="images/claude-wave.gif" alt="" width="40"></p> <h1 align="center">Claude Code mods</h1> <p align="center"><b>讓 Claude Code 顯示它正在做的事。</b><br>Claude Code 的外掛,建立在函式掛鉤(function hooks)上:提示列上方的即時資訊列、防護、面板與遊戲。只安裝你需要的。</p> <p align="center"> <a href="LICENSE"><img src="https://img.shields.io/badge/license-MIT-blue.svg" alt="MIT"></a> <a href="https://github.com/hamzafer/claude-code-mods/actions/workflows/ci.yml"><img src="https://github.com/hamzafer/claude-code-mods/actions/workflows/ci.yml/badge.svg?branch=main" alt="CI"></a> </p> <p align="center"> <a href="#-install">安裝</a> · <a href="#-the-mods">所有模組</a> · <a href="docs/mods.md">文件</a> · <a href="https://claude.dev/blog/getting-started-with-claude-code-mods/">什麼是 mods?</a> </p> <table> <tr> <td align="center" width="33%"><a href="docs/mods.md#-context-bar"><img src="images/context-bar.png" alt="context-bar:Claude Code 內容視窗用量,以堆疊長條顯示,每個類別一種顏色" width="260"></a><br>📊 <b>context-bar</b><br>佔滿內容的是什麼</td> <td align="center" width="33%"><a href="docs/mods.md#-review-watch"><img src="images/review-watch.png" alt="review-watch:Claude Code 中執行中的 Codex 與子代理程式的程式碼審查的即時資訊列" width="260"></a><br>🔍 <b>review-watch</b><br>執行中的程式碼審查,即時顯示</td> <td align="center" width="33%"><a href="docs/mods.md#-md-preview"><img src="images/md-preview.png" alt="md-preview:Claude Code 編輯的 Markdown,像 GitHub 一樣渲染,並排顯示在差異旁" width="260"></a><br>📝 <b>md-preview</b><br>像 GitHub 一樣渲染的 Markdown</td> </tr> <tr> <td align="center" width="33%"><a href="docs/mods.md#-blast-radius"><img src="images/gallery/blast-radius.png" alt="blast-radius:Claude Code 掛鉤攔下 rm -rf,並列出它會刪除的檔案" width="260"></a><br>💥 <b>blast-radius</b><br>查看 <code>rm -rf</code> 會刪除什麼</td> <td align="center" width="33%"><a href="docs/mods.md#-now-playing"><img src="images/now-playing.png" alt="now-playing:Claude Code 內的 Spotify 曲目、進度條與同步歌詞" width="260"></a><br>🎵 <b>now-playing</b><br>Spotify 與歌詞,即時顯示</td> <td align="center" width="33%"><a href="docs/mods.md#-reels-and-snake"><img src="images/reels-demo.gif" alt="reels:Claude 工作時,在 Claude Code 面板中播放 YouTube Shorts" width="260"></a><br>📱 <b>reels</b><br>Claude 工作時看 Shorts</td> </tr> <tr> <td align="center" width="33%"><a href="docs/mods.md#-where-am-i"><img src="images/gallery/where-am-i.png" alt="where-am-i:工作階段目標、目前步驟,以及等待你處理的事,顯示在 Claude Code 提示列上方" width="260"></a><br>📍 <b>where-am-i</b><br>目標、目前進度、等待你的事</td> <td align="center" width="33%"><a href="docs/mods.md#-lines-above-the-prompt"><img src="images/gallery/lines.png" alt="token-weather、usage-meter 等 Claude Code 狀態列堆疊在提示列上方" width="260"></a><br>🌦️ <b>token-weather 與同類</b><br>提示列上方的資訊列</td> <td align="center" width="33%"><a href="#mission-control"><img src="images/gallery/mission-control.png" alt="mission-control:Claude Code 子代理程式、工具呼叫,以及它們即時碰觸的檔案" width="260"></a><br>🛰️ <b>mission-control</b><br>代理程式與它們碰觸的程式碼</td> </tr> </table>

🚀 安裝

先加入市集一次,然後依名稱安裝任何模組:

claude plugin marketplace add hamzafer/claude-code-mods
claude plugin install context-bar@claude-code-mods

或一次安裝通用組合:

for m in context-bar token-weather usage-meter where-am-i next-steps agent-radar review-watch replay-theater md-preview blast-radius mission-control; do
  claude plugin install "$m@claude-code-mods"
done

安裝後重新啟動 Claude Code。若想先試用而不安裝:

git clone https://github.com/hamzafer/claude-code-mods && cd claude-code-mods
claude --plugin-dir mods/context-bar

需求:Claude Code 2.1.287+。部分模組需要更多條件(Chrome、gh、某個連接器),表格中會標示。

🧩 模組

👀 查看正在發生的事

| | 模組 | 功能 | 指令 | | --- | --- | --- | --- | | 🛰️ | mission-control | 即時顯示代理程式、工具呼叫,以及它們碰觸的程式碼地圖 | /mission | | 📊 | context-bar | 以一條堆疊長條顯示內容視窗,每個類別一種顏色,附上權杖數量與壓縮位置 | /context-bar | | 🌦️ | token-weather | 內容填滿程度,從清空到即將壓縮,外加提示快取倒數 | | | ⏱️ | cache-clock | 狀態列下方的提示快取資訊列,依 Claude Code 自身的數字顯示:剩餘時間、命中率與未命中數,以及快取變冷後,你的下一則訊息會重新快取的權杖數。需要 Node 與 Claude Code 2.1.251+ | /cache-clock setup | | 📍 | where-am-i | 目標、目前正在做的事、等待你處理的事、下一步 | /where | | ➡️ | next-steps | 每輪結束後列出 2 或 3 個可能的下一句提示,按一個鍵即可草擬其中一個 | 1 2 3,0 隱藏 | | 💰 | usage-meter | 5 小時與 7 天的方案用量、重設倒數,以及此工作階段的費用 | | | 💳 | openai-balance | 你的 OpenAI API 額度:附儀表的估計餘額、今日支出、錢主要花在哪裡,以及最近一次呼叫。需要 OpenAI 組織的管理員金鑰 | /openai-balance | | 📡 | agent-radar | 每個執行中的子代理程式一行即時資訊 | /radar | | 🔍 | review-watch | 每個執行中的程式碼審查一行即時資訊(Codex 或審查子代理程式),含模型、目標、經過時間,以及 Codex 最新輸出。審查結束時,提示會列出發現的問題 | | | 🌐 | browser-lanes | 此工作階段是否有瀏覽器,以及由誰持有 | /browser | | 🕌 | prayer-times | 目前的禮拜時間與剩餘時間、下一個禮拜時間,以及 zawal。在你的電腦上計算,可選哈乃斐派或標準的 Asr | /prayers | | 🎬 | replay-theater | 逐一播放上一輪的編輯,每次一個差異 | /replay | | 📝 | md-preview | 像 GitHub 一樣渲染 Claude 編輯的 Markdown 檔案,前後版本並排顯示。需要 Chrome 與能顯示圖片的終端機 | /md |

🛡️ 保護你的儲存庫

| | 模組 | 功能 | 指令 | | --- | --- | --- | --- | | 💥 | blast-radius | 攔下 rm -r、強制推送與資料遷移,顯示它們會刪除什麼,60 秒內沒有回應就取消 | |

💸 減少花費

| | 模組 | 功能 | 指令 | | --- | --- | --- | --- | | 🔀 | switchboard | 為未指定模型的每個子代理程式選擇模型,依據其簡短標籤,使用 OpenAI 的 Decisions API 或 Jev。並顯示每個子代理程式的花費 | /route |

🔧 我的設定(可分支後自行調整)

這些是依我自己的工具與規則建立的。你可以分支後把規則改成你的。

| | 模組 | 功能 | 指令 | | --- | --- | --- | --- | | 👀 | glance | 一行顯示需要你處理的事:下一場會議、PR、Linear 議題、Slack 私訊。需要 gh,以及 Google 日曆、Linear 與 Slack 連接器 | /glance | | 🚦 | merge-gate | 在 CI 全數通過且 Codex 審查過一次之前,攔住 gh pr merge。需要 gh 與 Codex CLI。審查固定使用一個模型,可改成你的 | /gate | | 📏 | rulebook-guard | 執行我的寫作與 git 規則:改寫破折號、執行 --amend 前先詢問、未格式化的推送,以及筆記中的電子郵件與電話號碼 | | | 💾 | session-saver | 儲存你離開時的進度,恢復時顯示。需要 unpause | /park [note] |

🎮 娛樂用(選擇加入)

| | 模組 | 功能 | 指令 | | --- | --- | --- | --- | | 📱 | reels | Claude 工作時播放 YouTube Shorts,完成時暫停 | /reels | | 🐍 | snake | Claude 工作時玩貪吃蛇 | /snake | | 🎵 | now-playing | 顯示 Spotify 正在播放的內容,附進度條、正在唱的歌詞,以及 ⏮ ⏸ ⏭ 按鈕。需要 macOS 與 Spotify 應用程式 | /music |

<a id="mission-control"></a>

🛰️ 旗艦模組:mission-control

每個子代理程式、每次工具呼叫,以及它們碰觸的每個檔案,都顯示在聊天旁的面板中。以 4 倍速展示:兩個子代理程式跨四個檔案建立登出功能。

mission-control 4 倍速:兩個子代理程式與登出功能跨四個檔案落地

安裝方式與其他模組相同,重新啟動後輸入 /mission(或 /mission code 開啟程式碼地圖)。按 q 關閉。

  • 🤖 w 即時顯示代理程式與每次工具呼叫
  • 🗺️ c 顯示含匯入箭頭的程式碼地圖
  • 🔵 藍色:代理程式正在讀取檔案
  • 🟠 橘色:正在寫入
  • 🟢 綠色:完成,並附一行說明變更內容

程式碼檢視還需要 macOS、Google Chrome,以及能顯示圖片的終端機(Ghostty、kitty、iTerm2)。「Who」檢視在任何地方都能用。

📚 更多

安裝

請先查看作者 README,確認 marketplace 與外掛名稱;指令可能隨儲存庫結構而變動。

claude plugin marketplace add hamzafer/claude-code-mods
claude plugin install prayer-times
原文 / README
<p align="center"><img src="images/claude-wave.gif" alt="" width="40"></p> <h1 align="center">Claude Code mods</h1> <p align="center"><b>Make Claude Code show what it's doing.</b><br>Plugins for Claude Code, built on function hooks: live lines above the prompt, guards, panes and games. Install only the ones you want.</p> <p align="center"> <a href="LICENSE"><img src="https://img.shields.io/badge/license-MIT-blue.svg" alt="MIT"></a> <a href="https://github.com/hamzafer/claude-code-mods/actions/workflows/ci.yml"><img src="https://github.com/hamzafer/claude-code-mods/actions/workflows/ci.yml/badge.svg?branch=main" alt="CI"></a> </p> <p align="center"> <a href="#-install">Install</a> · <a href="#-the-mods">All mods</a> · <a href="docs/mods.md">Docs</a> · <a href="https://claude.dev/blog/getting-started-with-claude-code-mods/">What are mods?</a> </p> <table> <tr> <td align="center" width="33%"><a href="docs/mods.md#-context-bar"><img src="images/context-bar.png" alt="context-bar: Claude Code context window usage as a stacked bar, a color per category" width="260"></a><br>📊 <b>context-bar</b><br>what fills your context</td> <td align="center" width="33%"><a href="docs/mods.md#-review-watch"><img src="images/review-watch.png" alt="review-watch: live lines for running Codex and subagent code reviews in Claude Code" width="260"></a><br>🔍 <b>review-watch</b><br>running code reviews, live</td> <td align="center" width="33%"><a href="docs/mods.md#-md-preview"><img src="images/md-preview.png" alt="md-preview: Markdown that Claude Code edits, rendered like GitHub next to the diff" width="260"></a><br>📝 <b>md-preview</b><br>Markdown rendered like GitHub</td> </tr> <tr> <td align="center" width="33%"><a href="docs/mods.md#-blast-radius"><img src="images/gallery/blast-radius.png" alt="blast-radius: a Claude Code hook holds rm -rf and lists the files it would delete" width="260"></a><br>💥 <b>blast-radius</b><br>see what <code>rm -rf</code> would delete</td> <td align="center" width="33%"><a href="docs/mods.md#-now-playing"><img src="images/now-playing.png" alt="now-playing: Spotify track, progress bar and synced lyrics inside Claude Code" width="260"></a><br>🎵 <b>now-playing</b><br>Spotify and its lyrics, live</td> <td align="center" width="33%"><a href="docs/mods.md#-reels-and-snake"><img src="images/reels-demo.gif" alt="reels: YouTube Shorts in a Claude Code pane while it works" width="260"></a><br>📱 <b>reels</b><br>Shorts while Claude works</td> </tr> <tr> <td align="center" width="33%"><a href="docs/mods.md#-where-am-i"><img src="images/gallery/where-am-i.png" alt="where-am-i: the session goal, current step and what waits on you, above the Claude Code prompt" width="260"></a><br>📍 <b>where-am-i</b><br>goal, now, waiting on you</td> <td align="center" width="33%"><a href="docs/mods.md#-lines-above-the-prompt"><img src="images/gallery/lines.png" alt="token-weather, usage-meter and other Claude Code status lines stacked above the prompt" width="260"></a><br>🌦️ <b>token-weather and friends</b><br>lines above the prompt</td> <td align="center" width="33%"><a href="#mission-control"><img src="images/gallery/mission-control.png" alt="mission-control: Claude Code subagents, tool calls and the files they touch, live" width="260"></a><br>🛰️ <b>mission-control</b><br>agents and the code they touch</td> </tr> </table>

🚀 Install

Add the marketplace once, then install any mod by name:

claude plugin marketplace add hamzafer/claude-code-mods
claude plugin install context-bar@claude-code-mods

Or install the general-purpose set in one go:

for m in context-bar token-weather usage-meter where-am-i next-steps agent-radar review-watch replay-theater md-preview blast-radius mission-control; do
  claude plugin install "$m@claude-code-mods"
done

Restart Claude Code after installing. To try one without installing:

git clone https://github.com/hamzafer/claude-code-mods && cd claude-code-mods
claude --plugin-dir mods/context-bar

Needs Claude Code 2.1.287+. A few mods need more (Chrome, gh, a connector); the tables say which.

🧩 The mods

👀 See what's happening

| | Mod | What it does | Command | | --- | --- | --- | --- | | 🛰️ | mission-control | Live map of agents, tool calls and the code they touch | /mission | | 📊 | context-bar | Your context window as one stacked bar, a color per category, with token counts and where it compacts | /context-bar | | 🌦️ | token-weather | Context fill from Clear to Compact soon, plus a prompt-cache countdown | | | ⏱️ | cache-clock | A prompt-cache line under your status line, from Claude Code's own figures: time left, hit rate and misses, and the tokens your next message re-caches once it goes cold. Needs Node and Claude Code 2.1.251+ | /cache-clock setup | | 📍 | where-am-i | Goal, doing now, waiting on you, next step | /where | | ➡️ | next-steps | 2 or 3 likely next prompts after each turn, one key to draft one | 1 2 3, 0 hides | | 💰 | usage-meter | 5-hour and 7-day plan usage, the reset countdown and the session's cost | | | 💳 | openai-balance | Your OpenAI API credit: an estimated balance with a gauge, today's spend, where the money mostly went, and the last call. Needs an OpenAI organization Admin key | /openai-balance | | 📡 | agent-radar | One live line per running subagent | /radar | | 🔍 | review-watch | One live line per running code review (Codex or a review subagent) with the model, target, elapsed time and Codex's latest output. A toast lists the findings when it ends | | | 🌐 | browser-lanes | Whether this session has a browser, and who holds it | /browser | | 🕌 | prayer-times | The current prayer and how long is left, the next one, and zawal. Computed on your computer, Hanafi or standard Asr | /prayers | | 🎬 | replay-theater | Steps through the last turn's edits, one diff at a time | /replay | | 📝 | md-preview | Renders the Markdown files Claude edits like GitHub does, with before and after side by side. Needs Chrome and a terminal that shows images | /md |

🛡️ Guard your repo

| | Mod | What it does | Command | | --- | --- | --- | --- | | 💥 | blast-radius | Holds rm -r, force pushes and migrations, shows what they'd delete, cancels after 60 s with no answer | |

💸 Spend less

| | Mod | What it does | Command | | --- | --- | --- | --- | | 🔀 | switchboard | Picks the model for each subagent that doesn't name one, with OpenAI's Decisions API or Jev, from its short label only. Shows what every subagent cost | /route |

🔧 My setup (fork and adapt)

These are built around my own tools and rules. Fork them and change the rules to yours.

| | Mod | What it does | Command | | --- | --- | --- | --- | | 👀 | glance | One line with what needs you: next meeting, PRs, Linear issues, Slack DMs. Needs gh and the Google Calendar, Linear and Slack connectors | /glance | | 🚦 | merge-gate | Holds gh pr merge until CI is green and Codex reviewed once. Needs gh and the Codex CLI. Reviews run on one fixed model; change it to yours | /gate | | 📏 | rulebook-guard | Enforces my writing and git rules: rewrites em dashes, asks before --amend, unformatted pushes, emails and phone numbers in notes | | | 💾 | session-saver | Saves where you left off, shows it on resume. Needs unpause | /park [note] |

🎮 For fun (opt-in)

| | Mod | What it does | Command | | --- | --- | --- | --- | | 📱 | reels | YouTube Shorts while Claude works, pauses when it's done | /reels | | 🐍 | snake | Snake while Claude works | /snake | | 🎵 | now-playing | What Spotify is playing, with a progress bar, the lyric being sung, and ⏮ ⏸ ⏭ buttons. Needs macOS and the Spotify app | /music |

<a id="mission-control"></a>

🛰️ Flagship: mission-control

Every subagent, every tool call and every file they touch, in a pane next to the chat. Shown at 4x: two subagents building a logout feature across four files.

mission-control at 4x: two subagents and a logout feature landing across four files

Install it like any mod, restart, and type /mission (or /mission code to open the code map). q closes it.

  • 🤖 w shows the agents and every tool call, live
  • 🗺️ c shows the code map, with import arrows
  • 🔵 Blue while the agent reads a file
  • 🟠 Orange while it writes
  • 🟢 Green when done, with one line on what changed

The Code view also needs macOS, Google Chrome and a terminal that shows images (Ghostty, kitty, iTerm2). The Who view works everywhere.

📚 More

更多類似作品