feat: add supported platforms section to landing page

gcmsg · claude · gcmsg · commit b0f821c8c1db · 2026-03-15T02:19:12.000+08:00
Show 4 platform plugin cards (OpenClaw, IronClaw, PicoClaw, NanoBot)
with tech badges on the landing page. Fully localized across all 8
languages.

Co-Authored-By: Claude Opus 4.6 &lt;noreply@anthropic.com&gt;
diff --git a/web/app/src/i18n/locales/ar.json b/web/app/src/i18n/locales/ar.json
@@ -117,7 +117,13 @@
     "ewmaTitle": "سمعة EWMA",
     "ewmaDesc": "درجات الثقة محسوبة من تفاعلات حقيقية باستخدام المتوسط المتحرك المرجح أسياً. السلوك الأخير يحمل وزناً أكبر، مما يكافئ الوكلاء الموثوقين باستمرار.",
     "endpointTitle": "التحقق من نقطة النهاية",
-    "endpointDesc": "يثبت التحقق بالتحدي والاستجابة أن الوكلاء يتحكمون في نقاط النهاية الخاصة بهم. يمكن للوكلاء الموثّقين ربط بروتوكولات A2A وMCP وACP عبر تنسيق Envelope العالمي."
+    "endpointDesc": "يثبت التحقق بالتحدي والاستجابة أن الوكلاء يتحكمون في نقاط النهاية الخاصة بهم. يمكن للوكلاء الموثّقين ربط بروتوكولات A2A وMCP وACP عبر تنسيق Envelope العالمي.",
+    "platformsTitle": "منصات وكلاء الذكاء الاصطناعي المدعومة",
+    "platformsDesc": "يتكامل PeerClaw مع منصات وكلاء الذكاء الاصطناعي الرئيسية عبر الإضافات الرسمية. ابنِ وكيلك مرة واحدة، شغّله في أي مكان.",
+    "platformOpenClaw": "محوّل فوري قائم على WebSocket لوكلاء OpenClaw",
+    "platformIronClaw": "محوّل HTTP/SSE عالي الأداء مُجمَّع إلى WebAssembly",
+    "platformPicoClaw": "محوّل Go أصلي مع تكامل مباشر مع SDK",
+    "platformNanoBot": "محوّل Python لإطار عمل وكلاء NanoBot"
   },
   "directory": {
     "title": "دليل الوكلاء",
diff --git a/web/app/src/i18n/locales/en.json b/web/app/src/i18n/locales/en.json
@@ -117,7 +117,13 @@
     "ewmaTitle": "EWMA Reputation",
     "ewmaDesc": "Trust scores computed from real interactions using Exponentially Weighted Moving Average. Recent behavior matters more, rewarding consistently reliable agents.",
     "endpointTitle": "Endpoint Verification",
-    "endpointDesc": "Challenge-response verification proves agents control their endpoints. Verified agents can bridge A2A, MCP, and ACP protocols via the universal Envelope format."
+    "endpointDesc": "Challenge-response verification proves agents control their endpoints. Verified agents can bridge A2A, MCP, and ACP protocols via the universal Envelope format.",
+    "platformsTitle": "Supported AI Agent Platforms",
+    "platformsDesc": "PeerClaw integrates with major AI agent platforms through official plugins. Build your agent once, run it anywhere.",
+    "platformOpenClaw": "WebSocket-based real-time adapter for OpenClaw agents",
+    "platformIronClaw": "High-performance HTTP/SSE adapter compiled to WebAssembly",
+    "platformPicoClaw": "Native Go adapter with direct SDK integration",
+    "platformNanoBot": "Python adapter for NanoBot agent framework"
   },
   "directory": {
     "title": "Agent Directory",
diff --git a/web/app/src/i18n/locales/es.json b/web/app/src/i18n/locales/es.json
@@ -117,7 +117,13 @@
     "ewmaTitle": "Reputación EWMA",
     "ewmaDesc": "Puntuaciones de confianza calculadas a partir de interacciones reales usando media móvil ponderada exponencialmente. El comportamiento reciente pesa más, recompensando agentes consistentemente confiables.",
     "endpointTitle": "Verificación de endpoint",
-    "endpointDesc": "La verificación por desafío-respuesta demuestra que los agentes controlan sus endpoints. Los agentes verificados pueden conectar los protocolos A2A, MCP y ACP mediante el formato universal Envelope."
+    "endpointDesc": "La verificación por desafío-respuesta demuestra que los agentes controlan sus endpoints. Los agentes verificados pueden conectar los protocolos A2A, MCP y ACP mediante el formato universal Envelope.",
+    "platformsTitle": "Plataformas de AI Agent compatibles",
+    "platformsDesc": "PeerClaw se integra con las principales plataformas de agentes de IA a través de plugins oficiales. Construye tu agente una vez, ejecútalo en cualquier lugar.",
+    "platformOpenClaw": "Adaptador en tiempo real basado en WebSocket para agentes OpenClaw",
+    "platformIronClaw": "Adaptador HTTP/SSE de alto rendimiento compilado a WebAssembly",
+    "platformPicoClaw": "Adaptador nativo de Go con integración directa del SDK",
+    "platformNanoBot": "Adaptador Python para el framework de agentes NanoBot"
   },
   "directory": {
     "title": "Directorio de agentes",
diff --git a/web/app/src/i18n/locales/fr.json b/web/app/src/i18n/locales/fr.json
@@ -117,7 +117,13 @@
     "ewmaTitle": "Réputation EWMA",
     "ewmaDesc": "Scores de confiance calculés à partir d'interactions réelles en utilisant la moyenne mobile pondérée exponentiellement. Le comportement récent compte davantage, récompensant les agents fiables de manière constante.",
     "endpointTitle": "Vérification des points de terminaison",
-    "endpointDesc": "La vérification par défi-réponse prouve que les agents contrôlent leurs points de terminaison. Les agents vérifiés peuvent relier les protocoles A2A, MCP et ACP via le format universel Envelope."
+    "endpointDesc": "La vérification par défi-réponse prouve que les agents contrôlent leurs points de terminaison. Les agents vérifiés peuvent relier les protocoles A2A, MCP et ACP via le format universel Envelope.",
+    "platformsTitle": "Plateformes d'agents IA prises en charge",
+    "platformsDesc": "PeerClaw s'intègre aux principales plateformes d'agents IA grâce à des plugins officiels. Construisez votre agent une fois, exécutez-le partout.",
+    "platformOpenClaw": "Adaptateur temps réel basé sur WebSocket pour les agents OpenClaw",
+    "platformIronClaw": "Adaptateur HTTP/SSE haute performance compilé en WebAssembly",
+    "platformPicoClaw": "Adaptateur Go natif avec intégration directe du SDK",
+    "platformNanoBot": "Adaptateur Python pour le framework d'agents NanoBot"
   },
   "directory": {
     "title": "Annuaire des agents",
diff --git a/web/app/src/i18n/locales/ja.json b/web/app/src/i18n/locales/ja.json
@@ -117,7 +117,13 @@
     "ewmaTitle": "EWMA レピュテーション",
     "ewmaDesc": "指数加重移動平均を使用した実際のインタラクションから信頼スコアを算出。直近の行動がより重視され、一貫して信頼性の高い Agent が評価されます。",
     "endpointTitle": "エンドポイント検証",
-    "endpointDesc": "チャレンジ・レスポンス検証により Agent がエンドポイントを管理していることを証明。検証済み Agent は Envelope フォーマットを通じて A2A、MCP、ACP プロトコルをブリッジできます。"
+    "endpointDesc": "チャレンジ・レスポンス検証により Agent がエンドポイントを管理していることを証明。検証済み Agent は Envelope フォーマットを通じて A2A、MCP、ACP プロトコルをブリッジできます。",
+    "platformsTitle": "対応 AI エージェントプラットフォーム",
+    "platformsDesc": "PeerClaw は公式プラグインを通じて主要な AI エージェントプラットフォームと統合。一度構築すれば、どこでも実行可能。",
+    "platformOpenClaw": "OpenClaw エージェント向け WebSocket ベースのリアルタイムアダプター",
+    "platformIronClaw": "WebAssembly にコンパイルされた高性能 HTTP/SSE アダプター",
+    "platformPicoClaw": "SDK 直接統合のネイティブ Go アダプター",
+    "platformNanoBot": "NanoBot エージェントフレームワーク向け Python アダプター"
   },
   "directory": {
     "title": "Agent ディレクトリ",
diff --git a/web/app/src/i18n/locales/pt.json b/web/app/src/i18n/locales/pt.json
@@ -117,7 +117,13 @@
     "ewmaTitle": "Reputação EWMA",
     "ewmaDesc": "Pontuações de confiança calculadas a partir de interações reais usando Média Móvel Exponencialmente Ponderada. O comportamento recente tem mais peso, recompensando agentes consistentemente confiáveis.",
     "endpointTitle": "Verificação de Endpoint",
-    "endpointDesc": "A verificação por desafio-resposta comprova que os agentes controlam seus endpoints. Agentes verificados podem conectar os protocolos A2A, MCP e ACP através do formato universal Envelope."
+    "endpointDesc": "A verificação por desafio-resposta comprova que os agentes controlam seus endpoints. Agentes verificados podem conectar os protocolos A2A, MCP e ACP através do formato universal Envelope.",
+    "platformsTitle": "Plataformas de agentes de IA suportadas",
+    "platformsDesc": "O PeerClaw integra-se com as principais plataformas de agentes de IA através de plugins oficiais. Construa seu agente uma vez, execute-o em qualquer lugar.",
+    "platformOpenClaw": "Adaptador em tempo real baseado em WebSocket para agentes OpenClaw",
+    "platformIronClaw": "Adaptador HTTP/SSE de alto desempenho compilado para WebAssembly",
+    "platformPicoClaw": "Adaptador Go nativo com integração direta do SDK",
+    "platformNanoBot": "Adaptador Python para o framework de agentes NanoBot"
   },
   "directory": {
     "title": "Diretório de Agentes",
diff --git a/web/app/src/i18n/locales/ru.json b/web/app/src/i18n/locales/ru.json
@@ -117,7 +117,13 @@
     "ewmaTitle": "Репутация EWMA",
     "ewmaDesc": "Оценки доверия вычисляются на основе реальных взаимодействий с использованием экспоненциально взвешенного скользящего среднего. Недавнее поведение имеет больший вес, вознаграждая стабильно надёжных агентов.",
     "endpointTitle": "Верификация конечных точек",
-    "endpointDesc": "Верификация «запрос-ответ» подтверждает, что агенты контролируют свои конечные точки. Верифицированные агенты могут связывать протоколы A2A, MCP и ACP через универсальный формат Envelope."
+    "endpointDesc": "Верификация «запрос-ответ» подтверждает, что агенты контролируют свои конечные точки. Верифицированные агенты могут связывать протоколы A2A, MCP и ACP через универсальный формат Envelope.",
+    "platformsTitle": "Поддерживаемые платформы ИИ-агентов",
+    "platformsDesc": "PeerClaw интегрируется с основными платформами ИИ-агентов через официальные плагины. Создайте агента один раз — запускайте где угодно.",
+    "platformOpenClaw": "Адаптер реального времени на базе WebSocket для агентов OpenClaw",
+    "platformIronClaw": "Высокопроизводительный HTTP/SSE-адаптер, скомпилированный в WebAssembly",
+    "platformPicoClaw": "Нативный Go-адаптер с прямой интеграцией SDK",
+    "platformNanoBot": "Python-адаптер для фреймворка агентов NanoBot"
   },
   "directory": {
     "title": "Каталог агентов",
diff --git a/web/app/src/i18n/locales/zh.json b/web/app/src/i18n/locales/zh.json
@@ -117,7 +117,13 @@
     "ewmaTitle": "EWMA 信誉",
     "ewmaDesc": "使用指数加权移动平均算法从真实交互中计算信任评分。近期行为权重更高，奖励持续可靠的 Agent。",
     "endpointTitle": "端点验证",
-    "endpointDesc": "挑战-响应验证证明 Agent 确实控制其端点。已验证的 Agent 可通过通用 Envelope 格式桥接 A2A、MCP 和 ACP 协议。"
+    "endpointDesc": "挑战-响应验证证明 Agent 确实控制其端点。已验证的 Agent 可通过通用 Envelope 格式桥接 A2A、MCP 和 ACP 协议。",
+    "platformsTitle": "已支持的 AI Agent 平台",
+    "platformsDesc": "PeerClaw 通过官方插件集成主流 AI Agent 平台。一次构建，随处运行。",
+    "platformOpenClaw": "基于 WebSocket 的 OpenClaw Agent 实时适配器",
+    "platformIronClaw": "编译为 WebAssembly 的高性能 HTTP/SSE 适配器",
+    "platformPicoClaw": "原生 Go 适配器，直接集成 SDK",
+    "platformNanoBot": "面向 NanoBot Agent 框架的 Python 适配器"
   },
   "directory": {
     "title": "Agent 目录",
diff --git a/web/app/src/pages/LandingPage.tsx b/web/app/src/pages/LandingPage.tsx
@@ -2,7 +2,7 @@ import { useEffect, useState } from "react"
 import { Link, useNavigate } from "react-router-dom"
 import { useTranslation } from "react-i18next"
 import { fetchDirectory } from "@/api/client"
-import { Search, Shield, Activity, CheckCircle, ArrowRight, Fingerprint, BarChart3, Globe } from "lucide-react"
+import { Search, Shield, Activity, CheckCircle, ArrowRight, Fingerprint, BarChart3, Globe, Blocks } from "lucide-react"
 
 export function LandingPage() {
   const navigate = useNavigate()
@@ -153,6 +153,41 @@ export function LandingPage() {
           />
         </div>
       </section>
+
+      {/* ─── Supported Platforms ─── */}
+      <section className="relative mx-auto max-w-6xl px-4 pb-24">
+        <div className="flex flex-col items-center text-center mb-10">
+          <div className="flex size-10 items-center justify-center rounded-lg bg-primary/8 mb-4">
+            <Blocks className="size-5 text-primary/80" />
+          </div>
+          <h2 className="text-2xl font-bold tracking-tight">{t('landing.platformsTitle')}</h2>
+          <p className="mt-2 text-sm text-muted-foreground max-w-lg">{t('landing.platformsDesc')}</p>
+        </div>
+        <div className="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4">
+          {([
+            { name: "OpenClaw", tech: "TypeScript", descKey: "landing.platformOpenClaw", color: "192" },
+            { name: "IronClaw", tech: "Rust / WASM", descKey: "landing.platformIronClaw", color: "25" },
+            { name: "PicoClaw", tech: "Go", descKey: "landing.platformPicoClaw", color: "160" },
+            { name: "NanoBot", tech: "Python", descKey: "landing.platformNanoBot", color: "285" },
+          ] as const).map((p) => (
+            <div
+              key={p.name}
+              className="group rounded-xl border border-border/60 bg-card p-5 transition-all duration-300 hover:border-primary/20 hover:shadow-[0_0_30px_oklch(0.72_0.15_192_/_0.04)]"
+            >
+              <div className="flex items-center justify-between mb-3">
+                <h3 className="font-semibold text-sm">{p.name}</h3>
+                <span
+                  className="rounded-md px-2 py-0.5 text-[10px] font-medium"
+                  style={{ background: `oklch(0.72 0.15 ${p.color} / 0.1)`, color: `oklch(0.72 0.15 ${p.color})` }}
+                >
+                  {p.tech}
+                </span>
+              </div>
+              <p className="text-xs text-muted-foreground leading-relaxed">{t(p.descKey)}</p>
+            </div>
+          ))}
+        </div>
+      </section>
     </div>
   )
 }
