From f93cabb03a3fb0fb52218fe0eb4f8d49f151eb85 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?J=C3=A9r=C3=A9my=20Munsch?= Date: Wed, 31 Jan 2024 16:59:54 +0100 Subject: [PATCH] refactor TS i18NField --- classes/ToolboxHelper.ts | 7 ++++--- components/NavigationMenu.vue | 2 +- components/ProductDescriptionModal.vue | 2 +- components/layout/AppFooter.vue | 2 +- components/layout/AppHeader.vue | 2 +- index.d.ts | 8 +++++++- pages/brands/[slug].vue | 2 +- pages/index.vue | 2 +- pages/ranges/[slug].vue | 2 +- 9 files changed, 18 insertions(+), 11 deletions(-) diff --git a/classes/ToolboxHelper.ts b/classes/ToolboxHelper.ts index 76f0c67..7955d02 100644 --- a/classes/ToolboxHelper.ts +++ b/classes/ToolboxHelper.ts @@ -41,12 +41,13 @@ export default class ToolboxHelper { return t(text, params); } - public static getTranslatableField(model: TypeBrand | TypeRange | TypeProduct, field: "name" | "slug" | "description"): string { + public static getTranslatableField(model: Typei18nModel, field: Typei18nFieldList): string { const { locale, fallbackLocale } = useAppStore().getI18n(); - const i18nField: Typei18nField | null = (model[field as keyof typeof model] ?? null) as Typei18nField | null; + const i18nField: Typei18nField | null = (model[field as keyof typeof model] !== undefined ? + model[field as keyof typeof model] : null) as Typei18nField | null; if (!i18nField) { - throw new Error(`getTranslatableField ${field} is not part of ${model}`); + return "undefined"; } return i18nField[locale] !== undefined ? i18nField[locale] : i18nField[fallbackLocale]; diff --git a/components/NavigationMenu.vue b/components/NavigationMenu.vue index adcb900..2167d02 100644 --- a/components/NavigationMenu.vue +++ b/components/NavigationMenu.vue @@ -77,7 +77,7 @@ export default defineComponent({ t(text: string, params: Record = {}, localeToUse: string|null = null): string { return ToolboxHelper.trans(text, params, localeToUse); }, - transField(model: TypeBrand | TypeRange | TypeProduct, field: "name" | "slug" | "description") { + transField(model: Typei18nModel, field: Typei18nFieldList) { return ToolboxHelper.getTranslatableField(model, field); }, refreshData() { diff --git a/components/ProductDescriptionModal.vue b/components/ProductDescriptionModal.vue index 5b6073c..b4bb610 100644 --- a/components/ProductDescriptionModal.vue +++ b/components/ProductDescriptionModal.vue @@ -123,7 +123,7 @@ export default defineComponent({ t(text: string, params: Record = {}, localeToUse: string|null = null): string { return ToolboxHelper.trans(text, params, localeToUse); }, - transField(model: TypeBrand | TypeRange | TypeProduct, field: "name" | "slug" | "description") { + transField(model: Typei18nModel, field: Typei18nFieldList) { return ToolboxHelper.getTranslatableField(model, field); }, rangeFont(fontId: number) { diff --git a/components/layout/AppFooter.vue b/components/layout/AppFooter.vue index a9f7327..887dd14 100644 --- a/components/layout/AppFooter.vue +++ b/components/layout/AppFooter.vue @@ -132,7 +132,7 @@ export default defineComponent({ t(text: string, params: Record = {}, localeToUse: string|null = null): string { return ToolboxHelper.trans(text, params, localeToUse); }, - transField(model: TypeBrand | TypeRange | TypeProduct, field: "name" | "slug" | "description") { + transField(model: Typei18nModel, field: Typei18nFieldList) { return ToolboxHelper.getTranslatableField(model, field); }, getContrastYIQ(hexcolor: string): string { diff --git a/components/layout/AppHeader.vue b/components/layout/AppHeader.vue index 43353aa..6d1efb3 100644 --- a/components/layout/AppHeader.vue +++ b/components/layout/AppHeader.vue @@ -158,7 +158,7 @@ export default defineComponent({ t(text: string, params: Record = {}, localeToUse: string|null = null): string { return ToolboxHelper.trans(text, params, localeToUse); }, - transField(model: TypeBrand | TypeRange | TypeProduct, field: "name" | "slug" | "description") { + transField(model: Typei18nModel, field: Typei18nFieldList) { return ToolboxHelper.getTranslatableField(model, field); }, switchLocale(localeToSwitch:LocaleParams) { diff --git a/index.d.ts b/index.d.ts index 18dddb0..b63a58f 100644 --- a/index.d.ts +++ b/index.d.ts @@ -6,7 +6,11 @@ export { }; // * --- MODELS From JSON Schema type Locale = string; -type i18nField = Record +type i18nFieldList = +"name" | "slug" | "description" | +"sub_title" | "footer_phrase"; +type i18nField = Record; +type i18nModel = SettingsModel | BrandModel | RangeModel | ProductModel; /** Showroom Bo json data format */ type AppModel = { @@ -164,6 +168,8 @@ declare global { type TypeFont = FontModel; type Typei18nField = i18nField; + type Typei18nFieldList = i18nFieldList; + type Typei18nModel = i18nModel; type ToastTypeEnum = ToastType; diff --git a/pages/brands/[slug].vue b/pages/brands/[slug].vue index 66fb88f..aaef7fa 100644 --- a/pages/brands/[slug].vue +++ b/pages/brands/[slug].vue @@ -117,7 +117,7 @@ export default defineComponent({ t(text: string, params: Record = {}, localeToUse: string|null = null): string { return ToolboxHelper.trans(text, params, localeToUse); }, - transField(model: TypeBrand | TypeRange | TypeProduct, field: "name" | "slug" | "description") { + transField(model: Typei18nModel, field: Typei18nFieldList) { return ToolboxHelper.getTranslatableField(model, field); }, titleAnimations(rangeIndex: number) { diff --git a/pages/index.vue b/pages/index.vue index 1950cfc..e9bd2bc 100644 --- a/pages/index.vue +++ b/pages/index.vue @@ -120,7 +120,7 @@ export default defineComponent({ t(text: string, params: Record = {}, localeToUse: string|null = null): string { return ToolboxHelper.trans(text, params, localeToUse); }, - transField(model: TypeBrand | TypeRange | TypeProduct, field: "name" | "slug" | "description") { + transField(model: Typei18nModel, field: Typei18nFieldList) { return ToolboxHelper.getTranslatableField(model, field); }, setBrandToAnimate(): void { diff --git a/pages/ranges/[slug].vue b/pages/ranges/[slug].vue index 4bffc93..340366c 100644 --- a/pages/ranges/[slug].vue +++ b/pages/ranges/[slug].vue @@ -125,7 +125,7 @@ export default defineComponent({ t(text: string, params: Record = {}, localeToUse: string | null = null): string { return ToolboxHelper.trans(text, params, localeToUse); }, - transField(model: TypeBrand | TypeRange | TypeProduct, field: "name" | "slug" | "description") { + transField(model: Typei18nModel, field: Typei18nFieldList) { return ToolboxHelper.getTranslatableField(model, field); }, getContrastYIQ(hexcolor: string): string {