rohit/probo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Move cookie detail labels from backend to JS SDK

Browse Source 
label_description and label_duration are not user-customizable, so they
don't belong in the backend translation defaults. Hardcode them in the
cookie-banner SDK's i18n module instead.

Signed-off-by: Émile Ré <emile@getprobo.com>
This commit is contained in:
Émile Ré
2026-04-23 20:57:10 +04:00
parent 0b7855243a
commit fa7a9c96c1
3 changed files with 20 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
packages/cookie-banner/src/components/cookie-list.ts
View File

@@ -13,7 +13,7 @@
// PERFORMANCE OF THIS SOFTWARE.
import type { CookieItem } from "../client";
import { type BannerTexts, interpolate } from "../i18n";
import { getCookieDetailLabels, interpolate } from "../i18n";
import { ProboElement } from "./base";
import type { ProboCategory } from "./category";
import type { ProboCookieBannerRoot } from "./cookie-banner-root";
@@ -38,15 +38,16 @@ export class ProboCookieList extends ProboElement {
if (!this.template || !this.category) return;
const root = this.findAncestor<ProboCookieBannerRoot>("probo-cookie-banner-root");
const texts = root?.bannerConfig?.texts;
const lang = root?.bannerConfig?.language ?? "en";
const labels = getCookieDetailLabels(lang);
const cookies = this.category.cookies;
for (const cookie of cookies) {
this.stampCookie(cookie, texts);
this.stampCookie(cookie, labels);
}
}
private stampCookie(cookie: CookieItem, texts?: BannerTexts): void {
private stampCookie(cookie: CookieItem, labels: Record<string, string>): void {
if (!this.template) return;
const wrapper = document.createElement("probo-cookie");
@@ -57,7 +58,7 @@ export class ProboCookieList extends ProboElement {
duration: cookie.duration,
description: cookie.description,
});
this.fillLabels(clone, texts, {
this.fillLabels(clone, labels, {
description: cookie.description,
duration: cookie.duration,
});
@@ -80,15 +81,14 @@ export class ProboCookieList extends ProboElement {
private fillLabels(
fragment: DocumentFragment,
texts: BannerTexts | undefined,
labels: Record<string, string>,
values: Record<string, string>,
): void {
const labels = fragment.querySelectorAll("[data-label]");
for (const el of labels) {
for (const el of fragment.querySelectorAll("[data-label]")) {
const key = el.getAttribute("data-label")!;
const slotName = key.replace("label_", "");
const value = values[slotName] ?? "";
const tpl = texts?.[key];
const tpl = labels[key];
if (tpl) {
el.textContent = interpolate(tpl, { value });
const slot = el.querySelector(`[data-slot="${slotName}"]`);

11
packages/cookie-banner/src/i18n.ts
View File

@@ -35,3 +35,14 @@ export function interpolate(
): string {
return template.replace(/\{\{(\w+)\}\}/g, (_, key) => vars[key] ?? "");
}
const COOKIE_DETAIL_LABELS: Record<string, Record<string, string>> = {
en: { label_description: "Description: {{value}}", label_duration: "Duration: {{value}}" },
fr: { label_description: "Description : {{value}}", label_duration: "Durée : {{value}}" },
de: { label_description: "Beschreibung: {{value}}", label_duration: "Dauer: {{value}}" },
es: { label_description: "Descripción: {{value}}", label_duration: "Duración: {{value}}" },
};
export function getCookieDetailLabels(lang: string): Record<string, string> {
return COOKIE_DETAIL_LABELS[lang] ?? COOKIE_DETAIL_LABELS.en;
}