Demo

Hooks

Shared React hooks from @quan-erp/shared-ui for debounce, responsive layout, mobile back handling, and lazy locale translation.

Where to import

All documented hooks are exported from @quan-erp/shared-ui. Prefer these over reinventing debounce, matchMedia, or i18n loaders in a plugin.

  • Package: @quan-erp/shared-ui
  • Authenticated pages → useLazyLocaleTranslation
  • Public / pre-login pages → usePublicLazyLocaleTranslation
TSXimport
1import { 2 useDebounceValue, 3 useMediaQuery, 4 useMobileBackDialog, 5 useLazyLocaleTranslation, 6 usePublicLazyLocaleTranslation, 7} from "@quan-erp/shared-ui";

Catalog

  • useDebounceValue — debounce a live value before queries / expensive work
  • useMediaQuery — boolean match for a CSS media query
  • useMobileBackDialog — mobile back / escape closes dialogs correctly
  • useLazyLocaleTranslation — lazy locale JSON for authenticated pages
  • usePublicLazyLocaleTranslation — lazy locale for public / pre-login screens

Critical rules

  • Import only from @quan-erp/shared-ui
  • Do not copy hook implementations into the plugin
  • Pick the lazy-locale hook that matches auth context (private vs public)
  • Open a hook page in the sidebar for signatures and examples