What problem does it solve? OrangeHRM's Vue frontend relies on cross-cutting plugins ($t, $can, $toast, navigate, useDateFormat) whose conventions are easy to misuse — silent translation failures, permission strings that must match backend data groups exactly, and auto-fired toasts that duplicate manual ones. This Skill provides the authoritative reference for using these plugins correctly. ## Core Features & Use Cases - i18n with $t: Translate strings using module-grouped keys, ICU MessageFormat parameters, the usei18n composable in setup(), and the translate() factory for non-component code. - ACL with $can: Gate buttons and UI elements by data-group permissions (read/create/update/delete) that map to backend ohrm_data_group rows, with AND semantics across multiple groups. - Toaster, navigation, and dates: Use semantic toast shortcuts (saveSuccess, cannotDelete, unexpectedError), navigate() for full-page transitions without vue-router, and useDateFormat for user-specific date display. - Use Case: When adding a new 'Save Widget' button to a Vue page, use this Skill to add the lang string via a migration, gate the button with $can.create('apiv2_x_widgets'), fire toast.saveSuccess() after the API call, and navigate() back to the list page. ## Quick Start Ask the AI to show how to translate a string, gate a button with $can, and show a success toast on an OrangeHRM Vue page.
