diff --git a/src/components/App.tsx b/src/components/App.tsx index d362e1ed..4dc0bcb5 100644 --- a/src/components/App.tsx +++ b/src/components/App.tsx @@ -69,15 +69,16 @@ export function App({ }); // Language setup - const { language, handleChangeLanguage, messages, htmlTagVariables } = useLanguage({ - supportedLanguages, - translationsLocation: - // Order of priority: - // 1. Take airgap.js data-messages - // 2. Take consentManagerConfig.messages - // 3. Look for translations locally - settings.messages || config.messages || './translations', - }); + const { language, handleChangeLanguage, messages, htmlTagVariables } = + useLanguage({ + supportedLanguages, + translationsLocation: + // Order of priority: + // 1. Take airgap.js data-messages + // 2. Take consentManagerConfig.messages + // 3. Look for translations locally + settings.messages || config.messages || './translations', + }); // Create the `transcend` API const consentManagerAPI = makeConsentManagerAPI({ diff --git a/src/hooks/useLanguage.ts b/src/hooks/useLanguage.ts index 3a1e0ea8..36d495ab 100644 --- a/src/hooks/useLanguage.ts +++ b/src/hooks/useLanguage.ts @@ -177,7 +177,9 @@ export function useLanguage({ const [messages, setMessages] = useState(); // Store the HTML opening/closing tags we need to replace our tag variables with - const [htmlTagVariables, setHtmlTagVariables] = useState>({}); + const [htmlTagVariables, setHtmlTagVariables] = useState< + Record + >({}); // Load the default translations useEffect(() => { diff --git a/src/utils/substitute-html.ts b/src/utils/substitute-html.ts index 6b14a470..df929960 100644 --- a/src/utils/substitute-html.ts +++ b/src/utils/substitute-html.ts @@ -10,19 +10,22 @@ import { TranslatedMessages } from '@transcend-io/internationalization'; */ export function substituteHtml(messages: TranslatedMessages): { /** The set of messages with their HTML opening/closing tags substituted */ - substitutedMessages: TranslatedMessages, + substitutedMessages: TranslatedMessages; /** The set of variables used to replace the substitutions with their corresponding HTML opening/closing tags */ - tagVariables: Record + tagVariables: Record; } { - const substitutedMessages = { ...messages}; + const substitutedMessages = { ...messages }; const tagVariables: Record = {}; Object.entries(substitutedMessages).forEach(([key, rawMessage]) => { let placeholderMessage = rawMessage; - const htmlTags = [...rawMessage.matchAll(/<[^>]+>/g)].flat() + const htmlTags = [...rawMessage.matchAll(/<[^>]+>/g)].flat(); htmlTags.forEach((tag, idx) => { const uniqKey = key.replaceAll('.', '_'); - placeholderMessage = placeholderMessage.replace(tag, `{tcm_${uniqKey}_tag_match_${idx}}`); - tagVariables[`tcm_${uniqKey}_tag_match_${idx}`] = tag + placeholderMessage = placeholderMessage.replace( + tag, + `{tcm_${uniqKey}_tag_match_${idx}}`, + ); + tagVariables[`tcm_${uniqKey}_tag_match_${idx}`] = tag; }); substitutedMessages[key] = placeholderMessage; });