Shivam Mishra
16e638aeb7
Move the article viewer query-param logic out of ArticleContainer into a shared buildArticleViewerLink helper so it can be reused.
62 lines
2.3 KiB
JavaScript
62 lines
2.3 KiB
JavaScript
/**
|
||
* Determine the best-matching locale from the list of locales allowed by the portal.
|
||
*
|
||
* The matching happens in the following order:
|
||
* 1. Exact match – the visitor-selected locale equals one in the `allowedLocales` list
|
||
* (e.g., `fr` ➜ `fr`).
|
||
* 2. Base language match – the base part of a compound locale (before the underscore)
|
||
* matches (e.g., `fr_CA` ➜ `fr`).
|
||
* 3. Variant match – when the base language is selected but a regional variant exists
|
||
* in the portal list (e.g., `fr` ➜ `fr_BE`).
|
||
*
|
||
* If none of these rules find a match, the function returns `null`,
|
||
* Don't show popular articles if locale doesn't match with allowed locales
|
||
*
|
||
* @export
|
||
* @param {string} selectedLocale The locale selected by the visitor (e.g., `fr_CA`).
|
||
* @param {string[]} allowedLocales Array of locales enabled for the portal.
|
||
* @returns {(string|null)} A locale string that should be used, or `null` if no suitable match.
|
||
*/
|
||
export const getMatchingLocale = (selectedLocale = '', allowedLocales = []) => {
|
||
// Ensure inputs are valid
|
||
if (
|
||
!selectedLocale ||
|
||
!Array.isArray(allowedLocales) ||
|
||
!allowedLocales.length
|
||
) {
|
||
return null;
|
||
}
|
||
|
||
const [lang] = selectedLocale.split('_');
|
||
|
||
const priorityMatches = [
|
||
selectedLocale, // exact match
|
||
lang, // base language match
|
||
allowedLocales.find(l => l.startsWith(`${lang}_`)), // first variant match
|
||
];
|
||
|
||
// Return the first match that exists in the allowed list, or null
|
||
return priorityMatches.find(l => l && allowedLocales.includes(l)) ?? null;
|
||
};
|
||
|
||
/**
|
||
* Build the link consumed by the in-widget article viewer, appending the query
|
||
* params it expects (plain layout, theme and locale).
|
||
*
|
||
* @export
|
||
* @param {Object} options
|
||
* @param {string} options.link Relative article/portal path (e.g. `hc/slug/articles/foo`).
|
||
* @param {(string|null)} [options.locale] Resolved portal locale.
|
||
* @param {boolean} [options.prefersDarkMode] Whether the widget is in dark mode.
|
||
* @returns {string} The link with the article viewer query params appended.
|
||
*/
|
||
export const buildArticleViewerLink = ({ link, locale, prefersDarkMode }) => {
|
||
const params = new URLSearchParams({
|
||
show_plain_layout: 'true',
|
||
theme: prefersDarkMode ? 'dark' : 'light',
|
||
...(locale && { locale }),
|
||
});
|
||
|
||
return `${link}?${params.toString()}`;
|
||
};
|