crabwise-ai/crabwalk

🦀 Crabwalk 🦀 Real-time companion monitor for OpenClaw agents.

🦀 Crabwalk – OpenClaw エージェントのリアルタイムモニタ

何か – 軽量な Web UI で、OpenClaw(Clawdbot)AI エージェントが WhatsApp、Telegram、Discord、Slack 上で会話する様子を可視化します。各セッションのライブノードグラフ、エージェントが呼び出すツール、システムを流れるペイロードを表示します。

主な機能

  • ライブアクティビティグラフ – ReactFlow がエージェントセッションとアクションチェーンをリアルタイムに描画。
  • マルチプラットフォームビュー – すべての対応メッセージングプラットフォームを単一ダッシュボードで監視。
  • WebSocket ストリーミング – OpenClaw ゲートウェイ(デフォルト ws://127.0.0.1:18789)に接続し、イベントをリアルタイムで受信。
  • アクショントレース – ノードをクリックしてツール引数とレスポンスペイロードを展開・検査。
  • セッションフィルタ – プラットフォームで絞り込むか、受信者 ID で検索。
  • QR コードショートカット – 起動時に QR コードが出力され、スキャンするとスマホでモニタを開く。

入手方法

  1. OpenClaw 経由 – 提供された skill URL を OpenClaw エージェントに貼り付けると、Crabwalk が自動的にインストールまたは更新されます。
  2. CLI インストーラ – 最新リリースの tarball をダウンロードし、~/.crabwalk に展開、バイナリを ~/.local/bin にコピー。
  3. Docker – イメージ ghcr.io/luccast/crabwalk:latest をプルし、推奨フラグで実行(ポート 3000 を公開、ゲートウェイトークンを渡す、OpenClaw ワークスペースをマウント)。ゲートウェイがループバックのみバインドされている場合は host ネットワークが必要になることがあります。
  4. ソースからgit clonenpm install、その後 npm run dev(Node.js が必要)。

サーバーの起動

crabwalk                 # 0.0.0.0:3000 で起動
crabwalk -p 8080        # ポートをカスタマイズ
crabwalk -t mytoken     # ゲートウェイトークンを明示指定(省略時は ~/.openclaw/openclaw.json から自動取得)
crabwalk start --daemon # バックグラウンドサービスとして実行

典型的なワークフロー: サーバーを起動し、http://localhost:3000/monitor を開く(または QR コードをスキャン)と、エージェントの会話が即座に表示されます。

技術スタック – TanStack Start(フルスタック React)で構築、ReactFlow でグラフ描画、Framer Motion で UI アニメーション、tRPC で型安全な API 呼び出し、TanStack DB でローカルデータ管理。

対象者 – OpenClaw ボットを運用し、複数のチャットプラットフォーム上でエージェントの動作をリアルタイムに可視化したい開発者や運用者向けのデバッグ/可観測ツールです。