Address review feedback on portal i18n
Swallow locale mutation rejections after the toast, close the mobile drawer on locale change, escape SEO paths, share the IAM locale list with SEO, and finish dropping /trust leftovers. Signed-off-by: Émile Ré <emile@probo.com>
This commit is contained in:
@@ -100,7 +100,9 @@ export function LocaleMismatchCallout({ identityKey }: LocaleMismatchCalloutProp
|
||||
};
|
||||
|
||||
const adoptUrlLocale = () => {
|
||||
void updateLocale(urlLocale).then(() => setDismissed(true));
|
||||
void updateLocale(urlLocale)
|
||||
.then(() => setDismissed(true))
|
||||
.catch(() => {});
|
||||
};
|
||||
|
||||
return (
|
||||
|
||||
@@ -36,11 +36,16 @@ import { useLocale } from "#/lib/i18n/useLocale";
|
||||
interface LocaleSelectProps {
|
||||
// Persist the choice on the signed-in identity when true.
|
||||
persist?: boolean;
|
||||
// Called after a locale change is requested (e.g. close the mobile drawer).
|
||||
onLocaleChange?: () => void;
|
||||
}
|
||||
|
||||
// Compact locale control for the top bar (guest and mobile). Uses the v2 Select
|
||||
// (Figma Select / ghost + globe) rather than a custom dropdown.
|
||||
export function LocaleSelect({ persist = false }: LocaleSelectProps) {
|
||||
export function LocaleSelect({
|
||||
persist = false,
|
||||
onLocaleChange,
|
||||
}: LocaleSelectProps) {
|
||||
const { t } = useTranslation();
|
||||
const locale = useLocale();
|
||||
const [changeLocale, isChanging] = useChangeLocale();
|
||||
@@ -52,6 +57,7 @@ export function LocaleSelect({ persist = false }: LocaleSelectProps) {
|
||||
if (value == null || value === locale) {
|
||||
return;
|
||||
}
|
||||
onLocaleChange?.();
|
||||
void changeLocale(value, { persist });
|
||||
}}
|
||||
disabled={isChanging}
|
||||
|
||||
@@ -144,7 +144,10 @@ export function TopBarMobileNav({ identityKey }: TopBarMobileNavProps) {
|
||||
|
||||
<DrawerFooter>
|
||||
<div className="w-full pb-2">
|
||||
<LocaleSelect persist={identity != null} />
|
||||
<LocaleSelect
|
||||
persist={identity != null}
|
||||
onLocaleChange={close}
|
||||
/>
|
||||
</div>
|
||||
{identity == null
|
||||
? (
|
||||
|
||||
@@ -29,12 +29,7 @@ import {
|
||||
import { resolveLanguage, SUPPORTED_LANGUAGES } from "./resolveLanguage";
|
||||
|
||||
function initialLanguage() {
|
||||
const pathname = window.location.pathname;
|
||||
const trustMatch = pathname.match(/^\/trust\/[^/]+(\/.*)?$/);
|
||||
const appPath = trustMatch
|
||||
? (trustMatch[1] && trustMatch[1].length > 0 ? trustMatch[1] : "/")
|
||||
: pathname;
|
||||
const first = appPath.split("/").filter(Boolean)[0];
|
||||
const first = window.location.pathname.split("/").filter(Boolean)[0];
|
||||
if (isUrlLocale(first)) {
|
||||
return urlLocaleToLanguage(first);
|
||||
}
|
||||
|
||||
@@ -24,6 +24,7 @@ import {
|
||||
} from "./resolveLanguage";
|
||||
|
||||
// Short tags used in URL path segments (and persisted on Identity.locale).
|
||||
// Keep in sync with iam.SupportedIdentityLocales.
|
||||
export const URL_LOCALES = [
|
||||
"en",
|
||||
"fr",
|
||||
|
||||
@@ -18,7 +18,7 @@
|
||||
// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
// SOFTWARE.
|
||||
|
||||
import { redirect, type LoaderFunctionArgs } from "react-router";
|
||||
import { type LoaderFunctionArgs, redirect } from "react-router";
|
||||
|
||||
import {
|
||||
isUrlLocale,
|
||||
@@ -30,7 +30,7 @@ import {
|
||||
// (/documents) and unknown two-letter tags are rewritten to a guessed locale.
|
||||
export function localeLayoutLoader({ request }: LoaderFunctionArgs) {
|
||||
const url = new URL(request.url);
|
||||
const appPath = stripBasename(url.pathname);
|
||||
const appPath = url.pathname || "/";
|
||||
const segments = appPath.split("/").filter(Boolean);
|
||||
const first = segments[0];
|
||||
|
||||
@@ -41,6 +41,7 @@ export function localeLayoutLoader({ request }: LoaderFunctionArgs) {
|
||||
const guess = resolveUrlLocale();
|
||||
|
||||
if (segments.length === 0) {
|
||||
// eslint-disable-next-line @typescript-eslint/only-throw-error -- react-router redirect
|
||||
throw redirect(`/${guess}${url.search}`);
|
||||
}
|
||||
|
||||
@@ -48,17 +49,11 @@ export function localeLayoutLoader({ request }: LoaderFunctionArgs) {
|
||||
if (/^[a-z]{2}$/.test(first)) {
|
||||
const rest = segments.slice(1);
|
||||
const path = rest.length === 0 ? "/" : `/${rest.join("/")}`;
|
||||
// eslint-disable-next-line @typescript-eslint/only-throw-error -- react-router redirect
|
||||
throw redirect(localizedPath(guess, path) + url.search);
|
||||
}
|
||||
|
||||
// First segment is a real route (documents, updates, …) — prefix locale.
|
||||
// eslint-disable-next-line @typescript-eslint/only-throw-error -- react-router redirect
|
||||
throw redirect(localizedPath(guess, appPath) + url.search);
|
||||
}
|
||||
|
||||
function stripBasename(pathname: string): string {
|
||||
const match = pathname.match(/^\/trust\/[^/]+(\/.*)?$/);
|
||||
if (match) {
|
||||
return match[1] && match[1].length > 0 ? match[1] : "/";
|
||||
}
|
||||
return pathname || "/";
|
||||
}
|
||||
|
||||
@@ -49,7 +49,8 @@ export function useChangeLocale() {
|
||||
// Identity↔URL desync that flashed the mismatch callout.
|
||||
startTransition(() => {
|
||||
if (options.persist) {
|
||||
void updateLocale(locale);
|
||||
// Mutation notifier already toasts; swallow rejection to avoid noise.
|
||||
void updateLocale(locale).catch(() => {});
|
||||
}
|
||||
if (locale !== currentLocale) {
|
||||
void navigate(replaceLocaleInPathname(pathname, locale) + search);
|
||||
|
||||
@@ -25,8 +25,8 @@ import { createBrowserRouter, redirect } from "react-router";
|
||||
|
||||
import { PageErrorBoundary } from "#/components/errors/PageErrorBoundary";
|
||||
import { RootErrorBoundary } from "#/components/errors/RootErrorBoundary";
|
||||
import { localeLayoutLoader } from "#/lib/i18n/localeRedirect";
|
||||
import { resolveUrlLocale } from "#/lib/i18n/locale";
|
||||
import { localeLayoutLoader } from "#/lib/i18n/localeRedirect";
|
||||
import { authRoutes } from "#/pages/auth/routes";
|
||||
import { documentRoutes } from "#/pages/documents/routes";
|
||||
import { HomePageSkeleton } from "#/pages/HomePageSkeleton";
|
||||
|
||||
Reference in New Issue
Block a user