@adminforth/i18n 1.0.19 → 1.0.20

package/Changelog.md

@@ -5,6 +5,10 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [1.0.20]
+
+### Fixed
+- fix automatic translations
 
 ## [1.0.14]
 

package/custom/LanguageInUserMenu.vue

@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div class="min-w-40">
     <div class="cursor-pointer flex items-center gap-1 block px-4 py-2 text-sm text-black 
       hover:bg-html dark:text-darkSidebarTextHover dark:hover:bg-darkSidebarItemHover dark:hover:text-darkSidebarTextActive 
       w-full select-none	"

package/dist/custom/LanguageInUserMenu.vue

@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div class="min-w-40">
     <div class="cursor-pointer flex items-center gap-1 block px-4 py-2 text-sm text-black 
       hover:bg-html dark:text-darkSidebarTextHover dark:hover:bg-darkSidebarItemHover dark:hover:text-darkSidebarTextActive 
       w-full select-none	"

package/dist/index.js

@@ -52,6 +52,16 @@ class CachingAdapterMemory {
         });
     }
 }
+function ensureTemplateHasAllParams(template, newTemplate) {
+    // string ensureTemplateHasAllParams("a {b} c {d}", "я {b} і {d} в") // true
+    // string ensureTemplateHasAllParams("a {b} c {d}", "я і {d} в") // false
+    // string ensureTemplateHasAllParams("a {b} c {d}", "я {bb} і {d} в") // false
+    const existingParams = template.match(/{[^}]+}/g);
+    const newParams = newTemplate.match(/{[^}]+}/g);
+    const existingParamsSet = new Set(existingParams);
+    const newParamsSet = new Set(newParams);
+    return existingParamsSet.size === newParamsSet.size && [...existingParamsSet].every(p => newParamsSet.has(p));
+}
 class AiTranslateError extends Error {
     constructor(message) {
         super(message);
@@ -189,8 +199,23 @@ export default class I18N extends AdminForthPlugin {
             });
             // disable create allowedActions for translations
             resourceConfig.options.allowedActions.create = false;
+            // add hook to validate user did not screw up with template params
+            resourceConfig.hooks.edit.beforeSave.push((_c) => __awaiter(this, [_c], void 0, function* ({ updates, oldRecord }) {
+                for (const lang of this.options.supportedLanguages) {
+                    if (lang === 'en') {
+                        continue;
+                    }
+                    if (updates[this.trFieldNames[lang]]) { // if user set '', it will have '' in updates, then it is fine, we shoudl nto check it
+                        if (!ensureTemplateHasAllParams(oldRecord[this.enFieldName], updates[this.trFieldNames[lang]])) {
+                            return { ok: false, error: `Template params mismatch for ${updates[this.enFieldName]}. Template param names should be the same as in original string. E. g. 'Hello {name}', should be 'Hola {name}' and not 'Hola {nombre}'!` };
+                        }
+                    }
+                }
+                return { ok: true };
+            }));
             // add hook on edit of any translation
-            resourceConfig.hooks.edit.afterSave.push((_c) => __awaiter(this, [_c], void 0, function* ({ record, oldRecord }) {
+            resourceConfig.hooks.edit.afterSave.push((_d) => __awaiter(this, [_d], void 0, function* ({ updates, oldRecord }) {
+                console.log('🪲edit.afterSave', JSON.stringify(updates, null, 2), '-----', JSON.stringify(oldRecord, null, 2));
                 if (oldRecord) {
                     // find lang which changed
                     let langsChanged = [];
@@ -198,9 +223,6 @@ export default class I18N extends AdminForthPlugin {
                         if (lang === 'en') {
                             continue;
                         }
-                        if (record[this.trFieldNames[lang]] !== oldRecord[this.trFieldNames[lang]]) {
-                            langsChanged.push(lang);
-                        }
                     }
                     // clear frontend cache for all langsChanged
                     for (const lang of langsChanged) {
@@ -212,7 +234,7 @@ export default class I18N extends AdminForthPlugin {
                 return { ok: true };
             }));
             // add hook on delete of any translation to reset cache
-            resourceConfig.hooks.delete.afterSave.push((_d) => __awaiter(this, [_d], void 0, function* ({ record }) {
+            resourceConfig.hooks.delete.afterSave.push((_e) => __awaiter(this, [_e], void 0, function* ({ record }) {
                 for (const lang of this.options.supportedLanguages) {
                     this.cache.clear(`${this.resourceConfig.resourceId}:frontend:${lang}`);
                     this.cache.clear(`${this.resourceConfig.resourceId}:${record[this.options.categoryFieldName]}:${lang}:${record[this.enFieldName]}`);
@@ -226,23 +248,23 @@ export default class I18N extends AdminForthPlugin {
                     // form list of all langs, sorted by alphabet, without en, to get 'al|ro|uk'
                     record.fully_translated = this.fullCompleatedFieldValue === record[this.options.completedFieldName];
                 };
-                resourceConfig.hooks.list.afterDatasourceResponse.push((_e) => __awaiter(this, [_e], void 0, function* ({ response }) {
+                resourceConfig.hooks.list.afterDatasourceResponse.push((_f) => __awaiter(this, [_f], void 0, function* ({ response }) {
                     response.forEach(addIncompleteField);
                     return { ok: true };
                 }));
-                resourceConfig.hooks.show.afterDatasourceResponse.push((_f) => __awaiter(this, [_f], void 0, function* ({ response }) {
+                resourceConfig.hooks.show.afterDatasourceResponse.push((_g) => __awaiter(this, [_g], void 0, function* ({ response }) {
                     addIncompleteField(response.length && response[0]);
                     return { ok: true };
                 }));
                 // also add edit hook beforeSave to update completedFieldName
-                resourceConfig.hooks.edit.beforeSave.push((_g) => __awaiter(this, [_g], void 0, function* ({ record, oldRecord }) {
+                resourceConfig.hooks.edit.beforeSave.push((_h) => __awaiter(this, [_h], void 0, function* ({ record, oldRecord }) {
                     const futureRecord = Object.assign(Object.assign({}, oldRecord), record);
                     const futureCompletedFieldValue = yield this.computeCompletedFieldValue(futureRecord);
                     record[this.options.completedFieldName] = futureCompletedFieldValue;
                     return { ok: true };
                 }));
                 // add list hook to support filtering by fully_translated virtual field
-                resourceConfig.hooks.list.beforeDatasourceRequest.push((_h) => __awaiter(this, [_h], void 0, function* ({ query }) {
+                resourceConfig.hooks.list.beforeDatasourceRequest.push((_j) => __awaiter(this, [_j], void 0, function* ({ query }) {
                     if (!query.filters || query.filters.length === 0) {
                         query.filters = [];
                     }
@@ -275,12 +297,17 @@ export default class I18N extends AdminForthPlugin {
             }
             if (this.options.completeAdapter) {
                 resourceConfig.options.bulkActions.push({
+                    id: 'translate_all',
                     label: 'Translate selected',
                     icon: 'flowbite:language-outline',
                     // if optional `confirm` is provided, user will be asked to confirm action
                     confirm: 'Are you sure you want to translate selected items?',
                     state: 'selected',
-                    action: (_j) => __awaiter(this, [_j], void 0, function* ({ selectedIds, tr }) {
+                    allowed: (_k) => __awaiter(this, [_k], void 0, function* ({ resource, adminUser, selectedIds, allowedActions }) {
+                        console.log('allowedActions', JSON.stringify(allowedActions));
+                        return allowedActions.edit;
+                    }),
+                    action: (_l) => __awaiter(this, [_l], void 0, function* ({ selectedIds, tr }) {
                         let translatedCount = 0;
                         try {
                             translatedCount = yield this.bulkTranslate({ selectedIds });
@@ -398,6 +425,11 @@ ${JSON.stringify(strings.reduce((acc, s) => {
                             strId: translation[this.primaryKeyFieldName],
                         };
                     }
+                    // make sure LLM did not screw up with template params
+                    if (translation[this.enFieldName].includes('{') && !ensureTemplateHasAllParams(translation[this.enFieldName], translatedStr)) {
+                        console.warn(`LLM Screwed up with template params mismatch for "${translation[this.enFieldName]}"on language ${lang}, it returned "${translatedStr}"`);
+                        continue;
+                    }
                     updateStrings[translation[this.primaryKeyFieldName]].updates[this.trFieldNames[lang]] = translatedStr;
                 }
             }
@@ -439,7 +471,7 @@ ${JSON.stringify(strings.reduce((acc, s) => {
             })));
             yield Promise.all(Object.entries(updateStrings).map((_c) => __awaiter(this, [_c], void 0, function* ([_, { updates, strId }]) {
                 // because this will translate all languages, we can set completedLangs to all languages
-                const futureCompletedFieldValue = this.fullCompleatedFieldValue;
+                const futureCompletedFieldValue = yield this.computeCompletedFieldValue(updates);
                 yield this.adminforth.resource(this.resourceConfig.resourceId).update(strId, Object.assign(Object.assign({}, updates), { [this.options.completedFieldName]: futureCompletedFieldValue }));
             })));
             for (const lang of langsInvolved) {

package/index.ts

@@ -49,6 +49,17 @@ class CachingAdapterMemory implements ICachingAdapter {
   }
 }
 
+function ensureTemplateHasAllParams(template, newTemplate) {
+  // string ensureTemplateHasAllParams("a {b} c {d}", "я {b} і {d} в") // true
+  // string ensureTemplateHasAllParams("a {b} c {d}", "я і {d} в") // false
+  // string ensureTemplateHasAllParams("a {b} c {d}", "я {bb} і {d} в") // false
+  const existingParams = template.match(/{[^}]+}/g);
+  const newParams = newTemplate.match(/{[^}]+}/g);
+  const existingParamsSet = new Set(existingParams);
+  const newParamsSet = new Set(newParams);
+  return existingParamsSet.size === newParamsSet.size && [...existingParamsSet].every(p => newParamsSet.has(p));
+}
+
 class AiTranslateError extends Error {
   constructor(message: string) {
     super(message);
@@ -216,9 +227,24 @@ export default class I18N extends AdminForthPlugin {
     // disable create allowedActions for translations
     resourceConfig.options.allowedActions.create = false;
 
+    // add hook to validate user did not screw up with template params
+    resourceConfig.hooks.edit.beforeSave.push(async ({ updates, oldRecord }: { updates: any, oldRecord?: any }): Promise<{ ok: boolean, error?: string }> => {
+      for (const lang of this.options.supportedLanguages) {
+        if (lang === 'en') {
+          continue;
+        }
+        if (updates[this.trFieldNames[lang]]) {  // if user set '', it will have '' in updates, then it is fine, we shoudl nto check it
+          if (!ensureTemplateHasAllParams(oldRecord[this.enFieldName], updates[this.trFieldNames[lang]])) {
+            return { ok: false, error: `Template params mismatch for ${updates[this.enFieldName]}. Template param names should be the same as in original string. E. g. 'Hello {name}', should be 'Hola {name}' and not 'Hola {nombre}'!` };
+          }
+        }
+      }
+      return { ok: true };
+    });
 
     // add hook on edit of any translation
-    resourceConfig.hooks.edit.afterSave.push(async ({ record, oldRecord }: { record: any, oldRecord?: any }): Promise<{ ok: boolean, error?: string }> => {
+    resourceConfig.hooks.edit.afterSave.push(async ({ updates, oldRecord }: { updates: any, oldRecord?: any }): Promise<{ ok: boolean, error?: string }> => {
+      console.log('🪲edit.afterSave', JSON.stringify(updates, null, 2),'-----', JSON.stringify(oldRecord, null, 2));
       if (oldRecord) {
         // find lang which changed
         let langsChanged: LanguageCode[] = [];
@@ -226,9 +252,6 @@ export default class I18N extends AdminForthPlugin {
           if (lang === 'en') {
             continue;
           }
-          if (record[this.trFieldNames[lang]] !== oldRecord[this.trFieldNames[lang]]) {
-            langsChanged.push(lang);
-          }
         }
 
         // clear frontend cache for all langsChanged
@@ -241,6 +264,7 @@ export default class I18N extends AdminForthPlugin {
       }
       // clear frontend cache for all lan
 
+
       return { ok: true };
     });
 
@@ -319,11 +343,16 @@ export default class I18N extends AdminForthPlugin {
     if (this.options.completeAdapter) {
       resourceConfig.options.bulkActions.push(
         {
+          id: 'translate_all',
           label: 'Translate selected',
           icon: 'flowbite:language-outline',
           // if optional `confirm` is provided, user will be asked to confirm action
           confirm: 'Are you sure you want to translate selected items?',
           state: 'selected',
+          allowed: async ({ resource, adminUser, selectedIds, allowedActions }) => {
+            console.log('allowedActions', JSON.stringify(allowedActions));
+            return allowedActions.edit;
+          },
           action: async ({ selectedIds, tr }) => {
             let translatedCount = 0;
             try {
@@ -460,6 +489,11 @@ JSON.stringify(strings.reduce((acc: object, s: { en_string: string }): object =>
             strId: translation[this.primaryKeyFieldName],
           };
         }
+        // make sure LLM did not screw up with template params
+        if (translation[this.enFieldName].includes('{') && !ensureTemplateHasAllParams(translation[this.enFieldName], translatedStr)) {
+          console.warn(`LLM Screwed up with template params mismatch for "${translation[this.enFieldName]}"on language ${lang}, it returned "${translatedStr}"`);
+          continue;
+        }
         updateStrings[
           translation[this.primaryKeyFieldName]
         ].updates[this.trFieldNames[lang]] = translatedStr;
@@ -507,7 +541,7 @@ JSON.stringify(strings.reduce((acc: object, s: { en_string: string }): object =>
       category: string,
       strId: string,
       translatedStr: string
-     }> = {};
+    }> = {};
 
 
     const langsInvolved = new Set(Object.keys(needToTranslateByLang));
@@ -535,7 +569,7 @@ JSON.stringify(strings.reduce((acc: object, s: { en_string: string }): object =>
       Object.entries(updateStrings).map(
         async ([_, { updates, strId }]: [string, { updates: any, category: string, strId: string }]) => {
           // because this will translate all languages, we can set completedLangs to all languages
-          const futureCompletedFieldValue = this.fullCompleatedFieldValue; 
+          const futureCompletedFieldValue = await this.computeCompletedFieldValue(updates); 
 
           await this.adminforth.resource(this.resourceConfig.resourceId).update(strId, {
             ...updates,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adminforth/i18n",
-  "version": "1.0.19",
+  "version": "1.0.20",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "type": "module",