@autobusal/providers 1.6.4 → 1.6.6

package/CHANGELOG.md

@@ -4,6 +4,47 @@ 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.6.6] - 2026-07-31
+
+### Fixed
+
+- **`Providers.tsx`: `Setup` (and its `useGetMenu()` call) now has its own
+  inner `<Suspense>` boundary**, instead of sharing the outer one with
+  `Recaptcha`/`Styles`/`Notifications`. `Setup` calls a second,
+  independently-resolving `useSuspenseQuery` (`get-menu`) after
+  `useGetSettings()`; on a cold menu cache this suspended AFTER
+  Recaptcha's `GoogleReCaptchaProvider` had already committed and
+  injected its script/badge - and a Suspense boundary that re-suspends
+  discards its already-committed content and remounts it once ready.
+  `GoogleReCaptchaProvider` isn't remount-safe (its script/badge
+  injection is async, outside React's own DOM bookkeeping), so the
+  remount left a duplicate, half-torn-down `.grecaptcha-badge` behind.
+  That corrupted DOM state then threw an uncaught `TypeError: Cannot
+  read properties of null (reading 'removeChild')` the next time React
+  reconciled anywhere near the root - i.e. on every subsequent route
+  change, since Recaptcha wraps the whole router. The exception isn't
+  caught by the app's `ErrorBoundary` (render-phase only), so it
+  silently aborted the commit: the URL would update (the router's
+  `history.pushState` already ran) but the page itself never
+  re-rendered - freezing client-side navigation app-wide, most visibly
+  reproduced via the account dropdown menu (Password, Telegram, and the
+  impersonation-aware Logout/"Return to my account" link, which is what
+  surfaced this).
+
+## [1.6.5] - 2026-07-31
+
+### Added
+
+- **`Queries/apiClient.ts` sends `Content-Language`** on every request,
+  reflecting the live active i18next language. The API's
+  ChangeApiLanguage middleware/Languaged trait expect this to localize
+  city/country/article/... names, but the frontend never sent it -
+  those names always rendered in the API's own default locale
+  regardless of the UI's actual language. Requires obtapi's
+  Traits\Languaged fix (falls back safely for the 13 UI languages the
+  database has no columns for) and @autobusal/bff 1.2.0 (forwards the
+  header upstream in bff mode) to actually take effect end-to-end.
+
 ## [1.6.4] - 2026-07-30
 
 ### Added

package/Providers.tsx

@@ -24,16 +24,38 @@ const Providers = ({ type, loading, children }: Props): JSX.Element => (
   // 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).
+  // Edited: Ferjolt Ozuni - Date: 2026-07-31
+  // Bug: Setup also calls useGetMenu() (a SEPARATE useSuspenseQuery, its own
+  // cache key/promise) in its own render body, still inside this same outer
+  // boundary. On a cold menu cache, that suspends AFTER Recaptcha/Styles/
+  // Notifications above it have already committed - and a Suspense boundary
+  // re-suspending after its content is already committed hides/discards that
+  // whole committed subtree and mounts it again once ready. Recaptcha's
+  // GoogleReCaptchaProvider isn't remount-safe: its script/badge injection is
+  // async and outside React's DOM bookkeeping, so remounting it left a
+  // duplicate, half-torn-down <div class="grecaptcha-badge"> behind. That
+  // corrupted DOM state then threw an uncaught "Cannot read properties of
+  // null (reading 'removeChild')" the next time React reconciled anywhere
+  // near the root - which is every route change, since Recaptcha wraps the
+  // whole router - silently aborting the commit. The URL would update (the
+  // router's history.pushState already ran) but the page itself would never
+  // re-render, freezing navigation app-wide with no console-visible error
+  // (uncaught DOM exceptions like this don't hit the render-phase-only
+  // ErrorBoundary). Giving Setup its own inner boundary means its menu
+  // suspension can only hide/retry ITSELF, not the already-committed
+  // Recaptcha/Styles/Notifications above it.
   <Suspense fallback={ loading }>
     <Queries>
       <Recaptcha>
         <Styles>
           <Notifications>
-            <Setup type={ type }>
-              <Suspense fallback={ loading }>
-                { children }
-              </Suspense>
-            </Setup>
+            <Suspense fallback={ loading }>
+              <Setup type={ type }>
+                <Suspense fallback={ loading }>
+                  { children }
+                </Suspense>
+              </Setup>
+            </Suspense>
           </Notifications>
         </Styles>
       </Recaptcha>

package/Queries/apiClient.ts

@@ -1,4 +1,5 @@
 import axios from 'axios';
+import i18next from 'i18next';
 import languages from '@lang/errors';
 import { getLanguage } from '../Setup/languages';
 import { error as systemError } from '@autobusal/utilities';
@@ -37,6 +38,24 @@ if (!isBffMode) {
   });
 }
 
+// The API localizes city/country/article/... names off this header
+// (ChangeApiLanguage middleware) - was never sent at all, so every one of
+// those names always rendered in the API's own default locale regardless
+// of the UI's actual language. i18next.language reflects the live active
+// language (kept in sync by Setup/languages.ts on every change), read
+// fresh per request rather than closed over once, so a language switch
+// takes effect on the very next call with no extra wiring anywhere else.
+// In bff mode this also needs public/bff/index.php's api() to forward it
+// upstream (see @autobusal/bff) - both sides had to change, only one of
+// them silently doing nothing would look identical to neither working.
+apiClient.interceptors.request.use(config => {
+  if (i18next.language) {
+    config.headers['Content-Language'] = i18next.language;
+  }
+
+  return config;
+});
+
 apiClient.interceptors.response.use(response => (
   response
 ), async (error) => {

package/package.json

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