Frontend composables
Overview
The composables a custom frontend module's Vue calls to integrate with the DMS.
When your frontend layer ships its own Vue (Frontend layer), these are the composables it calls to talk to the DMS — the table below maps them to their chapters. Where the previous section, Extending the dashboard, is about registering capabilities, this one is the toolkit your components consume.
All are auto-imported by the base layers — call them from <script setup> or a composable; no import needed.
The toolkit
| Chapter | Composables |
|---|---|
| Auth requests & permissions | useApiData, useAuthFetch ($authFetch), usePermissions, useMultiAccount, useCurrentUser, useLogout, useSessionRecovery |
| Realtime & notifications | useRealtimeTopic, usePageRealtime, usePageLive, usePageLiveRefresh, useUserRealtime, useNotifications |
| Page context | useSiteLayout, useCurrentModule, useIsOwner, usePageRecordLabel, usePageToolbarSize, useDevReload, usePreferences, useFavoritePages, page setup, … |
| UI toolkit | useModal, useDrawer, useConfirm, useConfirmFrom, useApiError, useExportJob |
| Utilities | i18n (useTranslation), leave guard (usePageLeaveGuard), onboarding |
To read backend data a component renders, use
useApiData; for any other backend call (a write, a read on a click), $authFetch from useAuthFetch — never a bare $fetch. Only these attach the session and recover from an expired one, and only useApiData renders the data on the server and hands it to the browser. See Auth requests & permissions.