Use when syncing a project's help hub implementation with the latest help-hub skill standards. Audits the help page for incorrect card spacing, missing deep links to settings panels, and outdated Connections Guide links. Run after updating the help-hub skill or when a project's help page was built before the latest standards were in place.
Audits and updates a project's help hub page to ensure it meets the latest design and linking standards.
/plugin marketplace add https://www.claudepluginhub.com/api/plugins/aventerica89-claude-codex/marketplace.json/plugin install aventerica89-claude-codex@cpd-aventerica89-claude-codexThis skill inherits all available tools. When active, it can use any tool Claude has access to.
Audits and updates the current project's help hub implementation to match the latest standards from the help-hub skill.
space-y-3 (not space-y-4, space-y-6, or gap-*)href="/settings/..." links/settings/about redirects to /helpfind src -name "*.tsx" | xargs grep -l "Getting Started\|GettingStarted\|gettingStarted" 2>/dev/null
Read the file. For SPA apps (Cloudflare Workers), search for the help tab render function in the main worker file.
In the GettingStartedTab function, find the container div/element:
space-y-3space-y-4, space-y-6, space-y-8, gap-4, gap-6, gap-8Fix: Replace with space-y-3 mt-6
Scan the gettingStarted data array and each <Link href=...>. Flag any step whose detail text mentions "Settings", "API key", or specific settings pages but whose href points to a generic location (/, #, empty, or a non-settings path).
Expected patterns:
| Step mentions | Expected href |
|---|---|
| API keys | /settings/api-keys or /admin#settings/api-keys |
| Git Sync / preview links | /settings/git-sync or /admin#settings/git-sync |
| Basecamp | /settings/basecamp |
| Profile | /settings/profile |
| Notifications | /settings/notifications |
Find the Connections Guide tab content. Look for:
/help?tab=getting-started or equivalentFlag any card that describes an API key or integration setup step without an actionable link.
cat src/app/\(dashboard\)/settings/about/page.tsx 2>/dev/null
Should contain: redirect("/help")
If the file doesn't exist or doesn't redirect, note it.
For each issue found:
gettingStarted data object's href field, or the card content<Link href="..."> to the relevant cardsrc/app/(dashboard)/settings/about/page.tsx with redirectHelp Hub Sync complete.
Fixed:
- [x] Card spacing: space-y-6 → space-y-3
- [x] Step 5 href: "/settings" → "/settings/api-keys"
- [x] Connections Guide: added API keys link to REST API card
No action needed:
- [x] Redirect: /settings/about → /help already present
- [x] Connections Guide CI/CD card: link already correct
Skipped (not applicable):
- Git Sync section: no git-sync settings in this app
Correct Getting Started card pattern (from help-hub skill):
<div className="space-y-3 mt-6">
{gettingStarted.map((item) => (
<Link key={item.step} href={item.href}>
<div className="flex gap-4 p-4 rounded-lg border hover:border-primary/50 hover:bg-muted/30 transition-colors cursor-pointer group">
<div className="flex h-7 w-7 shrink-0 items-center justify-center rounded-full bg-primary text-primary-foreground text-sm font-bold">
{item.step}
</div>
<div className="flex-1 min-w-0">
<div className="flex items-center gap-2 mb-0.5">
<p className="font-medium">{item.title}</p>
{item.step <= 3 && (
<Badge variant="secondary" className="text-xs">Recommended</Badge>
)}
</div>
<p className="text-sm text-muted-foreground">{item.detail}</p>
</div>
<ArrowRight className="h-4 w-4 text-muted-foreground shrink-0 self-center opacity-0 group-hover:opacity-100 transition-opacity" />
</div>
</Link>
))}
</div>
src/app/(dashboard)/help/page.tsx, commit 3f23368) — Next.js, 6 steps, all with deep linkssrc/index.js, commit 4863d06) — CF Workers SPA, hash routingActivates when the user asks about AI prompts, needs prompt templates, wants to search for prompts, or mentions prompts.chat. Use for discovering, retrieving, and improving prompts.
Search, retrieve, and install Agent Skills from the prompts.chat registry using MCP tools. Use when the user asks to find skills, browse skill catalogs, install a skill for Claude, or extend Claude's capabilities with reusable AI agent components.
Creating algorithmic art using p5.js with seeded randomness and interactive parameter exploration. Use this when users request creating art using code, generative art, algorithmic art, flow fields, or particle systems. Create original algorithmic art rather than copying existing artists' work to avoid copyright violations.