orcaqubits/magento-admin-ui
dist/cursor/magento2-commerce/skills/magento-admin-ui/SKILL.md
Build Magento 2 admin interfaces — UI component grids, forms, system configuration, ACL, and admin controllers. Use when creating admin panels, data grids, edit forms, or system settings.
$ install --global
skillsauthnpx skillsauth add orcaqubits/agentic-commerce-claude-plugins magento-admin-uiInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
Security Scan Results
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
3
Scanners Passed
9
Scanners in report
Clean
TrivyContainer and dependency vulnerability scanner
95%
Clean
SemgrepStatic code analysis for vulnerabilities
95%
Clean
mcp-scan (Snyk)Model Context Protocol security validation
95%
Skipped
Snyk (dep)Open source security scanning
50%
Skipped
Socket.devSupply chain security analysis
50%
Skipped
VirusTotalMulti-engine malware detection
50%
Skipped
CrowdStrikeAdvanced threat intelligence
50%
Skipped
OSV-ScannerOpen Source Vulnerability database check
50%
Skipped
OWASP Dep-Check
50%
Last scanned: May 9, 2026, 6:58 AM197.3s1 file scanned
SKILL.md
- name:
- magento-admin-ui
- description:
- >
Magento 2 Admin UI & System Configuration
Before writing code
Fetch live docs:
- Fetch
https://developer.adobe.com/commerce/php/development/components/add-admin-grid/for admin grid tutorial - Fetch
https://developer.adobe.com/commerce/php/tutorials/backend/create-access-control-list-rule/for ACL tutorial - Web-search
site:developer.adobe.com commerce php development components ui-componentsfor UI component reference
Admin Grids (UI Component Listings)
How Admin Grids Work
Grids are XML-declared UI components backed by data providers. They render in the browser using KnockoutJS and load data via AJAX.
Grid XML Structure (ui_component)
Located in view/adminhtml/ui_component/<listing_name>.xml:
<listing>root element with data source<dataSource>— data provider class and configuration<listingToolbar>— bookmarks, columns controls, filters, mass actions, paging<columns>— column definitions (type, label, sortable, filterable)<column>— individual column (text, select, date, actions)<actionsColumn>— edit/delete action links
Data Provider
- Extends
Magento\Ui\DataProvider\AbstractDataProvider - Backed by a collection (resource model collection)
- Provides data array to the grid
Mass Actions
Bulk operations on selected rows:
- Delete, status change, export
- Declared in grid XML under
<massaction> - Each action maps to a controller
Admin Forms (UI Component Forms)
Located in view/adminhtml/ui_component/<form_name>.xml:
<form>root element<fieldset>groups related fields<field>— input, textarea, select, multiselect, boolean, date, imageUploader, wysiwyg- Data provider loads entity data for editing
- Save controller processes form submission
System Configuration
system.xml
Defines admin config fields at Stores > Settings > Configuration:
<section>— top-level tab<group>— fieldset within a section<field>— individual configuration field- Field types: text, textarea, select, multiselect, obscure (password), image
config.xml
Provides default values for system configuration fields. Path format: section/group/field.
Reading Config Values
$this->scopeConfig->getValue('section/group/field', ScopeInterface::SCOPE_STORE);
Scopes: default, website, store (store view).
ACL (Access Control List)
acl.xml
Defines resource hierarchy:
- Nested
<resource>elements form a permission tree - Admin users are assigned to roles; roles get resource permissions
Controller ACL
Admin controllers extend Magento\Backend\App\Action:
const ADMIN_RESOURCE = 'Vendor_Module::resource_name';- Framework checks ACL before executing action
Menu Items
Declared in etc/adminhtml/menu.xml:
- Maps to ACL resources
- Defines position in admin sidebar navigation
Admin Controllers
- Extend
Magento\Backend\App\Action - Route in
etc/adminhtml/routes.xml - URL:
admin/<frontName>/<controller>/<action> - Common patterns: Index (list), Edit, Save, Delete, MassDelete, NewAction
Best Practices
- Always create ACL resources for every admin feature
- Use UI component grids over custom HTML grids
- Provide bookmarks and export in grids
- Validate form data server-side (never trust client)
- Use
resultPageFactoryfor rendering admin pages with proper layout - Scope config values appropriately (global vs website vs store view)
Fetch the admin grid tutorial, ACL guide, and UI component reference for exact XML schemas and data provider patterns before implementing.
Related Skills
orcaqubits/spree-headless-storefront
development
VerifiedTrustedCommunity
Build with Spree's headless Next.js storefront — the official `spree/storefront` repo (Next.js 16 App Router with Server Actions and Turbopack, React 19 Server Components, Tailwind CSS 4, TypeScript 5, `@spree/sdk`, Sentry), server-only auth (httpOnly JWT cookies + publishable key), MeiliSearch faceted catalog, one-page checkout with Apple/Google Pay/Klarna/Affirm/SEPA, multi-region market routing, GA4 + JSON-LD SEO, and Vercel/Docker deployment. Use when forking or customizing the storefront, or evaluating headless adoption.
27SKILL.mdUpdated May 14, 2026
orcaqubits/spree-extensions
tools
VerifiedTrustedCommunity
Build Spree extensions as Rails engines — gem scaffolding, `bin/rails g spree:extension`, mounting routes/migrations/assets, the modern `prepend` decorator pattern (`*_decorator.rb` with `self.prepended(base)`), generators (`spree:model_decorator`, `spree:controller_decorator`), the four customization surfaces in preference order (Events > Webhooks > Dependencies > Decorators), Spree::Dependencies for swapping service objects, gem release/versioning, and the deprecated Deface engine. Use when building a reusable Spree extension or adding non-trivial customization to an app.
27SKILL.mdUpdated May 14, 2026
orcaqubits/spree-events-webhooks
development
VerifiedTrustedCommunity
Build with Spree's event bus and Webhooks 2.0 — `Spree::Events` publication, `Spree::Subscriber` DSL with `subscribes_to` and `on`, wildcard matching, lifecycle events (`{model}.created/.updated/.deleted` via `publishes_lifecycle_events`), the canonical event catalog (order.*, payment.*, shipment.*, product.*), Webhooks 2.0 endpoints, HMAC-SHA256 signing (`X-Spree-Webhook-Signature`), exponential-backoff retries, and Sidekiq job orchestration. Use when wiring event-driven business logic, building webhook consumers, or replacing ActiveSupport callback chains.
27SKILL.mdUpdated May 14, 2026
orcaqubits/spree-dev-patterns
tools
VerifiedTrustedCommunity
Cross-cutting Spree development patterns — the customization preference hierarchy (Events > Webhooks > Dependencies > Decorators), `Spree::Dependencies` service-object swapping, the `_decorator.rb` + `prepend` + `self.prepended` idiom, idempotent subscribers and webhook receivers, multi-store scoping discipline, prefixed IDs, calculator polymorphism (shipping/promotion/tax share the base), service-object composition with `dry-monads` or simple results, why to avoid `class_eval` reopening and Deface, and Spree-on-Rails idioms (Hotwire/Turbo Stimulus, ActiveStorage, Action Cable, Sidekiq). Use when designing the architecture of a Spree extension or solving cross-cutting concerns.
27SKILL.mdUpdated May 14, 2026