@adminforth/upload 1.0.14 → 1.0.16

package/dist/index.js

@@ -9,7 +9,8 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 };
 import { getSignedUrl } from '@aws-sdk/s3-request-presigner';
 import { ExpirationStatus, GetObjectCommand, PutObjectCommand, S3 } from '@aws-sdk/client-s3';
-import { AdminForthPlugin } from "adminforth";
+import { AdminForthPlugin, suggestIfTypo } from "adminforth";
+import { Readable } from "stream";
 const ADMINFORTH_NOT_YET_USED_TAG = 'adminforth-candidate-for-cleanup';
 export default class UploadPlugin extends AdminForthPlugin {
     constructor(options) {
@@ -95,17 +96,36 @@ export default class UploadPlugin extends AdminForthPlugin {
             modifyResourceConfig: { get: () => super.modifyResourceConfig }
         });
         return __awaiter(this, void 0, void 0, function* () {
-            var _a, _b, _c, _d, _e;
+            var _a, _b, _c, _d, _e, _f, _g, _h, _j;
             _super.modifyResourceConfig.call(this, adminforth, resourceConfig);
             // after column to store the path of the uploaded file, add new VirtualColumn,
             // show only in edit and create views
             // use component uploader.vue
             const { pathColumnName } = this.options;
+            const pathColumnIndex = resourceConfig.columns.findIndex((column) => column.name === pathColumnName);
+            if (pathColumnIndex === -1) {
+                throw new Error(`Column with name "${pathColumnName}" not found in resource "${resourceConfig.name}"`);
+            }
+            if ((_a = this.options.generation) === null || _a === void 0 ? void 0 : _a.fieldsForContext) {
+                (_b = this.options.generation) === null || _b === void 0 ? void 0 : _b.fieldsForContext.forEach((field) => {
+                    if (!resourceConfig.columns.find((column) => column.name === field)) {
+                        const similar = suggestIfTypo(resourceConfig.columns.map((column) => column.name), field);
+                        throw new Error(`Field "${field}" specified in fieldsForContext not found in
+ resource "${resourceConfig.label}". ${similar ? `Did you mean "${similar}"?` : ''}`);
+                    }
+                });
+            }
             const pluginFrontendOptions = {
                 allowedExtensions: this.options.allowedFileExtensions,
                 maxFileSize: this.options.maxFileSize,
                 pluginInstanceId: this.pluginInstanceId,
+                resourceLabel: resourceConfig.label,
+                generateImages: this.options.generation ? true : false,
+                pathColumnLabel: resourceConfig.columns[pathColumnIndex].label,
+                fieldsForContext: (_c = this.options.generation) === null || _c === void 0 ? void 0 : _c.fieldsForContext,
             };
+            // define components which will be imported from other components
+            this.componentPath('imageGenerator.vue');
             const virtualColumn = {
                 virtual: true,
                 name: `uploader_${this.pluginInstanceId}`,
@@ -121,21 +141,17 @@ export default class UploadPlugin extends AdminForthPlugin {
                 },
                 showIn: ['edit', 'create'],
             };
-            const pathColumnIndex = resourceConfig.columns.findIndex((column) => column.name === pathColumnName);
-            if (pathColumnIndex === -1) {
-                throw new Error(`Column with name "${pathColumnName}" not found in resource "${resourceConfig.name}"`);
-            }
             if (!resourceConfig.columns[pathColumnIndex].components) {
                 resourceConfig.columns[pathColumnIndex].components = {};
             }
-            if (((_a = this.options.preview) === null || _a === void 0 ? void 0 : _a.showInList) || ((_b = this.options.preview) === null || _b === void 0 ? void 0 : _b.showInList) === undefined) {
+            if (((_d = this.options.preview) === null || _d === void 0 ? void 0 : _d.showInList) || ((_e = this.options.preview) === null || _e === void 0 ? void 0 : _e.showInList) === undefined) {
                 // add preview column to list
                 resourceConfig.columns[pathColumnIndex].components.list = {
                     file: this.componentPath('preview.vue'),
                     meta: pluginFrontendOptions,
                 };
             }
-            if (((_c = this.options.preview) === null || _c === void 0 ? void 0 : _c.showInShow) || ((_d = this.options.preview) === null || _d === void 0 ? void 0 : _d.showInShow) === undefined) {
+            if (((_f = this.options.preview) === null || _f === void 0 ? void 0 : _f.showInShow) || ((_g = this.options.preview) === null || _g === void 0 ? void 0 : _g.showInShow) === undefined) {
                 resourceConfig.columns[pathColumnIndex].components.show = {
                     file: this.componentPath('preview.vue'),
                     meta: pluginFrontendOptions,
@@ -156,7 +172,7 @@ export default class UploadPlugin extends AdminForthPlugin {
             virtualColumn.editingNote = pathColumn.editingNote;
             // ** HOOKS FOR CREATE **//
             // add beforeSave hook to save virtual column to path column
-            resourceConfig.hooks.create.beforeSave.push((_f) => __awaiter(this, [_f], void 0, function* ({ record }) {
+            resourceConfig.hooks.create.beforeSave.push((_k) => __awaiter(this, [_k], void 0, function* ({ record }) {
                 if (record[virtualColumn.name]) {
                     record[pathColumnName] = record[virtualColumn.name];
                     delete record[virtualColumn.name];
@@ -164,7 +180,7 @@ export default class UploadPlugin extends AdminForthPlugin {
                 return { ok: true };
             }));
             // in afterSave hook, aremove tag adminforth-not-yet-used from the file
-            resourceConfig.hooks.create.afterSave.push((_g) => __awaiter(this, [_g], void 0, function* ({ record }) {
+            resourceConfig.hooks.create.afterSave.push((_l) => __awaiter(this, [_l], void 0, function* ({ record }) {
                 process.env.HEAVY_DEBUG && console.log('💾💾  after save ', record === null || record === void 0 ? void 0 : record.id);
                 if (record[pathColumnName]) {
                     const s3 = new S3({
@@ -188,7 +204,7 @@ export default class UploadPlugin extends AdminForthPlugin {
             }));
             // ** HOOKS FOR SHOW **//
             // add show hook to get presigned URL
-            resourceConfig.hooks.show.afterDatasourceResponse.push((_h) => __awaiter(this, [_h], void 0, function* ({ response }) {
+            resourceConfig.hooks.show.afterDatasourceResponse.push((_m) => __awaiter(this, [_m], void 0, function* ({ response }) {
                 const record = response[0];
                 if (!record) {
                     return { ok: true };
@@ -206,8 +222,8 @@ export default class UploadPlugin extends AdminForthPlugin {
                 return { ok: true };
             }));
             // ** HOOKS FOR LIST **//
-            if ((_e = this.options.preview) === null || _e === void 0 ? void 0 : _e.showInList) {
-                resourceConfig.hooks.list.afterDatasourceResponse.push((_j) => __awaiter(this, [_j], void 0, function* ({ response }) {
+            if (((_h = this.options.preview) === null || _h === void 0 ? void 0 : _h.showInList) || ((_j = this.options.preview) === null || _j === void 0 ? void 0 : _j.showInList) === undefined) {
+                resourceConfig.hooks.list.afterDatasourceResponse.push((_o) => __awaiter(this, [_o], void 0, function* ({ response }) {
                     const s3 = new S3({
                         credentials: {
                             accessKeyId: this.options.s3AccessKeyId,
@@ -225,7 +241,7 @@ export default class UploadPlugin extends AdminForthPlugin {
             }
             // ** HOOKS FOR DELETE **//
             // add delete hook which sets tag adminforth-candidate-for-cleanup to true
-            resourceConfig.hooks.delete.afterSave.push((_k) => __awaiter(this, [_k], void 0, function* ({ record }) {
+            resourceConfig.hooks.delete.afterSave.push((_p) => __awaiter(this, [_p], void 0, function* ({ record }) {
                 if (record[pathColumnName]) {
                     const s3 = new S3({
                         credentials: {
@@ -257,7 +273,7 @@ export default class UploadPlugin extends AdminForthPlugin {
             }));
             // ** HOOKS FOR EDIT **//
             // beforeSave
-            resourceConfig.hooks.edit.beforeSave.push((_l) => __awaiter(this, [_l], void 0, function* ({ record }) {
+            resourceConfig.hooks.edit.beforeSave.push((_q) => __awaiter(this, [_q], void 0, function* ({ record }) {
                 // null is when value is removed
                 if (record[virtualColumn.name] || record[virtualColumn.name] === null) {
                     record[pathColumnName] = record[virtualColumn.name];
@@ -265,7 +281,7 @@ export default class UploadPlugin extends AdminForthPlugin {
                 return { ok: true };
             }));
             // add edit postSave hook to delete old file and remove tag from new file
-            resourceConfig.hooks.edit.afterSave.push((_m) => __awaiter(this, [_m], void 0, function* ({ record, oldRecord }) {
+            resourceConfig.hooks.edit.afterSave.push((_r) => __awaiter(this, [_r], void 0, function* ({ record, oldRecord }) {
                 if (record[virtualColumn.name] || record[virtualColumn.name] === null) {
                     const s3 = new S3({
                         credentials: {
@@ -372,5 +388,71 @@ export default class UploadPlugin extends AdminForthPlugin {
                 };
             })
         });
+        // generation: {
+        //   provider: 'openai-dall-e',
+        //   countToGenerate: 3,
+        //   openAiOptions: {
+        //     model: 'dall-e-3',
+        //     size: '1792x1024',
+        //     apiKey: process.env.OPENAI_API_KEY as string,
+        //   },
+        // },
+        //   curl https://api.openai.com/v1/images/generations \
+        // -H "Content-Type: application/json" \
+        // -H "Authorization: Bearer $OPENAI_API_KEY" \
+        // -d '{
+        //   "model": "dall-e-3",
+        //   "prompt": "A cute baby sea otter",
+        //   "n": 1,
+        //   "size": "1024x1024"
+        // }'
+        server.endpoint({
+            method: 'POST',
+            path: `/plugin/${this.pluginInstanceId}/generate_images`,
+            handler: (_c) => __awaiter(this, [_c], void 0, function* ({ body }) {
+                const { prompt } = body;
+                if (this.options.generation.provider !== 'openai-dall-e') {
+                    throw new Error(`Provider ${this.options.generation.provider} is not supported`);
+                }
+                const { model, size, apiKey } = this.options.generation.openAiOptions;
+                const url = 'https://api.openai.com/v1/images/generations';
+                let error = null;
+                const images = yield Promise.all((new Array(this.options.generation.countToGenerate)).fill(0).map(() => __awaiter(this, void 0, void 0, function* () {
+                    const response = yield fetch(url, {
+                        method: 'POST',
+                        headers: {
+                            'Content-Type': 'application/json',
+                            'Authorization': `Bearer ${apiKey}`,
+                        },
+                        body: JSON.stringify({
+                            model,
+                            prompt,
+                            n: 1,
+                            size,
+                        })
+                    });
+                    const json = yield response.json();
+                    if (json.error) {
+                        console.error('Error generating image', json.error);
+                        error = json.error;
+                        return;
+                    }
+                    return json;
+                })));
+                return { error, images };
+            })
+        });
+        server.endpoint({
+            method: 'GET',
+            path: `/plugin/${this.pluginInstanceId}/cors-proxy`,
+            handler: (_d) => __awaiter(this, [_d], void 0, function* ({ query, response }) {
+                const { url } = query;
+                const resp = yield fetch(url);
+                response.setHeader('Content-Type', resp.headers.get('Content-Type'));
+                //@ts-ignore
+                Readable.fromWeb(resp.body).pipe(response.blobStream());
+                return null;
+            })
+        });
     }
 }

package/index.ts

@@ -2,7 +2,8 @@
 import { PluginOptions } from './types.js';
 import { getSignedUrl } from '@aws-sdk/s3-request-presigner';
 import { ExpirationStatus, GetObjectCommand, ObjectCannedACL, PutObjectCommand, S3 } from '@aws-sdk/client-s3';
-import { AdminForthPlugin, AdminForthResourceColumn, AdminForthResourcePages, IAdminForth, IHttpServer } from "adminforth";
+import { AdminForthPlugin, AdminForthResourceColumn, AdminForthResourcePages, IAdminForth, IHttpServer, suggestIfTypo } from "adminforth";
+import { Readable } from "stream";
 
 const ADMINFORTH_NOT_YET_USED_TAG = 'adminforth-candidate-for-cleanup';
 
@@ -91,18 +92,38 @@ export default class UploadPlugin extends AdminForthPlugin {
   }
 
   async modifyResourceConfig(adminforth: IAdminForth, resourceConfig: any) {
-
     super.modifyResourceConfig(adminforth, resourceConfig);
     // after column to store the path of the uploaded file, add new VirtualColumn,
     // show only in edit and create views
     // use component uploader.vue
     const { pathColumnName } = this.options;
+    const pathColumnIndex = resourceConfig.columns.findIndex((column: any) => column.name === pathColumnName);
+    if (pathColumnIndex === -1) {
+      throw new Error(`Column with name "${pathColumnName}" not found in resource "${resourceConfig.name}"`);
+    }
+
+    if (this.options.generation?.fieldsForContext) {
+      this.options.generation?.fieldsForContext.forEach((field: string) => {
+        if (!resourceConfig.columns.find((column: any) => column.name === field)) {
+          const similar = suggestIfTypo(resourceConfig.columns.map((column: any) => column.name), field);
+          throw new Error(`Field "${field}" specified in fieldsForContext not found in
+ resource "${resourceConfig.label}". ${similar ? `Did you mean "${similar}"?` : ''}`);
+        }
+      });
+    }
 
     const pluginFrontendOptions = {
       allowedExtensions: this.options.allowedFileExtensions,
       maxFileSize: this.options.maxFileSize,
       pluginInstanceId: this.pluginInstanceId,
+      resourceLabel: resourceConfig.label,
+      generateImages: this.options.generation ? true : false,
+      pathColumnLabel: resourceConfig.columns[pathColumnIndex].label,
+      fieldsForContext: this.options.generation?.fieldsForContext,
     };
+    // define components which will be imported from other components
+    this.componentPath('imageGenerator.vue');
+
     const virtualColumn: AdminForthResourceColumn = {
       virtual: true,
       name: `uploader_${this.pluginInstanceId}`,
@@ -121,10 +142,7 @@ export default class UploadPlugin extends AdminForthPlugin {
 
    
 
-    const pathColumnIndex = resourceConfig.columns.findIndex((column: any) => column.name === pathColumnName);
-    if (pathColumnIndex === -1) {
-      throw new Error(`Column with name "${pathColumnName}" not found in resource "${resourceConfig.name}"`);
-    }
+   
     if (!resourceConfig.columns[pathColumnIndex].components) {
       resourceConfig.columns[pathColumnIndex].components = {};
     }
@@ -224,7 +242,7 @@ export default class UploadPlugin extends AdminForthPlugin {
     // ** HOOKS FOR LIST **//
 
 
-    if (this.options.preview?.showInList) {
+    if (this.options.preview?.showInList || this.options.preview?.showInList === undefined) {
       resourceConfig.hooks.list.afterDatasourceResponse.push(async ({ response }: { response: any }) => {
         const s3 = new S3({
           credentials: {
@@ -409,6 +427,86 @@ export default class UploadPlugin extends AdminForthPlugin {
         };
       }
     });
+
+    // generation: {
+    //   provider: 'openai-dall-e',
+    //   countToGenerate: 3,
+    //   openAiOptions: {
+    //     model: 'dall-e-3',
+    //     size: '1792x1024',
+    //     apiKey: process.env.OPENAI_API_KEY as string,
+    //   },
+    // },
+
+  //   curl https://api.openai.com/v1/images/generations \
+  // -H "Content-Type: application/json" \
+  // -H "Authorization: Bearer $OPENAI_API_KEY" \
+  // -d '{
+  //   "model": "dall-e-3",
+  //   "prompt": "A cute baby sea otter",
+  //   "n": 1,
+  //   "size": "1024x1024"
+  // }'
+
+    server.endpoint({
+      method: 'POST',
+      path: `/plugin/${this.pluginInstanceId}/generate_images`,
+      handler: async ({ body }) => {
+        const { prompt } = body;
+
+        if (this.options.generation.provider !== 'openai-dall-e') {
+          throw new Error(`Provider ${this.options.generation.provider} is not supported`);
+        }
+
+        const { model, size, apiKey } = this.options.generation.openAiOptions;
+        const url = 'https://api.openai.com/v1/images/generations';
+
+        let error = null;
+        const images = await Promise.all(
+          (new Array(this.options.generation.countToGenerate)).fill(0).map(async () => {
+            const response = await fetch(url, {
+              method: 'POST',
+              headers: {
+                'Content-Type': 'application/json',
+                'Authorization': `Bearer ${apiKey}`,
+              },
+              body: JSON.stringify({
+                model,
+                prompt,
+                n: 1,
+                size,
+              })
+            });
+
+            const json = await response.json();
+            if (json.error) {
+              console.error('Error generating image', json.error);
+              error = json.error;
+              return;
+            }
+            
+            return json;
+
+          })
+        );
+
+        return { error, images };
+      }
+    });
+
+    server.endpoint({
+      method: 'GET',
+      path: `/plugin/${this.pluginInstanceId}/cors-proxy`,
+      handler: async ({ query, response  }) => {
+        const { url } = query;
+        const resp = await fetch(url);
+        response.setHeader('Content-Type', resp.headers.get('Content-Type'));
+        //@ts-ignore
+        Readable.fromWeb( resp.body ).pipe( response.blobStream() );
+        return null
+      }
+    });
+
   }
 
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adminforth/upload",
-  "version": "1.0.14",
+  "version": "1.0.16",
   "description": "",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

package/types.ts

@@ -85,4 +85,49 @@ export type PluginOptions = {
      */ 
     previewUrl?: ({s3Path}) => string,
   }
+
+
+  /**
+   * AI image generation options
+   */
+  generation?: {
+    /**
+     * The provider to use for image generation
+     * for now only 'openai-dall-e' is supported
+     */
+    provider: string,
+
+    /**
+     * The number of images to generate
+     * in one request
+     */
+    countToGenerate: number,
+
+    /**
+     * Options for OpenAI
+     */
+    openAiOptions: {
+      /**
+       * The model to use, e.g. 'dall-e-3'
+       */
+      model: string,
+
+      /**
+       * The size of the image to generate, e.g. '1792x1024'
+       */
+      size: string,
+
+      /**
+       * The OpenAI API key
+       */
+      apiKey: string,
+    },
+
+    /**
+     * Fields of record to use for context. if supplied must be array of valid column names for resource
+     * where plugin is used.
+     */
+    fieldsForContext? : string[],
+  }
+
 }