What is clawport-ui CLAUDE.md?

A developer instruction guide for ClawPort, a Next.js dashboard for managing OpenClaw AI agents. It covers setup, local development, testing, type checking, production builds, and its command-line tool.

Use it to install and operate the ClawPort command-line tool, configure the project, start the development server, check gateway connectivity, run tests, type-check the code, and build the application.

It puts the project's commands and technical context in one place. This helps developers start the dashboard, check its configuration, verify code, and run it in production consistently.

How JohnRiceML/clawport-ui configures Claude Code

Reuse

Borrowing it

Nothing to install: this file belongs to JohnRiceML/clawport-ui. Take a copy, put it at the same path in your own repository, and replace the rules that are about this project with yours.

Copy the file

curl -O https://raw.githubusercontent.com/JohnRiceML/clawport-ui/main/CLAUDE.md

Clone the repo

git clone --depth 1 https://github.com/JohnRiceML/clawport-ui

Made for: Claude Code.

Wrote this? Show the measurements

A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.

README.md

[![agentmods](https://agentmods.dev/badge/instructions/johnriceml/clawport-ui/claude-md/github.svg)](https://agentmods.dev/instructions/johnriceml/clawport-ui/claude-md)

Your own site

<a href="https://agentmods.dev/instructions/johnriceml/clawport-ui/claude-md"><img src="https://agentmods.dev/badge/instructions/johnriceml/clawport-ui/claude-md/github.svg" alt="Measured on agentmods" height="20"></a>

Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.

Your own site · 80×15

<a href="https://agentmods.dev/instructions/johnriceml/clawport-ui/claude-md"><img src="https://agentmods.dev/badge/instructions/johnriceml/clawport-ui/claude-md.svg" alt="Reviewed on agentmods" width="80" height="20"></a>

Per session 5,632 This file is loaded in full into every session.

When invoked 5,632 The same file — it is already loaded in full.

Security scan A 1 finding. A grade says what 26 rules found in the file — not that it is safe.

Origin original No closer match found in the catalogue.

Token cost

What it costs to keep this loaded

Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.

Model	Per session	Once invoked
Fable 5.1	$0.05632	$0.05632
Opus 5.5	$0.02253	$0.02253
Sonnet 5.5	$0.01126	$0.01126
Haiku 4.5	$0.00563	$0.00563

Measured 2mo ago against content hash 8c31dce7c612, method: parsed. Prices are Anthropic first-party input rates as of 2026-10-07, from the pricing page.

Security

Grade A, and why

clawport-ui CLAUDE.md scanned grade A with 1 finding against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 2mo ago.

A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.

Runs shell commandslowCapability

Expected in a hook, worth knowing in a rule or an instructions file.

- `vi.mock('child_process')` for CLI tests (anthropic.ts)

CLAUDE.md · 417 lines

How it starts

The opening of the file, as written. The whole thing — 417 lines — stays where its author put it; the contents beside it link to each section on GitHub.

ClawPort -- Developer Guide

Quick Reference

npm run setup        # Auto-detect OpenClaw config, write .env.local
npm run dev          # Start dev server (Turbopack, port 3000)
npm test             # Run all 781 tests via Vitest (32 suites)
npx tsc --noEmit     # Type-check (expect 0 errors)
npx next build       # Production build

CLI (global install)

The npm package is clawport-ui. The CLI command is clawport. The separate clawport npm package is unrelated.

npm install -g clawport-ui
clawport setup       # Auto-detect config, write .env.local into package dir
clawport dev         # Start dev server
clawport start       # Build + start production server
clawport status      # Check gateway reachability + env config
clawport help        # Show usage

The CLI resolves its own package root via import.meta.url, so all commands work regardless of the user's current working directory. Entry point: bin/clawport.mjs.

Project Overview

ClawPort is a Next.js 16 dashboard for managing OpenClaw AI agents. It provides an org chart (Org Map), direct agent chat with multimodal support, cron monitoring, a cost dashboard, an activity console with live log streaming, and memory browsing. All AI calls route through the OpenClaw gateway -- no separate API keys needed.

Tech Stack

Next.js 16.1.6 (App Router, Turbopack)
React 19.2.3, TypeScript 5
Tailwind CSS 4 with CSS custom properties for theming
Vitest 4 with jsdom environment
OpenAI SDK (routed to Claude via OpenClaw gateway at localhost:18789)
React Flow (@xyflow/react) for org chart

Environment Variables

WORKSPACE_PATH       # Required -- path to .openclaw workspace (auto-detected)
OPENCLAW_BIN         # Required -- path to openclaw binary
OPENCLAW_GATEWAY_TOKEN  # Required -- gateway auth token
ELEVENLABS_API_KEY   # Optional -- voice indicators

Run npm run setup to auto-detect all required values from your local OpenClaw installation.

Workspace detection order: ~/.openclaw/agents/main/workspace (current layout) → ~/.openclaw/workspace (legacy). Falls back to manual prompt if neither exists.

Read the full file on GitHub · 417 lines

Changes

What this file has done since we first saw it

Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.

2mo ago First seen · 417 lines · 5,632 tokens per session scan A 8c31dce7c612

Subscribe to this mod's changes

clawport-ui CLAUDE.md is an instructions file published in the GitHub repository JohnRiceML/clawport-ui (902 stars, last pushed 7mo ago), licensed MIT. It adds 5,632 tokens to every session, about $0.0225 per session on Opus 5.5. A static security scan graded it A with 1 finding (runs shell commands). No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.

clawport-ui CLAUDE.md next to 6 instructions from other repositories
Mod	Type	Stars	Last push	Licence	Scan	Tokens	Works with
clawport-ui CLAUDE.mdJohnRiceML/clawport-ui	Instructions file	902	7mo ago	MIT	A	5,632	Claude Code
vscode buildNext.instructions.mdmicrosoft/vscode	Instructions file	195k	yesterday	MIT	A	9,719	GitHub Copilot
next.js AGENTS.mdvercel/next.js	Instructions file	143k	today	MIT	A	7,461	Codex, OpenCode
langchain AGENTS.mdlangchain-ai/langchain	Instructions file	149k	yesterday	MIT	A	4,680	Codex, OpenCode
vscode oss-third-party-notices.instructions.mdmicrosoft/vscode	Instructions file	195k	yesterday	MIT	A	5,516	GitHub Copilot
vscode copilot-instructions.mdmicrosoft/vscode	Instructions file	195k	yesterday	MIT	A	3,093	GitHub Copilot
deepseek-harness AGENTS.mddeepseek-ai/deepseek-harness	Instructions file	274k	2d ago	MIT	A	4,313	Codex, OpenCode

clawport-ui: Instructions file for Claude Code