refactor TS i18NField

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];

components/NavigationMenu.vue

@@ -77,7 +77,7 @@ export default defineComponent({
     t(text: string, params: Record<string,string> = {}, 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() {

components/ProductDescriptionModal.vue

@@ -123,7 +123,7 @@ export default defineComponent({
     t(text: string, params: Record<string,string> = {}, 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) {

components/layout/AppFooter.vue

@@ -132,7 +132,7 @@ export default defineComponent({
     t(text: string, params: Record<string,string> = {}, 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 {

components/layout/AppHeader.vue

@@ -158,7 +158,7 @@ export default defineComponent({
     t(text: string, params: Record<string,string> = {}, 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) {

index.d.ts

@@ -6,7 +6,11 @@ export { };
 // * --- MODELS From JSON Schema
 
 type Locale = string;
-type i18nField = Record<Locale, string>
+type i18nFieldList =
+"name" | "slug" | "description" |
+"sub_title" | "footer_phrase";
+type i18nField = Record<string, string>;
+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;
 
 

pages/brands/[slug].vue

@@ -117,7 +117,7 @@ export default defineComponent({
     t(text: string, params: Record<string,string> = {}, 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) {

pages/index.vue

@@ -120,7 +120,7 @@ export default defineComponent({
     t(text: string, params: Record<string,string> = {}, 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 {

pages/ranges/[slug].vue

@@ -125,7 +125,7 @@ export default defineComponent({
     t(text: string, params: Record<string, string> = {}, 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 {