Merge branch 'main' of github.com:devforth/adminforth

Author: yaroslav8765

adminforth/commands/createResource/templates/resource.ts.hbs

@@ -14,6 +14,9 @@ export default {
       components: {
         list: "@/renderers/CompactUUID.vue",
       }{{/if}},
+      showIn: {
+        all:true,
+      }
     }{{#unless @last}},{{/unless}}
     {{/each}}
   ],

adminforth/dataConnectors/postgres.ts

@@ -400,6 +400,8 @@ class PostgresConnector extends AdminForthBaseConnector implements IAdminForthDa
         }
         const primaryKey = this.getPrimaryKey(resource);
         const q = `INSERT INTO "${tableName}" (${columns.join(', ')}) VALUES (${placeholders}) RETURNING "${primaryKey}"`;
+    //   console.log('\n🔵 [PG INSERT]:', q);
+    //   console.log('📦 [VALUES]:', JSON.stringify(values, null, 2));
         if (process.env.HEAVY_DEBUG_QUERY) {
             console.log('🪲📜 PG Q:', q, 'values:', values);
         }

adminforth/dataConnectors/sqlite.ts

@@ -143,6 +143,12 @@ class SQLiteConnector extends AdminForthBaseConnector implements IAdminForthData
         } else {
           return value;
         }
+              }
+      else if (field.isArray?.enabled) {
+        if (value === null || value === undefined) {
+            return null;
+        }
+        return JSON.stringify(value);
       } else if (field.type == AdminForthDataTypes.BOOLEAN) {
         return value === null ? null : (value ? 1 : 0);
       } else if (field.type == AdminForthDataTypes.JSON) {
@@ -322,7 +328,14 @@ class SQLiteConnector extends AdminForthBaseConnector implements IAdminForthData
       const columns = Object.keys(record);
       const placeholders = columns.map(() => '?').join(', ');
       const values = columns.map((colName) => record[colName]);
-      const q = this.client.prepare(`INSERT INTO ${tableName} (${columns.join(', ')}) VALUES (${placeholders})`);
+      // const q = this.client.prepare(`INSERT INTO ${tableName} (${columns.join(', ')}) VALUES (${placeholders})`);
+      const sql = `INSERT INTO ${tableName} (${columns.join(', ')}) VALUES (${placeholders})`;
+      //console.log('\n🟢 [SQLITE INSERT]:', sql);
+      //console.log('📦 [VALUES]:', JSON.stringify(values, null, 2));
+      const q = this.client.prepare(sql);
+      if (process.env.HEAVY_DEBUG_QUERY) {
+            console.log('🪲📜 SQL Q:', q, 'values:', values);
+        }
       const ret = await q.run(values);
       return ret.lastInsertRowid;
     }

adminforth/documentation/docs/tutorial/03-Customization/10-menuConfiguration.md

@@ -1,4 +1,4 @@
-# Menu Configuration
+# Menu & Header
 
 
 ## Icons
@@ -253,3 +253,26 @@ import adminforth from '@/adminforth';
 adminforth.menu.refreshMenuBadges()
 ```
 
+## Avatars
+
+If you want your user to have custom avatar you can use avatarUrl:
+
+```ts title='./index.ts'
+
+auth: {
+
+  ...
+
+  avatarUrl: async (adminUser)=> { 
+    return `https://${process.env.STORAGE_PROVIDER_PATH}/${adminUser.dbUser.avatar_path}`
+  },
+
+  ...
+
+}
+
+```
+
+This syntax can be use to get unique avatar for each user of hardcode avatar, but it makes more sense to use it with [upload plugin](https://adminforth.dev/docs/tutorial/Plugins/upload/#using-plugin-for-uploading-avatar)
+
+

adminforth/documentation/docs/tutorial/07-Plugins/04-RichEditor.md

@@ -221,18 +221,13 @@ export default {
         "exe",
         "webp",
       ],
-      maxFileSize: 1024 * 1024 * 20, // 5MB
+      maxFileSize: 1024 * 1024 * 20, // 20MB
 
 
       filePath: ({ originalFilename, originalExtension, contentType }) =>
         `description_images/${new Date().getFullYear()}/${uuid()}/${originalFilename}.${originalExtension}`,
 
-      preview: {
-        // Used to display preview (if it is image) in list and show views instead of just path
-        // previewUrl: ({s3Path}) => `https://tmpbucket-adminforth.s3.eu-central-1.amazonaws.com/${s3Path}`,
-        // show image preview instead of path in list view
-        // showInList: false,
-      },
+
     }),
   ],
 } as AdminForthResourceInput;

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

@@ -31,7 +31,8 @@ Leave all settings unchanged (ACL Disabled, Block all public access - checked)
         ],
         "AllowedMethods": [
             "HEAD",
-            "PUT"
+            "PUT",
+            "GET"
         ],
         "AllowedOrigins": [
             "http://localhost:3500"
@@ -507,4 +508,155 @@ You can set the maximum width for the preview image in the `./resources/apartmen
   ...
 
 });
-```
+```
+
+## Using plugin for uploading avatar
+
+Let's say, that you want to use upload plugin for uploading avatar for each user.
+To do this add avatar column to the user resource:
+
+
+```ts title="./schema.prisma"
+  model adminuser {
+    id            String     @id
+    email         String     @unique
+    password_hash String
+    role          String
+    created_at    DateTime
+    //diff-add
+    avatar        ?String
+  }
+```
+
+Then make migration:
+
+```bash
+  npm run makemigration -- --name add-user-avatar-field ; npm run migrate:local
+```
+
+Add this column to the users resource:
+
+```ts title="./resources/adminuser.ts"
+
+...
+
+columns: [
+  
+  ...
+
+  //diff-add
+  {
+    //diff-add
+    name: "avatar",
+    //diff-add
+    type: AdminForthDataTypes.STRING,
+    //diff-add
+    showIn: ["show", "edit", "create" ],
+    //diff-add
+  },
+
+  ...
+
+]
+
+...
+
+plugins: [
+
+  ...
+
+  //diff-add
+  new UploadPlugin({
+      //diff-add
+    pathColumnName: "avatar",
+      //diff-add
+    storageAdapter: new AdminForthAdapterS3Storage({
+      //diff-add
+      bucket: process.env.AWS_BUCKET_NAME,
+      //diff-add
+      region: process.env.AWS_REGION,
+      //diff-add
+      accessKeyId: process.env.AWS_ACCESS_KEY_ID as string,
+      //diff-add
+      secretAccessKey: process.env.AWS_SECRET_ACCESS_KEY as string,
+      //diff-add
+    }),
+    //diff-add
+    allowedFileExtensions: [
+      //diff-add
+      "jpg",
+      //diff-add
+      "jpeg",
+      //diff-add
+      "png",
+      //diff-add
+      "gif",
+      //diff-add
+      "webm",
+      //diff-add
+      "exe",
+      //diff-add
+      "webp",
+      //diff-add
+    ],
+    //diff-add
+    maxFileSize: 1024 * 1024 * 20, // 20MB
+    //diff-add
+    filePath: ({ originalFilename, originalExtension, contentType, record }) => {
+      //diff-add
+      return `aparts/${new Date().getFullYear()}/${originalFilename}.${originalExtension}`
+      //diff-add
+    },
+    //diff-add
+    preview: {
+      //diff-add
+      maxWidth: "200px",
+      //diff-add
+    },
+    //diff-add
+  }),
+
+  ...
+
+]
+
+```
+
+And finally add this callback:
+
+```ts title="./index.ts"
+
+  auth: {
+
+    ...
+    //diff-add
+    avatarUrl: async (adminUser)=>{
+      //diff-add
+      const plugin = admin.getPluginsByClassName('UploadPlugin').find(p => p.pluginOptions.pathColumnName === 'avatar') as any; 
+      //diff-add
+      if (!plugin) {
+        //diff-add
+        throw new Error('Upload plugin for avatar not found');
+        //diff-add
+      }
+      //diff-add
+      if (adminUser.dbUser.avatar === null || adminUser.dbUser.avatar === undefined || adminUser.dbUser.avatar === '') {
+        //diff-add
+        return '';
+        //diff-add
+      }
+      //diff-add
+      const imageUrl = await plugin.getFileDownloadUrl(adminUser.dbUser.avatar || '', 3600);
+      //diff-add
+      return imageUrl;
+      //diff-add
+    },
+
+
+    ...
+
+  }
+
+```
+
+And now you can easily update avatar for each user

adminforth/documentation/docs/tutorial/07-Plugins/11-oauth.md

@@ -350,4 +350,43 @@ Links to adapters:
 [Google](https://github.com/devforth/adminforth-google-oauth-adapter)
 [GitHub](https://github.com/devforth/adminforth-github-oauth-adapter)
 [Facebook](https://github.com/devforth/adminforth-facebook-oauth-adapter)
-[Keycloak](https://github.com/devforth/adminforth-keycloak-oauth-adapter)
+[Keycloak](https://github.com/devforth/adminforth-keycloak-oauth-adapter)
+
+
+## Fill user full name
+
+If you have a fullName field in your users resource, you can add it to the plugin setup:
+
+```ts
+
+plugins: [
+  ...
+
+  new OAuthPlugin({
+
+    ...
+
+    userFullNameField: 'fullName'
+
+    ...
+
+  }),
+]
+
+```
+
+This field will be automatically filled with the name that the provider returns, if this field was empty.
+
+> ☝️Not all providers return full name or even if they do, there is no guarantee that they will be correct
+
+> Google Adapter: returns fullName, but if there is no last name - it will return only first name
+
+>Facebook: returns fullName
+
+>Github: returns name or fullName (depends of what user added in name field)
+
+>Keycloak: returns fullName
+
+>Microsoft: returns fullName
+
+>Twitch: return only users display name

adminforth/documentation/docs/tutorial/07-Plugins/14-markdown.md

@@ -113,7 +113,7 @@ export default {
         "exe",
         "webp",
       ],
-      maxFileSize: 1024 * 1024 * 20, // 5MB
+      maxFileSize: 1024 * 1024 * 20, // 20MB
 
 
       filePath: ({ originalFilename, originalExtension, contentType }) =>

adminforth/modules/configValidator.ts

@@ -1159,6 +1159,18 @@ export default class ConfigValidator implements IConfigValidator {
       } else {
         newConfig.auth.beforeLoginConfirmation = blc;
       }
+
+      // normalize adminUserAuthorize hooks
+      const aua = this.inputConfig.auth.adminUserAuthorize;
+      if (!Array.isArray(aua)) {
+        if (aua) {
+          newConfig.auth.adminUserAuthorize = [aua];
+        } else {
+          newConfig.auth.adminUserAuthorize = [];
+        }
+      } else {
+        newConfig.auth.adminUserAuthorize = aua;
+      }
     }
 
     // check for duplicate resourceIds and show which ones are duplicated