@adminforth/upload 1.0.22 → 1.0.23

package/custom/preview.vue

@@ -5,6 +5,7 @@
         v-if="contentType && contentType.startsWith('image')"
         :src="url" 
         class="rounded-md" 
+        :style="maxWidth"
         ref="img"
         data-zoomable
         @click.stop="zoom.open()" 
@@ -70,6 +71,8 @@ const url = computed(() => {
   return props.record[`previewUrl_${props.meta.pluginInstanceId}`];
 });
 
+const maxWidth = computed(() => props.meta.maxWidth ? { maxWidth: props.meta.maxWidth } : {});
+
 
 // since we have no way to know the content type of the file, we will try to guess it from extension
 // for better experience probably we should check whether user saves content type in the database and use it here

package/dist/custom/preview.vue

@@ -5,6 +5,7 @@
         v-if="contentType && contentType.startsWith('image')"
         :src="url" 
         class="rounded-md" 
+        :style="maxWidth"
         ref="img"
         data-zoomable
         @click.stop="zoom.open()" 
@@ -70,6 +71,8 @@ const url = computed(() => {
   return props.record[`previewUrl_${props.meta.pluginInstanceId}`];
 });
 
+const maxWidth = computed(() => props.meta.maxWidth ? { maxWidth: props.meta.maxWidth } : {});
+
 
 // since we have no way to know the content type of the file, we will try to guess it from extension
 // for better experience probably we should check whether user saves content type in the database and use it here

package/dist/index.js

@@ -97,7 +97,7 @@ export default class UploadPlugin extends AdminForthPlugin {
             modifyResourceConfig: { get: () => super.modifyResourceConfig }
         });
         return __awaiter(this, void 0, void 0, function* () {
-            var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+            var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
             _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
@@ -124,6 +124,7 @@ export default class UploadPlugin extends AdminForthPlugin {
                 generateImages: this.options.generation ? true : false,
                 pathColumnLabel: resourceConfig.columns[pathColumnIndex].label,
                 fieldsForContext: (_c = this.options.generation) === null || _c === void 0 ? void 0 : _c.fieldsForContext,
+                maxWidth: (_d = this.options.preview) === null || _d === void 0 ? void 0 : _d.maxWidth,
             };
             // define components which will be imported from other components
             this.componentPath('imageGenerator.vue');
@@ -145,14 +146,14 @@ export default class UploadPlugin extends AdminForthPlugin {
             if (!resourceConfig.columns[pathColumnIndex].components) {
                 resourceConfig.columns[pathColumnIndex].components = {};
             }
-            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) {
+            if (((_e = this.options.preview) === null || _e === void 0 ? void 0 : _e.showInList) || ((_f = this.options.preview) === null || _f === void 0 ? void 0 : _f.showInList) === undefined) {
                 // add preview column to list
                 resourceConfig.columns[pathColumnIndex].components.list = {
                     file: this.componentPath('preview.vue'),
                     meta: pluginFrontendOptions,
                 };
             }
-            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) {
+            if (((_g = this.options.preview) === null || _g === void 0 ? void 0 : _g.showInShow) || ((_h = this.options.preview) === null || _h === void 0 ? void 0 : _h.showInShow) === undefined) {
                 resourceConfig.columns[pathColumnIndex].components.show = {
                     file: this.componentPath('preview.vue'),
                     meta: pluginFrontendOptions,
@@ -173,7 +174,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((_k) => __awaiter(this, [_k], void 0, function* ({ record }) {
+            resourceConfig.hooks.create.beforeSave.push((_l) => __awaiter(this, [_l], void 0, function* ({ record }) {
                 if (record[virtualColumn.name]) {
                     record[pathColumnName] = record[virtualColumn.name];
                     delete record[virtualColumn.name];
@@ -181,7 +182,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((_l) => __awaiter(this, [_l], void 0, function* ({ record }) {
+            resourceConfig.hooks.create.afterSave.push((_m) => __awaiter(this, [_m], 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({
@@ -205,7 +206,7 @@ export default class UploadPlugin extends AdminForthPlugin {
             }));
             // ** HOOKS FOR SHOW **//
             // add show hook to get presigned URL
-            resourceConfig.hooks.show.afterDatasourceResponse.push((_m) => __awaiter(this, [_m], void 0, function* ({ response }) {
+            resourceConfig.hooks.show.afterDatasourceResponse.push((_o) => __awaiter(this, [_o], void 0, function* ({ response }) {
                 const record = response[0];
                 if (!record) {
                     return { ok: true };
@@ -223,8 +224,8 @@ export default class UploadPlugin extends AdminForthPlugin {
                 return { ok: true };
             }));
             // ** HOOKS FOR LIST **//
-            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 }) {
+            if (((_j = this.options.preview) === null || _j === void 0 ? void 0 : _j.showInList) || ((_k = this.options.preview) === null || _k === void 0 ? void 0 : _k.showInList) === undefined) {
+                resourceConfig.hooks.list.afterDatasourceResponse.push((_p) => __awaiter(this, [_p], void 0, function* ({ response }) {
                     const s3 = new S3({
                         credentials: {
                             accessKeyId: this.options.s3AccessKeyId,
@@ -242,7 +243,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((_p) => __awaiter(this, [_p], void 0, function* ({ record }) {
+            resourceConfig.hooks.delete.afterSave.push((_q) => __awaiter(this, [_q], void 0, function* ({ record }) {
                 if (record[pathColumnName]) {
                     const s3 = new S3({
                         credentials: {
@@ -274,7 +275,7 @@ export default class UploadPlugin extends AdminForthPlugin {
             }));
             // ** HOOKS FOR EDIT **//
             // beforeSave
-            resourceConfig.hooks.edit.beforeSave.push((_q) => __awaiter(this, [_q], void 0, function* ({ record }) {
+            resourceConfig.hooks.edit.beforeSave.push((_r) => __awaiter(this, [_r], void 0, function* ({ record }) {
                 // null is when value is removed
                 if (record[virtualColumn.name] || record[virtualColumn.name] === null) {
                     record[pathColumnName] = record[virtualColumn.name];
@@ -282,7 +283,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((_r) => __awaiter(this, [_r], void 0, function* ({ record, oldRecord }) {
+            resourceConfig.hooks.edit.afterSave.push((_s) => __awaiter(this, [_s], void 0, function* ({ record, oldRecord }) {
                 if (record[virtualColumn.name] || record[virtualColumn.name] === null) {
                     const s3 = new S3({
                         credentials: {

package/index.ts

@@ -123,6 +123,7 @@ export default class UploadPlugin extends AdminForthPlugin {
       generateImages: this.options.generation ? true : false,
       pathColumnLabel: resourceConfig.columns[pathColumnIndex].label,
       fieldsForContext: this.options.generation?.fieldsForContext,
+      maxWidth: this.options.preview?.maxWidth,
     };
     // define components which will be imported from other components
     this.componentPath('imageGenerator.vue');

package/package.json

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

package/types.ts

@@ -71,6 +71,11 @@ export type PluginOptions = {
      */
     showInShow?: boolean,
 
+    /**
+     * Maximum width of the preview image
+     */
+    maxWidth?: string,
+
     /**
      * Used to display preview (if it is image) in list and show views.
      * Defaulted to the AWS S3 presigned URL if resource is private or public URL if resource is public.