@adminforth/upload 1.0.6 → 1.0.7

package/dist/index.js

@@ -0,0 +1,307 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import AWS from 'aws-sdk';
+import { AdminForthPlugin, AdminForthResourcePages } from "adminforth";
+const ADMINFORTH_NOT_YET_USED_TAG = 'adminforth-candidate-for-cleanup';
+export default class UploadPlugin extends AdminForthPlugin {
+    constructor(options) {
+        super(options, import.meta.url);
+        this.options = options;
+    }
+    setupLifecycleRule() {
+        return __awaiter(this, void 0, void 0, function* () {
+            // check that lifecyle rule "adminforth-unused-cleaner" exists
+            const CLEANUP_RULE_ID = 'adminforth-unused-cleaner';
+            const s3 = new AWS.S3({
+                accessKeyId: this.options.s3AccessKeyId,
+                secretAccessKey: this.options.s3SecretAccessKey,
+                region: this.options.s3Region
+            });
+            // check bucket exists
+            const bucketExists = s3.headBucket({ Bucket: this.options.s3Bucket }).promise();
+            if (!bucketExists) {
+                throw new Error(`Bucket ${this.options.s3Bucket} does not exist`);
+            }
+            // check that lifecycle rule exists
+            let ruleExists = false;
+            try {
+                const lifecycleConfig = yield s3.getBucketLifecycleConfiguration({ Bucket: this.options.s3Bucket }).promise();
+                ruleExists = lifecycleConfig.Rules.some((rule) => rule.ID === CLEANUP_RULE_ID);
+            }
+            catch (e) {
+                if (e.code !== 'NoSuchLifecycleConfiguration') {
+                    throw e;
+                }
+                else {
+                    ruleExists = false;
+                }
+            }
+            if (!ruleExists) {
+                // create
+                // rule deletes object has tag adminforth-candidate-for-cleanup = true after 2 days
+                const params = {
+                    Bucket: this.options.s3Bucket,
+                    LifecycleConfiguration: {
+                        Rules: [
+                            {
+                                ID: CLEANUP_RULE_ID,
+                                Status: 'Enabled',
+                                Filter: {
+                                    Tag: {
+                                        Key: ADMINFORTH_NOT_YET_USED_TAG,
+                                        Value: 'true'
+                                    }
+                                },
+                                Expiration: {
+                                    Days: 2
+                                }
+                            }
+                        ]
+                    }
+                };
+                yield s3.putBucketLifecycleConfiguration(params).promise();
+            }
+        });
+    }
+    genPreviewUrl(record, s3) {
+        return __awaiter(this, void 0, void 0, function* () {
+            var _a;
+            if ((_a = this.options.preview) === null || _a === void 0 ? void 0 : _a.previewUrl) {
+                record[`previewUrl_${this.pluginInstanceId}`] = this.options.preview.previewUrl({ s3Path: record[this.options.pathColumnName] });
+                return;
+            }
+            const previewUrl = yield s3.getSignedUrl('getObject', {
+                Bucket: this.options.s3Bucket,
+                Key: record[this.options.pathColumnName],
+            });
+            record[`previewUrl_${this.pluginInstanceId}`] = previewUrl;
+        });
+    }
+    modifyResourceConfig(adminforth, resourceConfig) {
+        const _super = Object.create(null, {
+            modifyResourceConfig: { get: () => super.modifyResourceConfig }
+        });
+        return __awaiter(this, void 0, void 0, function* () {
+            var _a, _b, _c;
+            this.setupLifecycleRule();
+            _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 pluginFrontendOptions = {
+                allowedExtensions: this.options.allowedFileExtensions,
+                maxFileSize: this.options.maxFileSize,
+                pluginInstanceId: this.pluginInstanceId,
+            };
+            const virtualColumn = {
+                virtual: true,
+                name: `uploader_${this.pluginInstanceId}`,
+                components: Object.assign({ edit: {
+                        file: this.componentPath('uploader.vue'),
+                        meta: pluginFrontendOptions,
+                    }, create: {
+                        file: this.componentPath('uploader.vue'),
+                        meta: pluginFrontendOptions,
+                    }, show: {
+                        file: this.componentPath('preview.vue'),
+                        meta: pluginFrontendOptions,
+                    } }, (((_a = this.options.preview) === null || _a === void 0 ? void 0 : _a.showInList) ? {
+                    list: {
+                        file: this.componentPath('preview.vue'),
+                        meta: pluginFrontendOptions,
+                    }
+                } : {})),
+                showIn: ['edit', 'create', 'show', ...(((_b = this.options.preview) === null || _b === void 0 ? void 0 : _b.showInList) ? [
+                        AdminForthResourcePages.list
+                    ] : [])],
+            };
+            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}"`);
+            }
+            // insert virtual column after path column if it is not already there
+            const virtualColumnIndex = resourceConfig.columns.findIndex((column) => column.name === virtualColumn.name);
+            if (virtualColumnIndex === -1) {
+                resourceConfig.columns.splice(pathColumnIndex + 1, 0, virtualColumn);
+            }
+            // if showIn of path column has 'create' or 'edit' remove it
+            const pathColumn = resourceConfig.columns[pathColumnIndex];
+            if (pathColumn.showIn && (pathColumn.showIn.includes('create') || pathColumn.showIn.includes('edit'))) {
+                pathColumn.showIn = pathColumn.showIn.filter((view) => !['create', 'edit'].includes(view));
+            }
+            virtualColumn.required = pathColumn.required;
+            virtualColumn.label = pathColumn.label;
+            virtualColumn.editingNote = pathColumn.editingNote;
+            // ** HOOKS FOR CREATE **//
+            // add beforeSave hook to save virtual column to path column
+            resourceConfig.hooks.create.beforeSave.push((_d) => __awaiter(this, [_d], void 0, function* ({ record }) {
+                if (record[virtualColumn.name]) {
+                    record[pathColumnName] = record[virtualColumn.name];
+                    delete record[virtualColumn.name];
+                }
+                return { ok: true };
+            }));
+            // in afterSave hook, aremove tag adminforth-not-yet-used from the file
+            resourceConfig.hooks.create.afterSave.push((_e) => __awaiter(this, [_e], void 0, function* ({ record }) {
+                if (record[pathColumnName]) {
+                    const s3 = new AWS.S3({
+                        accessKeyId: this.options.s3AccessKeyId,
+                        secretAccessKey: this.options.s3SecretAccessKey,
+                        region: this.options.s3Region
+                    });
+                    yield s3.putObjectTagging({
+                        Bucket: this.options.s3Bucket,
+                        Key: record[pathColumnName],
+                        Tagging: {
+                            TagSet: []
+                        }
+                    }).promise();
+                }
+                return { ok: true };
+            }));
+            // ** HOOKS FOR SHOW **//
+            // add show hook to get presigned URL
+            resourceConfig.hooks.show.afterDatasourceResponse.push((_f) => __awaiter(this, [_f], void 0, function* ({ response }) {
+                const record = response[0];
+                if (!record) {
+                    return { ok: true };
+                }
+                if (record[pathColumnName]) {
+                    const s3 = new AWS.S3({
+                        accessKeyId: this.options.s3AccessKeyId,
+                        secretAccessKey: this.options.s3SecretAccessKey,
+                        region: this.options.s3Region
+                    });
+                    yield this.genPreviewUrl(record, s3);
+                }
+                return { ok: true };
+            }));
+            // ** HOOKS FOR LIST **//
+            if ((_c = this.options.preview) === null || _c === void 0 ? void 0 : _c.showInList) {
+                resourceConfig.hooks.list.afterDatasourceResponse.push((_g) => __awaiter(this, [_g], void 0, function* ({ response }) {
+                    const s3 = new AWS.S3({
+                        accessKeyId: this.options.s3AccessKeyId,
+                        secretAccessKey: this.options.s3SecretAccessKey,
+                        region: this.options.s3Region
+                    });
+                    yield Promise.all(response.map((record) => __awaiter(this, void 0, void 0, function* () {
+                        if (record[this.options.pathColumnName]) {
+                            yield this.genPreviewUrl(record, s3);
+                        }
+                    })));
+                    return { ok: true };
+                }));
+            }
+            // ** HOOKS FOR DELETE **//
+            // add delete hook which sets tag adminforth-candidate-for-cleanup to true
+            resourceConfig.hooks.delete.beforeSave.push((_h) => __awaiter(this, [_h], void 0, function* ({ record }) {
+                if (record[pathColumnName]) {
+                    const s3 = new AWS.S3({
+                        accessKeyId: this.options.s3AccessKeyId,
+                        secretAccessKey: this.options.s3SecretAccessKey,
+                        region: this.options.s3Region
+                    });
+                    yield s3.putObjectTagging({
+                        Bucket: this.options.s3Bucket,
+                        Key: record[pathColumnName],
+                        Tagging: {
+                            TagSet: [
+                                {
+                                    Key: ADMINFORTH_NOT_YET_USED_TAG,
+                                    Value: 'true'
+                                }
+                            ]
+                        }
+                    }).promise();
+                }
+                return { ok: true };
+            }));
+            // ** HOOKS FOR EDIT **//
+            // beforeSave
+            resourceConfig.hooks.edit.beforeSave.push((_j) => __awaiter(this, [_j], void 0, function* ({ record }) {
+                // null is when value is removed
+                if (record[virtualColumn.name] || record[virtualColumn.name] === null) {
+                    record[pathColumnName] = record[virtualColumn.name];
+                }
+                return { ok: true };
+            }));
+            // add edit postSave hook to delete old file and remove tag from new file
+            resourceConfig.hooks.edit.afterSave.push((_k) => __awaiter(this, [_k], void 0, function* ({ record, oldRecord }) {
+                if (record[virtualColumn.name] || record[virtualColumn.name] === null) {
+                    const s3 = new AWS.S3({
+                        accessKeyId: this.options.s3AccessKeyId,
+                        secretAccessKey: this.options.s3SecretAccessKey,
+                        region: this.options.s3Region
+                    });
+                    if (oldRecord[pathColumnName]) {
+                        // put tag to delete old file
+                        yield s3.putObjectTagging({
+                            Bucket: this.options.s3Bucket,
+                            Key: oldRecord[pathColumnName],
+                            Tagging: {
+                                TagSet: [
+                                    {
+                                        Key: ADMINFORTH_NOT_YET_USED_TAG,
+                                        Value: 'true'
+                                    }
+                                ]
+                            }
+                        }).promise();
+                    }
+                    if (record[virtualColumn.name] !== null) {
+                        // remove tag from new file
+                        yield s3.putObjectTagging({
+                            Bucket: this.options.s3Bucket,
+                            Key: record[pathColumnName],
+                            Tagging: {
+                                TagSet: []
+                            }
+                        }).promise();
+                    }
+                }
+                return { ok: true };
+            }));
+        });
+    }
+    setupEndpoints(server) {
+        server.endpoint({
+            method: 'POST',
+            path: `/plugin/${this.pluginInstanceId}/get_s3_upload_url`,
+            handler: (_a) => __awaiter(this, [_a], void 0, function* ({ body }) {
+                const { originalFilename, contentType, size, originalExtension } = body;
+                if (this.options.allowedFileExtensions && !this.options.allowedFileExtensions.includes(originalExtension)) {
+                    throw new Error(`File extension "${originalExtension}" is not allowed, allowed extensions are: ${this.options.allowedFileExtensions.join(', ')}`);
+                }
+                const s3Path = this.options.s3Path({ originalFilename, originalExtension, contentType });
+                if (s3Path.startsWith('/')) {
+                    throw new Error('s3Path should not start with /, please adjust s3path function to not return / at the start of the path');
+                }
+                const s3 = new AWS.S3({
+                    accessKeyId: this.options.s3AccessKeyId,
+                    secretAccessKey: this.options.s3SecretAccessKey,
+                    region: this.options.s3Region
+                });
+                const params = {
+                    Bucket: this.options.s3Bucket,
+                    Key: s3Path,
+                    ContentType: contentType,
+                    ACL: this.options.s3ACL || 'private',
+                    Tagging: `${ADMINFORTH_NOT_YET_USED_TAG}=true`,
+                };
+                const uploadUrl = yield s3.getSignedUrl('putObject', params);
+                return {
+                    uploadUrl,
+                    s3Path,
+                };
+            })
+        });
+    }
+}

package/dist/types.js

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -1,11 +1,13 @@
 {
   "name": "@adminforth/upload",
-  "version": "1.0.6",
+  "version": "1.0.7",
   "description": "",
-  "main": "index.js",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
   "scripts": {
     "rollout": "tsc && cp -rf custom dist/ && npm version patch && npm publish --access public",
-    "postinstall": "npm link adminforth"
+    "postinstall": "npm link adminforth",
+    "build": "tsc"
   },
   "type": "module",
   "author": "",

package/tsconfig.json

@@ -0,0 +1,112 @@
+{
+  "compilerOptions": {
+    /* Visit https://aka.ms/tsconfig to read more about this file */
+
+    /* Projects */
+    // "incremental": true,                              /* Save .tsbuildinfo files to allow for incremental compilation of projects. */
+    // "composite": true,                                /* Enable constraints that allow a TypeScript project to be used with project references. */
+    // "tsBuildInfoFile": "./.tsbuildinfo",              /* Specify the path to .tsbuildinfo incremental compilation file. */
+    // "disableSourceOfProjectReferenceRedirect": true,  /* Disable preferring source files instead of declaration files when referencing composite projects. */
+    // "disableSolutionSearching": true,                 /* Opt a project out of multi-project reference checking when editing. */
+    // "disableReferencedProjectLoad": true,             /* Reduce the number of projects loaded automatically by TypeScript. */
+
+
+    /* Language and Environment */
+    "target": "es2016",                                  /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */
+    // "lib": [],                                        /* Specify a set of bundled library declaration files that describe the target runtime environment. */
+    // "jsx": "preserve",                                /* Specify what JSX code is generated. */
+    // "experimentalDecorators": true,                   /* Enable experimental support for legacy experimental decorators. */
+    // "emitDecoratorMetadata": true,                    /* Emit design-type metadata for decorated declarations in source files. */
+    // "jsxFactory": "",                                 /* Specify the JSX factory function used when targeting React JSX emit, e.g. 'React.createElement' or 'h'. */
+    // "jsxFragmentFactory": "",                         /* Specify the JSX Fragment reference used for fragments when targeting React JSX emit e.g. 'React.Fragment' or 'Fragment'. */
+    // "jsxImportSource": "",                            /* Specify module specifier used to import the JSX factory functions when using 'jsx: react-jsx*'. */
+    // "reactNamespace": "",                             /* Specify the object invoked for 'createElement'. This only applies when targeting 'react' JSX emit. */
+    // "noLib": true,                                    /* Disable including any library files, including the default lib.d.ts. */
+    // "useDefineForClassFields": true,                  /* Emit ECMAScript-standard-compliant class fields. */
+    // "moduleDetection": "auto",                        /* Control what method is used to detect module-format JS files. */
+
+    /* Modules */
+    // changed from commmonjs to node16 because The 'import.meta' meta-property is only allowed when the '--module' option is 'es2020', 'es2022', 'esnext', 'system', 'node16', or 'nodenext'.
+    "module": "node16",                                /* Specify what module code is generated. */
+    // "rootDir": "./",                                  /* Specify the root folder within your source files. */
+    // "moduleResolution": "node10",                     /* Specify how TypeScript looks up a file from a given module specifier. */
+    // "baseUrl": "./",                                  /* Specify the base directory to resolve non-relative module names. */
+    // "paths": {},                                      /* Specify a set of entries that re-map imports to additional lookup locations. */
+    // "rootDirs": [],                                   /* Allow multiple folders to be treated as one when resolving modules. */
+    // "typeRoots": [],                                  /* Specify multiple folders that act like './node_modules/@types'. */
+    // "types": [],                                      /* Specify type package names to be included without being referenced in a source file. */
+    // "allowUmdGlobalAccess": true,                     /* Allow accessing UMD globals from modules. */
+    // "moduleSuffixes": [],                             /* List of file name suffixes to search when resolving a module. */
+    // "allowImportingTsExtensions": true,               /* Allow imports to include TypeScript file extensions. Requires '--moduleResolution bundler' and either '--noEmit' or '--emitDeclarationOnly' to be set. */
+    // "resolvePackageJsonExports": true,                /* Use the package.json 'exports' field when resolving package imports. */
+    // "resolvePackageJsonImports": true,                /* Use the package.json 'imports' field when resolving imports. */
+    // "customConditions": [],                           /* Conditions to set in addition to the resolver-specific defaults when resolving imports. */
+    // "resolveJsonModule": true,                        /* Enable importing .json files. */
+    // "allowArbitraryExtensions": true,                 /* Enable importing files with any extension, provided a declaration file is present. */
+    // "noResolve": true,                                /* Disallow 'import's, 'require's or '<reference>'s from expanding the number of files TypeScript should add to a project. */
+
+    /* JavaScript Support */
+    // "allowJs": true,                                  /* Allow JavaScript files to be a part of your program. Use the 'checkJS' option to get errors from these files. */
+    // "checkJs": true,                                  /* Enable error reporting in type-checked JavaScript files. */
+    // "maxNodeModuleJsDepth": 1,                        /* Specify the maximum folder depth used for checking JavaScript files from 'node_modules'. Only applicable with 'allowJs'. */
+
+    /* Emit */
+    // "declaration": true,                              /* Generate .d.ts files from TypeScript and JavaScript files in your project. */
+    // "declarationMap": true,                           /* Create sourcemaps for d.ts files. */
+    // "emitDeclarationOnly": true,                      /* Only output d.ts files and not JavaScript files. */
+    // "sourceMap": true,                                /* Create source map files for emitted JavaScript files. */
+    // "inlineSourceMap": true,                          /* Include sourcemap files inside the emitted JavaScript. */
+    // "outFile": "./",                                  /* Specify a file that bundles all outputs into one JavaScript file. If 'declaration' is true, also designates a file that bundles all .d.ts output. */
+    "outDir": "./dist",                                   /* Specify an output folder for all emitted files. */
+    // "removeComments": true,                           /* Disable emitting comments. */
+    // "noEmit": true,                                   /* Disable emitting files from a compilation. */
+    // "importHelpers": true,                            /* Allow importing helper functions from tslib once per project, instead of including them per-file. */
+    // "importsNotUsedAsValues": "remove",               /* Specify emit/checking behavior for imports that are only used for types. */
+    // "downlevelIteration": true,                       /* Emit more compliant, but verbose and less performant JavaScript for iteration. */
+    // "sourceRoot": "",                                 /* Specify the root path for debuggers to find the reference source code. */
+    // "mapRoot": "",                                    /* Specify the location where debugger should locate map files instead of generated locations. */
+    // "inlineSources": true,                            /* Include source code in the sourcemaps inside the emitted JavaScript. */
+    // "emitBOM": true,                                  /* Emit a UTF-8 Byte Order Mark (BOM) in the beginning of output files. */
+    // "newLine": "crlf",                                /* Set the newline character for emitting files. */
+    // "stripInternal": true,                            /* Disable emitting declarations that have '@internal' in their JSDoc comments. */
+    // "noEmitHelpers": true,                            /* Disable generating custom helper functions like '__extends' in compiled output. */
+    // "noEmitOnError": true,                            /* Disable emitting files if any type checking errors are reported. */
+    // "preserveConstEnums": true,                       /* Disable erasing 'const enum' declarations in generated code. */
+    // "declarationDir": "./",                           /* Specify the output directory for generated declaration files. */
+    // "preserveValueImports": true,                     /* Preserve unused imported values in the JavaScript output that would otherwise be removed. */
+
+    /* Interop Constraints */
+    // "isolatedModules": true,                          /* Ensure that each file can be safely transpiled without relying on other imports. */
+    // "verbatimModuleSyntax": true,                     /* Do not transform or elide any imports or exports not marked as type-only, ensuring they are written in the output file's format based on the 'module' setting. */
+    // "allowSyntheticDefaultImports": true,             /* Allow 'import x from y' when a module doesn't have a default export. */
+    "esModuleInterop": true,                             /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables 'allowSyntheticDefaultImports' for type compatibility. */
+    // "preserveSymlinks": true,                         /* Disable resolving symlinks to their realpath. This correlates to the same flag in node. */
+    "forceConsistentCasingInFileNames": true,            /* Ensure that casing is correct in imports. */
+
+    /* Type Checking */
+    "strict": false,   /* TODO */                                   /* Enable all strict type-checking options. */
+    // "noImplicitAny": true,                            /* Enable error reporting for expressions and declarations with an implied 'any' type. */
+    // "strictNullChecks": true,                         /* When type checking, take into account 'null' and 'undefined'. */
+    // "strictFunctionTypes": true,                      /* When assigning functions, check to ensure parameters and the return values are subtype-compatible. */
+    // "strictBindCallApply": true,                      /* Check that the arguments for 'bind', 'call', and 'apply' methods match the original function. */
+    // "strictPropertyInitialization": true,             /* Check for class properties that are declared but not set in the constructor. */
+    // "noImplicitThis": true,                           /* Enable error reporting when 'this' is given the type 'any'. */
+    // "useUnknownInCatchVariables": true,               /* Default catch clause variables as 'unknown' instead of 'any'. */
+    // "alwaysStrict": true,                             /* Ensure 'use strict' is always emitted. */
+    // "noUnusedLocals": true,                           /* Enable error reporting when local variables aren't read. */
+    // "noUnusedParameters": true,                       /* Raise an error when a function parameter isn't read. */
+    // "exactOptionalPropertyTypes": true,               /* Interpret optional property types as written, rather than adding 'undefined'. */
+    // "noImplicitReturns": true,                        /* Enable error reporting for codepaths that do not explicitly return in a function. */
+    // "noFallthroughCasesInSwitch": true,               /* Enable error reporting for fallthrough cases in switch statements. */
+    // "noUncheckedIndexedAccess": true,                 /* Add 'undefined' to a type when accessed using an index. */
+    // "noImplicitOverride": true,                       /* Ensure overriding members in derived classes are marked with an override modifier. */
+    // "noPropertyAccessFromIndexSignature": true,       /* Enforces using indexed accessors for keys declared using an indexed type. */
+    // "allowUnusedLabels": true,                        /* Disable error reporting for unused labels. */
+    // "allowUnreachableCode": true,                     /* Disable error reporting for unreachable code. */
+
+    /* Completeness */
+    // "skipDefaultLibCheck": true,                      /* Skip type checking .d.ts files that are included with TypeScript. */
+    "skipLibCheck": true,                                 /* Skip type checking all .d.ts files. */
+  },
+  "exclude": ["node_modules", "dist", "custom"],           /* Exclude files from compilation. */
+}

package/dist/package-lock.json

@@ -1,21 +0,0 @@
-{
-  "name": "custom",
-  "version": "1.0.0",
-  "lockfileVersion": 3,
-  "requires": true,
-  "packages": {
-    "": {
-      "name": "custom",
-      "version": "1.0.0",
-      "license": "ISC",
-      "dependencies": {
-        "medium-zoom": "^1.1.0"
-      }
-    },
-    "node_modules/medium-zoom": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/medium-zoom/-/medium-zoom-1.1.0.tgz",
-      "integrity": "sha512-ewyDsp7k4InCUp3jRmwHBRFGyjBimKps/AJLjRSox+2q/2H4p/PNpQf+pwONWlJiOudkBXtbdmVbFjqyybfTmQ=="
-    }
-  }
-}

package/dist/package.json

@@ -1,15 +0,0 @@
-{
-  "name": "custom",
-  "version": "1.0.0",
-  "description": "",
-  "main": "index.js",
-  "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
-  },
-  "keywords": [],
-  "author": "",
-  "license": "ISC",
-  "dependencies": {
-    "medium-zoom": "^1.1.0"
-  }
-}

package/dist/preview.vue

@@ -1,56 +0,0 @@
-<template>
-  <div>
-    <img v-if="url" :src="url" 
-      class="rounded-md" 
-      ref="img"
-      data-zoomable
-      @click.stop="zoom.open()"  
-    />
-  </div>
-</template>
-
-<style>
-  .medium-zoom-image {
-    z-index: 999999;
-    background: rgba(0, 0, 0, 0.8);
-  }
-  .medium-zoom-overlay {
-    background: rgba(255, 255, 255, 0.8) !important
-  }
-  body.medium-zoom--opened aside {
-    filter: grayscale(1)
-  } 
-</style>
-
-<style scoped>
-  img {
-    min-width: 200px;
-  }
-</style>
-<script setup>
-import { ref, computed , onMounted, watch} from 'vue'
-import mediumZoom from 'medium-zoom'
-
-const img = ref(null);
-
-const props = defineProps({
-  record: Object,
-  column: Object,
-  meta: Object,
-})
-
-const url = computed(() => {
-  return props.record[`previewUrl_${props.meta.pluginInstanceId}`];
-});
-
-const zoom = ref(null);
-
-onMounted(() => {
-  zoom.value = mediumZoom(img.value, {
-    margin: 24,
-    // container: '#app',
-  });
-  console.log('mounted', props.meta)
-});
-
-</script>

package/dist/uploader.vue

@@ -1,163 +0,0 @@
-<template>
-  <div class="flex items-center justify-center w-full">
-      <label for="dropzone-file" class="flex flex-col items-center justify-center w-full h-64 border-2 border-gray-300 border-dashed rounded-lg cursor-pointer bg-gray-50 dark:hover:bg-gray-800 dark:bg-gray-700 hover:bg-gray-100 dark:border-gray-600 dark:hover:border-gray-500 dark:hover:bg-gray-600">
-          <div class="flex flex-col items-center justify-center pt-5 pb-6">
-              <img v-if="imgPreview" :src="imgPreview" class="w-100 mt-4 rounded-lg h-40 object-contain" />
-
-              <svg v-else class="w-8 h-8 mb-4 text-gray-500 dark:text-gray-400" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 16">
-                  <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 13h3a3 3 0 0 0 0-6h-.025A5.56 5.56 0 0 0 16 6.5 5.5 5.5 0 0 0 5.207 5.021C5.137 5.017 5.071 5 5 5a4 4 0 0 0 0 8h2.167M10 15V6m0 0L8 8m2-2 2 2"/>
-              </svg>
-
-              <template v-if="!uploaded">
-                <p class="mb-2 text-sm text-gray-500 dark:text-gray-400"><span class="font-semibold">Click to upload</span> or drag and drop</p>
-                <p class="text-xs text-gray-500 dark:text-gray-400">
-                  {{ allowedExtensionsLabel }} {{ meta.maxFileSize ? `(up to ${maxFileSizeHumanized})` : '' }}
-                </p>
-              </template>
-
-              <div class="w-full bg-gray-200 rounded-full dark:bg-gray-700 mt-1 mb-2" v-if="progress > 0 && !uploaded">
-                <div class="bg-blue-600 text-xs font-medium text-blue-100 text-center p-0.5 leading-none rounded-full" 
-                  :style="{width: `${progress}%`}">{{ progress }}%
-                </div>
-              </div>
-
-              <div v-else-if="uploaded" class="flex items-center justify-center w-full mt-1">
-                <svg class="w-4 h-4 text-green-600 dark:text-green-400" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
-                  <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>
-                </svg>
-                <p class="ml-2 text-sm text-green-600 dark:text-green-400">File uploaded</p>
-              </div>
-          </div>
-          <input id="dropzone-file" type="file" class="hidden" @change="onFileChange" />
-      </label>
-  </div> 
-
-</template>
-
-<script setup>
-import { computed, ref } from 'vue'
-import { callAdminForthApi } from '@/utils' 
-
-const props = defineProps({
-  meta: String
-})
-
-const emit = defineEmits(['update:value']);
-
-const imgPreview = ref(null);
-const progress = ref(0);
-
-const uploadedPath = ref(null);
-const uploaded = ref(false);
-
-const allowedExtensionsLabel = computed(() => {
-  const allowedExtensions = props.meta.allowedExtensions || []
-  if (allowedExtensions.length === 0) {
-    return 'Any file type'
-  }
-  // make upper case and write in format EXT1, EXT2 or EXT3
-  let label = allowedExtensions.map(ext => ext.toUpperCase()).join(', ');
-  // last comma to 'or'
-  label = label.replace(/,([^,]*)$/, ' or$1')
-  return label
-});
-
-const maxFileSizeHumanized = computed(() => {
-  let maxFileSize = props.meta.maxFileSize || 0
-  if (maxFileSize === 0) {
-    return ''
-  }
-  // if maxFileSize is in bytes, convert to KB, MB, GB, TB
-  const units = ['B', 'KB', 'MB', 'GB', 'TB']
-  let i = 0
-  while (maxFileSize >= 1024 && i < units.length - 1) {
-    maxFileSize /= 1024
-    i++
-  }
-  return `${maxFileSize.toFixed(2)} ${units[i]}`
-})
-
-const onFileChange = async (e) => {
-  const file = e.target.files[0]
-  if (!file) {
-    imgPreview.value = null;
-    progress.value = 0;
-    uploaded.value = false;
-    return
-  }
-  console.log('File selected:', file);
-
-  // get filename, extension, size, mimeType
-  const { name, size, type } = file;
-
-
-  const extension = name.split('.').pop();
-  console.log('File details:', { name, extension, size, type });
-  // validate file extension
-  const allowedExtensions = props.meta.allowedExtensions || []
-  if (allowedExtensions.length > 0 && !allowedExtensions.includes(extension)) {
-    window.adminforth.alert({
-      message: `Sorry but the file type ${extension} is not allowed. Please upload a file with one of the following extensions: ${allowedExtensionsLabel.value}`,
-      variant: 'danger'
-    });
-    return;
-  }
-
-  // validate file size
-  if (props.meta.maxFileSize && size > props.meta.maxFileSize) {
-    window.adminforth.alert({
-      message: `Sorry but the file size is too large. Please upload a file with a maximum size of ${maxFileSizeHumanized.value}`,
-      variant: 'danger'
-    });
-    return;
-  }
-  // supports preview
-  if (type.startsWith('image/')) {
-    const reader = new FileReader();
-    reader.onload = (e) => {
-      imgPreview.value = e.target.result;
-    }
-    reader.readAsDataURL(file);
-  }
-  
-  const { uploadUrl, previewUrl, s3Path } = await callAdminForthApi({
-      path: `/plugin/${props.meta.pluginInstanceId}/get_s3_upload_url`,
-      method: 'POST',
-      body: {
-        originalFilename: name,
-        contentType: type,
-        size,
-        originalExtension: extension,
-      },
-  });
-
-  console.log('S3 upload URL:', uploadUrl);
-
-  const xhr = new XMLHttpRequest();
-  const success = await new Promise((resolve) => {
-    xhr.upload.onprogress = (e) => {
-      if (e.lengthComputable) {
-        progress.value = Math.round((e.loaded / e.total) * 100);
-      }
-    };
-    xhr.addEventListener('loadend', () => {
-      resolve(xhr.readyState === 4 && xhr.status === 200);
-    });
-    xhr.open('PUT', uploadUrl, true);
-    xhr.setRequestHeader('Content-Type', type);
-    xhr.send(file);
-  });
-  if (!success) {
-    window.adminforth.alert({
-      message: 'Sorry but the file was not be uploaded. Please try again.',
-      variant: 'danger'
-    });
-    return;
-  }
-  uploaded.value = true;
-  emit('update:value', s3Path);
-}
-
-
-
-</script>