Module Server/Get Client Locales

This function let you get the locales of the client (the user) who originated the request.

import { getClientLocales } from "remix-utils/locales/server";

export async function loader({ request }: Route.LoaderArgs) {
	// using the request
	let locales = getClientLocales(request);
	// or using the headers
	let locales = getClientLocales(request.headers);
}
Copy

The return value is a Locales type, which is string | string[] | undefined.

The returned locales can be directly used on the Intl API when formatting dates, numbers, etc.

import { getClientLocales } from "remix-utils/locales/server";
export async function loader({ request }: Route.LoaderArgs) {
	let locales = getClientLocales(request);
	let nowDate = new Date();
	let formatter = new Intl.DateTimeFormat(locales, {
		year: "numeric",
		month: "long",
		day: "numeric",
	});
	return json({ now: formatter.format(nowDate) });
}
Copy

The value could also be returned by the loader and used on the UI to ensure the user's locales is used on both server and client formatted dates.