Mmcp.market

wiki-viewer skill

by rohitg00·rohitg00/pro-workflow·2.9k stars

Render a self-contained HTML viewer for a pro-workflow wiki. Pages, sources, claims, seed queue, page-link graph and full-text search all in one file. No external dependencies, no JS framework, S3-uploadable. Use when the user wants to browse a wiki visually, share its current state with someone, audit research progress, or hand off a knowledge base. Inspired by Thariq Shihipar's "Unreasonable Effectiveness of HTML" — favors information density and shareability over markdown-only outputs.

A100/100content scan

Is the wiki-viewer skill safe?

Clean: nothing in its files matched our rules. We read 2 files in the folder on 2026-09-28.

No findings.

Install the wiki-viewer skill

A skill is a folder. Copy it into your agent's skills folder and the agent loads it when the task matches its description. 

git clone --depth 1 https://github.com/rohitg00/pro-workflow.git /tmp/pro-workflow
mkdir -p ~/.claude/skills
cp -r /tmp/pro-workflow/skills/wiki-viewer ~/.claude/skills/wiki-viewer
available in every project

In the Claude apps, zip the folder and upload it from the Skills settings. The folder on GitHub

The instructions your agent would load

SKILL.md as published, without the frontmatter. Read it on GitHub

Wiki Viewer

Single-file HTML view of a pro-workflow wiki. Reads ~/.pro-workflow/data.db, dumps the wiki into one self-contained HTML document with in-browser search, link graph and a seed-queue panel.

Why HTML, not markdown

  • Information density — pages, sources, claims, seeds, link graph in one viewport
  • Visual clarity — long wikis are unreadable as raw markdown; HTML scales
  • Shareability — upload to S3, send the URL; recipient does not need pro-workflow installed
  • Two-way interaction — "copy as seed" buttons turn open questions into seed queue prompts you can paste back into Claude Code
  • Auditable — quick visual proof that the auto-research loop produced something useful

When to use

  • After a /wiki research run, to see what it built
  • Before sharing a wiki with a teammate or with leadership
  • Code review: render a codebase-flavored wiki for an unfamiliar module
  • Incident review: render an incident wiki for a post-mortem readout
  • Periodic audits: stale-claim detection, orphan-page review

Commands

node $SKILL_ROOT/scripts/render.js <slug> [--out <path>] [--theme dark|light]

Defaults:

  • output: /derived/viewer.html
  • theme: dark

What ships in the file

Self-contained

No CDN, no external fonts, no . Inline CSS, inline SVG, inline JS only. Result is a single .html file that opens locally or from any static host.

Compose with the rest

# Generate after auto-research run completes
/wiki research agent-memory --max-pages 5
node skills/wiki-viewer/scripts/render.js agent-memory
open ~/.pro-workflow/wikis/agent-memory/derived/viewer.html

# Hand off to a teammate
aws s3 cp ~/.pro-workflow/wikis/agent-memory/derived/viewer.html s3://my-bucket/agent-memory.html --acl public-read

Design principles

  1. Type-first — every panel reads as text; visualizations are auxiliary, not load-bearing.
  2. Zero decoration — no gradients, no glow, no atmospheric backgrounds.
  3. Color is meaning — Anthropic coral marks the active page and CTAs only.
  4. Print-friendly — @media print collapses sidebars so the markdown content prints clean.

Limits (initial release)

  • Markdown rendering is a small in-file parser (headings, lists, code blocks, links, blockquotes, tables, footnote citations). No HTML-in-markdown.
  • Link graph is precomputed and serialized as SVG; no live re-layout.
  • Search is substring + tokenized AND match. BM25 stays in SQLite; the viewer is a snapshot.
  • Re-render after each batch of changes. The file is not live.

Future hooks (not in initial release)

  • --include-council to bundle every linked council transcript inline
  • --include-survey to bundle generated surveys
  • "Copy as council prompt" buttons next to claims tagged contested
  • Diff view: --against to highlight new claims since a prior render

More skills from rohitg00/pro-workflow

  • Aagent-teamsCoordinate multiple Claude Code sessions as a team — lead + teammates with shared task lists, mailbox messaging, and file-lock claiming. Patterns for team sizing, task decomposition, and when to use teams vs sub-agents vs worktrees.
  • Aauto-setupAuto-configure quality gates, hooks, and settings for a new project. Detects project type and sets up appropriate tooling. Use when onboarding a new codebase.
  • Abatch-orchestrationDecompose large-scale changes into independent units and spawn parallel agents in isolated worktrees. Use for migrations, refactors, codemods, and any change touching 10+ files with the same pattern.
  • Cbug-captureCapture a user-reported defect as a durable GitHub issue written in the project's own domain language. Explores the codebase in parallel for context but never leaks file paths or line numbers into the issue. Use when the user reports a bug conversationally, runs a QA pass, or says "file an issue", "log this as a bug", "capture this".
  • Acompact-guardSmart context compaction with state preservation. Saves critical files, task progress, and working state before compaction, restores after. Use before manual compact or when auto-compact triggers.
  • Acontext-engineeringMaster the four operations of context engineering — Write, Select, Compress, Isolate. Manage token budgets, compaction strategies, and context partitioning to keep AI sessions sharp and efficient.
  • Acontext-optimizerOptimize token usage and context management. Use when sessions feel slow, context is degraded, or you're running out of budget.
  • Acost-trackerTrack session costs, set budget alerts, and optimize token spend. Use to check costs mid-session or set spending limits.
  • Adesign-engineeringApply interface craft when building or reviewing UI - motion, easing, timing, springs, component feel, and visual foundations. Use when building a component, animation, transition, hover or press state, modal, drawer, toast, or when polishing an interface so it feels right. Says "make this feel better", "add an animation", "polish the UI", "review this component".
  • AdeslopRemove AI-generated code slop, unnecessary comments, and over-engineering from the current branch diff. Cleans up boilerplate, simplifies abstractions, strips defensive code, and in skill-file mode lints SKILL.md files for quality. Use when cleaning up code, simplifying, removing boilerplate, before committing, or when reviewing a skill before promoting it.
  • Adomain-modelingBuild the project's shared language and bounded contexts before writing code, so names stay consistent and the agent stops paraphrasing domain concepts. Produces a CONTEXT.md glossary and decision records. Use at the start of a project or feature, or when the codebase and the people describing it speak different languages.
  • Afile-watcherConfigure file watching hooks to auto-react to config changes, env file updates, and dependency modifications. Use to set up reactive workflows.

All agent skills → · MCP servers