@autobusal/providers 1.2.11 → 1.3.0

package/CHANGELOG.md

@@ -4,6 +4,24 @@ All notable changes to `@autobusal/providers` are documented here. This project
 adheres to [Keep a Changelog](https://keepachangelog.com/en/1.1.0/) and
 [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [1.3.0] - 2026-07-25
+
+### Changed
+
+- **Captcha is now a runtime, per-label setting.** `Recaptcha.tsx` reads the
+  label's captcha config (provider + public site key) from `/api/settings/get`
+  via `useGetSettings()` and mounts `GoogleReCaptchaProvider` ONLY when the
+  provider is `recaptcha` (build-time `VITE_RECAPTCHA_KEY` remains as a
+  fallback). Cloudflare Turnstile needs no app-level provider. Because the
+  component now needs the query client, it moved INSIDE `<Queries>` in
+  `Providers.tsx`. `SettingsData`/`LabelSettings` types gained `captcha`.
+
+## [1.2.12] - 2026-07-24
+
+### Fixed
+
+- The full user profile - name, email, and via the nested admin/operator/agent/subagent/employee/driver/visitor sub-object: phone, address, passport, date of birth, company/NIPT - was persisted verbatim to localStorage, readable at rest by any script on the origin. Only a display-only subset (id, name, name_display, type, status) is now persisted; the full object still lives in-memory during an active session exactly as before. A new bootstrap fetch (wired into Setup) re-hydrates the full profile once per app load using the same reduced signal, guarded so it never fires for a genuine guest.
+
 ## [1.2.11] - 2026-07-19
 
 ### Fixed

package/Providers.tsx

@@ -20,9 +20,13 @@ const Providers = ({ type, loading, children }: Props): JSX.Element => (
   // the initial settings fetch). The QueryClient in <Queries> is created at
   // module scope, so remounting this subtree while suspended keeps the same
   // client and cache - no refetch loop.
+  // Edited: Ferjolt Ozuni - Date: 2026-07-25
+  // Recaptcha moved INSIDE Queries: it now reads the label's runtime captcha
+  // settings via useGetSettings(), which needs the QueryClientProvider (and
+  // suspends into the outer boundary on a cold cache, like Styles/Setup).
   <Suspense fallback={ loading }>
-    <Recaptcha>
-      <Queries>
+    <Queries>
+      <Recaptcha>
         <Styles>
           <Notifications>
             <Setup type={ type }>
@@ -32,8 +36,8 @@ const Providers = ({ type, loading, children }: Props): JSX.Element => (
             </Setup>
           </Notifications>
         </Styles>
-      </Queries>
-    </Recaptcha>
+      </Recaptcha>
+    </Queries>
   </Suspense>
 );
 

package/Recaptcha/Recaptcha.tsx

@@ -1,13 +1,36 @@
 import { GoogleReCaptchaProvider } from 'react-google-recaptcha-v3';
+import { useGetSettings } from '../services';
 
 interface Props {
   children: JSX.Element
 }
 
-const Recaptcha = ({ children }: Props): JSX.Element => (
-  <GoogleReCaptchaProvider reCaptchaKey={ import.meta.env.VITE_RECAPTCHA_KEY }>
-    { children }
-  </GoogleReCaptchaProvider>
-);
+// Edited: Ferjolt Ozuni - Date: 2026-07-25
+// The captcha provider + site key are now the label's runtime settings
+// (/api/settings/get, managed at /admin/label?type=captcha) instead of the
+// build-time VITE_RECAPTCHA_KEY - which stays only as a fallback for labels
+// without a captcha config yet. The Google provider script is mounted ONLY
+// when reCAPTCHA is the active provider; Cloudflare Turnstile needs no
+// app-wide provider (its script is loaded on demand by useRecaptcha in
+// @autobusal/hooks). NB: this component now calls useGetSettings(), so it
+// must sit INSIDE <Queries> (see Providers.tsx).
+const Recaptcha = ({ children }: Props): JSX.Element => {
+  const { data } = useGetSettings();
 
-export default Recaptcha;
+  const provider = data?.captcha?.provider
+    ?? (import.meta.env.VITE_RECAPTCHA_KEY ? 'recaptcha' : 'none');
+
+  const siteKey = data?.captcha?.site_key ?? import.meta.env.VITE_RECAPTCHA_KEY;
+
+  if (provider !== 'recaptcha' || !siteKey) {
+    return children;
+  }
+
+  return (
+    <GoogleReCaptchaProvider reCaptchaKey={ siteKey }>
+      { children }
+    </GoogleReCaptchaProvider>
+  );
+};
+
+export default Recaptcha;

package/Setup/Setup.tsx

@@ -1,6 +1,7 @@
 import Preload from './Preload';
 import languages from './languages';
 import analytics from './analytics';
+import useUserBootstrap from './useUserBootstrap';
 import { useGetSettings, useGetMenu } from '../services';
 
 interface Props {
@@ -12,6 +13,7 @@ const Setup = ({ type, children }: Props): JSX.Element => {
   const { data } = useGetSettings();
 
   useGetMenu();
+  useUserBootstrap();
 
   languages(type, data.preferences.languages.default);
 

package/Setup/useUserBootstrap.ts

@@ -0,0 +1,52 @@
+import { useEffect } from 'react';
+import { useQuery } from '@tanstack/react-query';
+import apiClient, { isBffMode } from '../Queries/apiClient';
+import { useUserStore } from '../stores/user';
+import { UserData } from '../types/users';
+
+// Edited: Ferjolt Ozuni - Date: 2026-07-24
+// The user store now only persists a display-only subset to localStorage
+// (see stores/user.ts) - the full profile (nested role data: phone, address,
+// passport, company, etc.) is no longer restored on a cold page load. This
+// hook re-fetches it once per app mount, so any component reading
+// `data.visitor.phone` etc. gets it back a moment after load instead of
+// instantly - the only user-visible change from this fix.
+//
+// This must NOT fire for a genuine guest: apiClient's response interceptor
+// treats any 401 as "session is gone" and redirects to /account/logout
+// (bearer mode immediately, bff mode after confirming via /session) - firing
+// this unconditionally would send every anonymous visitor there. It only
+// runs when there's an actual signal of a prior login: the bearer token
+// (bearer mode) or the redacted user stub this same store persists (bff
+// mode, where the token itself is an httpOnly cookie invisible to JS).
+const hasLoginSignal = (): boolean => (
+  (!isBffMode && localStorage.getItem('token') !== null)
+  || localStorage.getItem('user') !== null
+);
+
+const useUserBootstrap = (): void => {
+  const user = useUserStore();
+
+  const enabled = hasLoginSignal();
+
+  const { data } = useQuery<UserData>({
+    queryKey: ['account-bootstrap'],
+    queryFn: async () => (
+      await apiClient
+        .get('/api/account/refresh')
+        .then(response => response.data)
+    ),
+    enabled,
+    retry: false,
+    staleTime: Infinity
+  });
+
+  useEffect(() => {
+    if (data) {
+      user.save(data);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [data]);
+};
+
+export default useUserBootstrap;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@autobusal/providers",
-  "version": "1.2.11",
+  "version": "1.3.0",
   "author": "Ferjolt Ozuni",
   "type": "module",
   "main": "index.ts"

package/stores/user.ts

@@ -7,19 +7,45 @@ export interface UserStore {
   remove: () => void
 }
 
-const initial = localStorage.getItem('user') ? JSON.parse(localStorage.getItem('user') ?? '{}') : undefined;
+// Edited: Ferjolt Ozuni - Date: 2026-07-24
+// Bug: the full UserData object - name, email, and (via the nested
+// admin/operator/agent/subagent/employee/driver/visitor sub-object) phone,
+// address, passport, date of birth, company/NIPT - was persisted verbatim to
+// localStorage, readable at rest by any script on the origin (any XSS,
+// a malicious browser extension, disk/backup access on a shared machine).
+// Fix: only a display-only subset - enough to paint the UI immediately on
+// load - is ever written to disk. The full object still lives in the
+// in-memory store during an active session exactly as before (nothing
+// changes for any component reading `data.visitor.phone` etc. right after
+// login/activate/refresh); it's just never written to disk. A bootstrap
+// fetch (see Setup/useUserBootstrap.ts) re-hydrates the full in-memory
+// object shortly after app load using this same reduced signal.
+type PersistedUser = Pick<UserData, 'id' | 'name' | 'name_display' | 'type' | 'status'>;
+
+const STORAGE_KEY = 'user';
+
+const redact = (user: UserData): PersistedUser => ({
+  id: user.id,
+  name: user.name,
+  name_display: user.name_display,
+  type: user.type,
+  status: user.status
+});
+
+const stored = localStorage.getItem(STORAGE_KEY);
+const initial: PersistedUser | undefined = stored ? JSON.parse(stored) : undefined;
 
 export const useUserStore = create<UserStore>((set) => ({
-  data: initial,
+  data: initial as UserData | undefined,
   save: (user) => set(() => {
-    localStorage.setItem('user', JSON.stringify(user));
+    localStorage.setItem(STORAGE_KEY, JSON.stringify(redact(user)));
 
     return {
       data: user
     };
   }),
   remove: () => set(() => {
-    localStorage.removeItem('user');
+    localStorage.removeItem(STORAGE_KEY);
 
     return {
       data: undefined

package/types/settings.ts

@@ -1,6 +1,14 @@
 export interface SettingsData {
   url: string
 
+  // Edited: Ferjolt Ozuni - Date: 2026-07-25
+  // Runtime captcha config (provider + PUBLIC site key) from
+  // /api/settings/get - replaces the build-time VITE_RECAPTCHA_KEY.
+  captcha?: {
+    provider: 'none' | 'recaptcha' | 'turnstile'
+    site_key: string | null
+  }
+
   preferences: {
     company: string
 
@@ -122,6 +130,21 @@ export interface LabelSettings {
       client_secret: string
     }
   }
+
+  // Edited: Ferjolt Ozuni - Date: 2026-07-25
+  // Admin-managed captcha configuration; a single provider field makes
+  // reCAPTCHA and Turnstile mutually exclusive.
+  captcha?: {
+    provider: 'none' | 'recaptcha' | 'turnstile'
+    recaptcha: {
+      site_key?: string
+      secret_key?: string
+    }
+    turnstile: {
+      site_key?: string
+      secret_key?: string
+    }
+  }
 }
 
 // Edited: Ferjolt Ozuni - Date: 2026-07-18