building-admin-dashboard-customizations — скилл для Claude Code
Скилл обучает агента настраивать интерфейс панели Medusa: собирать виджеты, кастомные страницы и таблицы. Пригодится при расширении админки магазина.
npx skills add medusajs/medusa-agent-skills --skill building-admin-dashboard-customizations -a claude-codeЧто делает building-admin-dashboard-customizations
Этот скилл задаёт правила создания UI-расширений для панели Medusa Admin. Он описывает работу с компонентами библиотеки @medusajs/ui, структуру интерфейсных маршрутов и правильное связывание форм с сервером. Агент узнаёт, что стандартный fetch() здесь применять нельзя: любые сетевые запросы обязаны идти через Medusa JS SDK, иначе отвалятся сессионные заголовки авторизации.
Перед написанием кода скилл требует открыть файлы справок из каталога references/ под конкретный тип задачи. Если проект собран на pnpm, разработчику придётся вручную поставить пакеты @tanstack/react-query и react-router-dom тех же версий, что использует дашборд. Цены в Medusa сохраняются десятичными числами, а не в центах: делить их на 100 нельзя, иначе витрина отобразит искажённые суммы. Это повод заранее перепроверить старые виджеты перед обновлением интерфейса.
Какие задачи решает
- Добавить кастомный виджет на страницу заказа или товара
- Настроить запросы через Medusa JS SDK без потери сессии
- Собрать модальное окно FocusModal для создания сущностей
- Отобразить таблицы данных с поиском и постраничной навигацией
Примеры запросов агенту
- Создай виджет с дополнительными полями для страницы товара в админке Medusa
- Сделай кастомную страницу со списком заказов и таблицей DataTable
- Добавь Drawer-модалку для редактирования параметров клиента через Medusa SDK
Как установить building-admin-dashboard-customizations
1Через Skills CLI (Vercel)
npx skills add medusajs/medusa-agent-skills --skill building-admin-dashboard-customizations -a claude-code2Вручную: положить файлы
~/.claude/skills/building-admin-dashboard-customizations/SKILL.mdПапка скилла целиком; для одного проекта — .claude/skills/building-admin-dashboard-customizations/
1Через Skills CLI (Vercel)
npx skills add medusajs/medusa-agent-skills --skill building-admin-dashboard-customizations -a codex2Вручную: положить файлы
.agents/skills/building-admin-dashboard-customizations/SKILL.mdДля всех проектов — ~/.agents/skills/
1Через Skills CLI (Vercel)
npx skills add medusajs/medusa-agent-skills --skill building-admin-dashboard-customizations -a cursor2Вручную: положить файлы
.cursor/skills/building-admin-dashboard-customizations/SKILL.mdCursor читает и .agents/skills/, и .claude/skills/
1GitHub CLI
gh skill install medusajs/medusa-agent-skills building-admin-dashboard-customizations2Вручную: положить файлы
.github/skills/building-admin-dashboard-customizations/SKILL.md1Через Skills CLI (Vercel)
npx skills add medusajs/medusa-agent-skills --skill building-admin-dashboard-customizations -a gemini-cli2Командой платформы
gemini skills install https://github.com/medusajs/medusa-agent-skills --path plugins/medusa-dev/skills/building-admin-dashboard-customizationsВручную: положить файлы
.devin/skills/building-admin-dashboard-customizations/SKILL.mdСтарый путь .windsurf/skills/ тоже читается
Через Skills CLI (Vercel)
npx skills add medusajs/medusa-agent-skills --skill building-admin-dashboard-customizations -a opencodeClaude.ai
Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills
По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов
Вопросы о building-admin-dashboard-customizations
Как установить building-admin-dashboard-customizations в Claude Code?
Выполните команду npx skills add medusajs/medusa-agent-skills --skill building-admin-dashboard-customizations -a claude-code.
Что делает скилл building-admin-dashboard-customizations?
Он передаёт агенту стандарты разработки интерфейсов админки Medusa: правила вёрстки на @medusajs/ui, разделение запросов данных и работу с формами.
Почему при использовании pnpm нужны дополнительные пакеты?
В проектах на pnpm изолируются транзитивные зависимости, поэтому нужно явно установить @tanstack/react-query и react-router-dom тех же версий, что в @medusajs/dashboard. В npm или yarn эти пакеты доступны сразу.