building-admin-dashboard-customizations

Installation
Summary

Custom UI extensions for Medusa Admin dashboard using the Admin SDK and Medusa UI components.

  • Load this skill FIRST for any admin UI work (planning, implementation, exploration); MCP servers provide API reference only, not design patterns or data loading strategies
  • CRITICAL: Always use Medusa JS SDK for all API requests (never regular fetch); separate display queries from modal queries and invalidate display data after mutations
  • Implement widgets on existing pages or create custom UI routes; use FocusModal for creation flows and Drawer for editing, always with size="small" buttons and semantic color classes
  • Load reference files before coding: data-loading.md for queries, forms.md for modals, display-patterns.md for tables, typography.md for Text components
  • pnpm users must install @tanstack/react-query peer dependency before writing code; prices from Medusa are stored as-is (not in cents), display directly without division
SKILL.md

Medusa Admin Dashboard Customizations

Build custom UI extensions for the Medusa Admin dashboard using the Admin SDK and Medusa UI components.

Note: "UI Routes" are custom admin pages, different from backend API routes (which use building-with-medusa skill).

When to Apply

Load this skill for ANY admin UI development task, including:

  • Creating widgets for product/order/customer pages
  • Building custom admin pages
  • Implementing forms and modals
  • Displaying data with tables or lists
  • Adding navigation between pages

Also load these skills when:

  • building-with-medusa: Building backend API routes that the admin UI calls
  • building-storefronts: If working on storefront instead of admin dashboard
Related skills

More from medusajs/medusa-agent-skills

Installs
1.8K
GitHub Stars
162
First Seen
Jan 26, 2026