myadmin-client-vue

Scaffolds a new affiliate-system page under src/views/billing/affiliates/ following patterns in Affiliate.vue, Faq.vue, RichReport.vue, SalesGraph.vue, etc. Wires the route as a child of /affiliate in src/router/index.ts with meta.i18n: ['affiliate'] and adds keys under src/locales/en/affiliate.json. Use when user says 'add affiliate page', 'new affiliate report', 'affiliate dashboard view'. Do NOT use for non-affiliate billing pages (Cart, Invoices, PrePays) — those live directly under src/views/billing/.

Adds an MSW request handler to src/mocks/handlers.ts for new API endpoints exercised by Vitest/jsdom tests, with optional parallel entry in test/visual/mocks/visualHandlers.ts for visual regression coverage. Follows the project's exact pattern: http.get/post against BASE_URL='https://my.interserver.net/apiv2', returns HttpResponse.json() with realistic shapes that match fetchWrapper consumers. Use when user says 'add msw handler', 'mock this endpoint', 'add API mock', 'stub this API for tests', or implements a new fetchWrapper call that has no existing mock. Do NOT use for editing existing handlers, for Playwright e2e/ tests (those hit the dev server), for e2e/real/ tests (real backend), or for service worker patches in public/mockServiceWorker.js.

Scaffolds a new sub-action child component for VPS/QS/server/website services (e.g., src/views/vps/ChangeTimezone.vue, src/views/quickservers/Backup.vue). Sub-actions are rendered inside View{Service}.vue when route.params.link matches the action name in the :link(...) enum in src/router/index.ts. Uses fetchWrapper, Swal confirmations, useI18n() with the parent namespace, and follows the structure of existing sub-actions like src/views/vps/ResetPassword.vue or src/views/vps/ChangeTimezone.vue. Use when user says 'add sub-action', 'new VPS action', 'add ChangeX page', 'register new :link action'. Do NOT use for top-level list/view/order pages (use add-service-list/add-service-view/add-route).

Creates a new i18n locale namespace JSON file in src/locales/en/{namespace}.json with properly structured translation keys, then propagates to other language directories. Use when user says 'add translations', 'new locale file', 'add i18n namespace', or creates a new view domain that needs translations. Do NOT use for editing existing locale files or fixing individual translation keys.

Creates a new Pinia store in src/stores/{domain}.store.ts following the Options API pattern with fetchWrapper, typed state interfaces, and standard CRUD actions. Use when user says 'add store', 'create new store', 'new Pinia store for {domain}'. Do NOT use for modifying existing stores or for non-service stores like auth/alert.

Adds new route entries to src/router/index.ts following the project's nested route pattern with lazy-loaded components, meta.i18n namespaces, parameterized :id(\d+) paths, and :link(action1|action2) sub-routes. Use when user says 'add route', 'new page route', 'register route for new service'. Do NOT use for redirect-only routes.

Creates a new service list page using the ServiceListTable component from src/components/ServiceListTable.vue. Follows the pattern in src/views/webhosting/WebsitesList.vue — defines columns, fetches data via fetchWrapper, sets breadcrumbs via useSiteStore. Use when user says 'add list page', 'create services list', 'new {service} list view'. Do NOT use for detail/view pages or order pages.

Creates a new shared Vue component in src/components/ following the project's Composition API pattern with <script setup lang='ts'>, useI18n(), and Admin-LTE/Bootstrap 4 markup. Handles props typing, emits, and fetchWrapper integration. Use when user says 'add component', 'create shared component', 'new reusable widget'. Do NOT use for view pages (use add-service-view/add-service-list) or store files.

Creates a new service view page (View{Service}.vue) with info boxes, link-based sub-action routing, store integration, and breadcrumbs following existing patterns in src/views/. Use when user says 'add view page', 'create service detail page', 'new View component for a service'. Do NOT use for list pages (use ServiceListTable), order pages, or sub-action components.

Intuitive, type safe and flexible Store for Vue. ALWAYS use when writing code importing "pinia". Consult for debugging, best practices, or modifying pinia.

Write and review unit tests for Vue 3 + TypeScript + Vitest + Pinia codebases. Use when creating or updating tests for components, composables, and stores; mocking Pinia with createTestingPinia; applying Vue Test Utils patterns; and enforcing black-box assertions over implementation details.

Use when writing unit/integration tests for Vite projects - configure vitest.config.ts, write test suites with describe/it, create mock implementations with vi.fn and vi.mock, set up code coverage thresholds, and run tests in parallel

Internationalization plugin for Vue.js. ALWAYS use when writing code importing "vue-i18n". Consult for debugging, best practices, or modifying vue-i18n, vue i18n.