isolate hook types for create/edit/delete. Check translations for broken params, add optional record param to s3 callback

Author: ivictbor

adminforth/documentation/docs/tutorial/05-Plugins/05-upload.md

@@ -60,6 +60,30 @@ AWS_ACCESS_KEY_ID=your_access_key_id
 AWS_SECRET_ACCESS_KEY=your_secret_access_key
 ```
 
+Now add a column for storing the path to the file in the database, add this statement to the `./schema.prisma`:
+
+```ts title="./schema.prisma"
+model apartments {
+  id                String     @id
+  created_at        DateTime? 
+  title             String 
+  square_meter      Float?
+  price             Decimal
+  number_of_rooms   Int?
+  description       String?
+  country           String?
+  listed            Boolean
+  realtor_id        String?
+//diff-add
+  apartment_image   String?
+}
+```
+
+Migrate prisma schema:
+
+```bash
+npx prisma migrate dev --name add-apartment-image
+```
 
 Add column to `aparts` resource configuration:
 
@@ -116,26 +140,6 @@ export const admin = new AdminForth({
 });
 ```
 
-Add a column for storing the path to the file in the database, add this statement to the `./schema.prisma`:
-
-```ts title="./schema.prisma"
-model apartments {
-  id                String     @id
-  created_at        DateTime? 
-  title             String 
-  square_meter      Float?
-  price             Decimal
-  number_of_rooms   Int?
-  description       String?
-  country           String?
-  listed            Boolean
-  realtor_id        String?
-//diff-add
-  apartment_image   String?
-}
-```
-
-![alt text](Upload.png)
 
 Here you can see how the plugin works:
 
@@ -145,7 +149,23 @@ Here you can see how the plugin works:
 This setup will upload files to S3 bucket with private ACL and save path to file (relative to bucket root) in `apartment_image` column.
 
 Once you will go to show or list view of `aparts` resource you will see preview of uploaded file by using presigned temporary URLs
-which are generated by plugin.
+which are generated by plugin:
+
+
+![alt text](Upload.png)
+
+
+> ☝ When upload feature is used on record which already exists in database (from 'edit' view), s3path callback will
+> receive additional parameter `record` with all values of record. Generally we don't recommend denormalizing any state
+> of record into s3Path (and instead only store links from record to file path like in example above).
+> But if you are 100% sure this kind of sate will be static, you might link to it:
+>
+> ```ts
+> s3Path: ({originalExtension, record}) => `game_images/${record.game_code}.${originalExtension}`
+> ```
+>
+> ! Please note that when upload is done from create view, record will be `undefined`.
+
 
 If you want to draw such images in main non-admin app e.g. Nuxt, you should generate presigned URLs by yourself. Here is NodeJS an example of how to do it:
 
@@ -167,7 +187,7 @@ export async function getPresignedUrl(s3Path: string): Promise<string> {
 }
 ```
 
-Alternatively you might want to make all objects public, let's consider how to do it.
+Alternatively, if you don't want to generate presigned URLs, you might want to make all objects public. Then you will be able  concatenate backet base domain and path stored in db, and use it as source of image. Let's consider how to do it.
 
 ### S3 upload with public access
 

adminforth/documentation/docs/tutorial/05-Plugins/10-i18n.md

@@ -295,6 +295,12 @@ For English it will use 2 pluralization forms (1 and other), for Slavic language
 ![alt text](image-4.png)
 
 
+## Limiting access to translating
+
+If you want to limit access to translations resource only to developers or translators, you can use [limiting access](/docs/tutorial/Customization/limitingAccess/) feature. 
+
+Please note that access to "Translate selected" bulk action which uses LLM AI translation adapter is determined by allowedActions.edit permission of resource.
+
 ## Translations in custom APIs
 
 Sometimes you need to return a translated error or success message from your API. You can use special `tr` function for this.

adminforth/index.ts

@@ -15,8 +15,6 @@ import {
   type AdminForthResourceColumn,
   IOperationalResource,
   IHttpServer, 
-  BeforeSaveFunction,
-  AfterSaveFunction,
   AdminForthResource,
   IAdminForthDataSourceConnectorBase,
   IWebSocketBroker,
@@ -340,7 +338,7 @@ class AdminForth implements IAdminForth {
     const primaryKey = record[resource.columns.find((col) => col.primaryKey).name];
 
     // execute hook if needed
-    for (const hook of listify(resource.hooks?.create?.afterSave as AfterSaveFunction[])) {
+    for (const hook of listify(resource.hooks?.create?.afterSave)) {
       process.env.HEAVY_DEBUG && console.log('🪲 Hook afterSave', hook);
       const resp = await hook({ 
         recordId: primaryKey, 
@@ -372,11 +370,12 @@ class AdminForth implements IAdminForth {
   ): Promise<{ error?: string }> {
 
     // execute hook if needed
-    for (const hook of listify(resource.hooks?.edit?.beforeSave as BeforeSaveFunction[])) {
+    for (const hook of listify(resource.hooks?.edit?.beforeSave)) {
       const resp = await hook({
         recordId,
         resource,
         record,
+        updates: record,
         oldRecord,
         adminUser,
         adminforth: this,
@@ -408,10 +407,11 @@ class AdminForth implements IAdminForth {
     }
 
     // execute hook if needed
-    for (const hook of listify(resource.hooks?.edit?.afterSave as AfterSaveFunction[])) {
+    for (const hook of listify(resource.hooks?.edit?.afterSave)) {
       const resp = await hook({ 
         resource, 
-        record, 
+        record,
+        updates: record,
         adminUser, 
         oldRecord,
         recordId,
@@ -434,7 +434,7 @@ class AdminForth implements IAdminForth {
     { resource: AdminForthResource, recordId: any, adminUser: AdminUser, record: any, extra?: HttpExtra }
   ): Promise<{ error?: string }> {
     // execute hook if needed
-    for (const hook of listify(resource.hooks?.delete?.beforeSave as BeforeSaveFunction[])) {
+    for (const hook of listify(resource.hooks?.delete?.beforeSave)) {
       const resp = await hook({ 
         resource, 
         record, 
@@ -456,7 +456,7 @@ class AdminForth implements IAdminForth {
     await connector.deleteRecord({ resource, recordId});
 
     // execute hook if needed
-    for (const hook of listify(resource.hooks?.delete?.afterSave as BeforeSaveFunction[])) {
+    for (const hook of listify(resource.hooks?.delete?.afterSave)) {
       const resp = await hook({ 
         resource, 
         record, 

adminforth/modules/configValidator.ts

@@ -2,7 +2,6 @@ import {
   AdminForthConfig, 
   AdminForthResource, 
   IAdminForth, IConfigValidator, 
-  type AfterSaveFunction,
   AdminForthBulkAction,
   AdminForthInputConfig,
   AdminForthConfigCustomization,
@@ -20,7 +19,6 @@ import {
   AllowedActionsEnum,
   AdminForthComponentDeclaration , 
   AdminForthResourcePages,
-  AdminForthResourceInputCommon, 
   AdminForthResourceColumnInputCommon,
 } from "../types/Common.js";
 import AdminForth from "adminforth";
@@ -237,7 +235,7 @@ export default class ConfigValidator implements IConfigValidator {
             const record = await connector.getRecordByPrimaryKey(res as AdminForthResource, recordId);
 
             await Promise.all(
-              (res.hooks.delete.beforeSave as AfterSaveFunction[]).map(
+              (res.hooks.delete.beforeSave).map(
                 async (hook) => {
                   const resp = await hook({ 
                     recordId: recordId,
@@ -260,7 +258,7 @@ export default class ConfigValidator implements IConfigValidator {
             await connector.deleteRecord({ resource: res as AdminForthResource, recordId });
             // call afterDelete hook
             await Promise.all(
-              (res.hooks.delete.afterSave as AfterSaveFunction[]).map(
+              (res.hooks.delete.afterSave).map(
                 async (hook) => {
                   await hook({ 
                     resource: res as AdminForthResource, 

adminforth/modules/restApi.ts

@@ -37,6 +37,7 @@ export async function interpretResource(
   // 'delete' needed for ActionCheckSource.deleteRequest and ActionCheckSource.displayButtons and ActionCheckSource.bulkActionRequest
   // 'list' needed for ActionCheckSource.listRequest
   // 'create' needed for ActionCheckSource.createRequest and ActionCheckSource.displayButtons
+  // for bulk actions we need to check all actions because bulk action can use any of them e.g sync allowed with edit
   const neededActions = {
     [ActionCheckSource.ShowRequest]: ['show'],
     [ActionCheckSource.EditRequest]: ['edit'],
@@ -45,7 +46,7 @@ export async function interpretResource(
     [ActionCheckSource.ListRequest]: ['list'],
     [ActionCheckSource.CreateRequest]: ['create'],
     [ActionCheckSource.DisplayButtons]: ['show', 'edit', 'delete', 'create', 'filter'],
-    [ActionCheckSource.BulkActionRequest]: ['delete'],
+    [ActionCheckSource.BulkActionRequest]: ['show', 'edit', 'delete', 'create', 'filter'],
   }[source];
 
   await Promise.all(
@@ -966,7 +967,7 @@ export default class AdminForthRestAPI implements IAdminForthRestAPI {
             if (action.allowed) {
               const execAllowed = await action.allowed({ adminUser, resource, selectedIds: recordIds, allowedActions });
               if (!execAllowed) {
-                return { error: await tr(`Action {actionId} not allowed`, 'errors', { actionId }) };
+                return { error: await tr(`Action "{actionId}" not allowed`, 'errors', { actionId: action.label }) };
               }
             }
             const response = await action.action({selectedIds: recordIds, adminUser, resource, tr});

adminforth/package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "adminforth",
-  "version": "1.5.8-next.22",
+  "version": "1.5.8-next.25",
   "description": "OpenSource Vue3 powered forth-generation admin panel",
   "main": "dist/index.js",
   "module": "dist/index.js",

adminforth/package.json

@@ -149,8 +149,8 @@ export default class AuditLogPlugin extends AdminForthPlugin {
       };
 
       ['edit', 'delete'].forEach((hook) => {
-        resource.hooks[hook].afterSave.push(async ({resource, record, adminUser, oldRecord, extra}) => {
-          return await this.createLogRecord(resource, hook as AllowedActionsEnum, record, adminUser, oldRecord, extra)
+        resource.hooks[hook].afterSave.push(async ({resource, updates, adminUser, oldRecord, extra}) => {
+          return await this.createLogRecord(resource, hook as AllowedActionsEnum, updates, adminUser, oldRecord, extra)
         })
       });
 

adminforth/plugins/audit-log/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,19 +227,31 @@ 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[] = [];
         for (const lang of this.options.supportedLanguages) {
           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: ({ 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 = this.computeCompletedFieldValue(updates); 
 
           await this.adminforth.resource(this.resourceConfig.resourceId).update(strId, {
             ...updates,

adminforth/plugins/i18n/index.ts

@@ -1,3 +1,9 @@
+## [1.0.18] - 2024-12-26
+
+### Improved
+
+- COmpatibility with latest AdminForth, remove dependency of hook types
+
 ## [1.0.17] - 2024-12-06
 
 ### Added