admin-ui-debug

от vercel

Отладка интерфейса администратора и оператора для vercel-openclaw: разработка командной оболочки, действия администратора, ядро запросов, панели состояния, интерфейс проверки запуска, канал…

npx skills add https://github.com/vercel-labs/vercel-openclaw --skill admin-ui-debug

Admin UI Debug

Use this skill when the root admin control surface or operator-facing UI behavior is the focus.

Evidence First

Collect:

  • Screenshot or browser reproduction path.
  • API payloads the UI consumes: /api/status, /api/channels/summary, launch verify, preflight, logs.
  • Browser console errors.
  • Whether LOCAL_READ_ONLY=1 is set.
  • Mobile and desktop viewport checks for layout changes.

Design Constraints

This is an operator control surface, not a marketing dashboard. Keep it dense, dark-only, Vercel-native, and restrained. Avoid decorative cards, ornamental color, and copy that explains obvious controls.

Use existing components and patterns before adding abstractions. Keep text small enough for compact panels and ensure button/card text cannot overflow.

Fix Boundaries

  • UI: src/components/designs/command-shell.tsx.
  • Action/request helpers: src/components/admin-{action,request}-core.ts.
  • API shape changes: affected route/shared type only.
  • Design reference: .impeccable.md.

Verification

Run focused tests/typecheck and, for visual changes, use browser verification or screenshots:

node scripts/verify.mjs --steps=test,typecheck
lat check

When a dev server is needed, start it and report the URL.

Больше skills от vercel

benchmark-sandbox
vercel
Запускает сценарии оценки vercel-plugin в песочницах Vercel вместо локальных панелей WezTerm. Предоставляет эфемерные микроВМ с предустановленными Claude Code и плагином,…
official
emil-design-eng
vercel
Этот навык кодирует философию Эмиля Ковальски в отношении полировки интерфейса, дизайна компонентов, анимационных решений и незаметных деталей, которые делают программное обеспечение приятным в использовании.
official
vercel-react-best-practices
vercel
Рекомендации по оптимизации производительности React и Next.js от инженеров Vercel. Этот навык следует использовать при написании, ревью или рефакторинге React/Next.js…
official
vercel-react-best-practices
vercel
Рекомендации по оптимизации производительности React и Next.js от инженеров Vercel. Этот навык следует использовать при написании, рецензировании или рефакторинге React/Next.js…
official
write-guide
vercel
Создайте техническое руководство, которое обучает реальному примеру использования через последовательные примеры. Концепции вводятся только тогда, когда они нужны читателю.
official
release
vercel
Vercel-plugin — запуск шлюзов, обновление версии, генерация артефактов, коммит и пуш. Используйте, когда вас просят «выпустить релиз», «запустить», «обновить версию и запушить» или «сделать релиз».
official
deepsec
vercel
Запустить DeepSec для проверки проекта Vercel из dev3000. Используется для одношаговой настройки DeepSec, начальной загрузки контекста проекта, ограниченной первичной обработки и…
official
backport-pr
vercel
Выполнить бэкпорт объединённого pull request Next.js из canary в предыдущую ветку релиза, например next-16-2. Используйте, когда пользователь просит выполнить бэкпорт, cherry-pick или открыть…
official