@webiny/app-file-manager 6.4.12-beta.4 → 6.5.0-beta.0

package/modules/HeadlessCms/fieldType/FileFieldSettingsModifier.js

@@ -0,0 +1,33 @@
+import { CmsFieldEditorGroupModifier } from "@webiny/app-headless-cms/presentation/fieldEditor/abstractions.js";
+class FileFieldSettingsModifierImpl {
+    shouldApply(context) {
+        return "file" === context.fieldType.type;
+    }
+    modifyForm(form) {
+        form.fields((fields)=>({
+                imagesOnly: fields.boolean().label("Images only").description("Allow only images to be selected").renderer("switch").defaultValue(false)
+            }));
+        form.layout((layout)=>[
+                layout.row("imagesOnly")
+            ]);
+    }
+    mapToForm(field) {
+        return {
+            imagesOnly: field.settings?.imagesOnly ?? false
+        };
+    }
+    mapFromForm(formData, field) {
+        if (!field.settings) field.settings = {};
+        field.settings.imagesOnly = formData.imagesOnly;
+    }
+    constructor(){
+        this.group = "general";
+    }
+}
+const FileFieldSettingsModifier = CmsFieldEditorGroupModifier.createImplementation({
+    implementation: FileFieldSettingsModifierImpl,
+    dependencies: []
+});
+export { FileFieldSettingsModifier };
+
+//# sourceMappingURL=FileFieldSettingsModifier.js.map

package/modules/HeadlessCms/fieldType/FileFieldSettingsModifier.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"modules/HeadlessCms/fieldType/FileFieldSettingsModifier.js","sources":["../../../../src/modules/HeadlessCms/fieldType/FileFieldSettingsModifier.ts"],"sourcesContent":["import { CmsFieldEditorGroupModifier } from \"@webiny/app-headless-cms/presentation/fieldEditor/abstractions.js\";\nimport type {\n    ICmsFieldEditorFormBuilder,\n    ICmsFieldEditorContext\n} from \"@webiny/app-headless-cms/presentation/fieldEditor/abstractions.js\";\nimport type { CmsModelField } from \"@webiny/app-headless-cms-common/types/index.js\";\n\nclass FileFieldSettingsModifierImpl implements CmsFieldEditorGroupModifier.Interface {\n    group = \"general\";\n\n    shouldApply(context: ICmsFieldEditorContext) {\n        return context.fieldType.type === \"file\";\n    }\n\n    modifyForm(form: ICmsFieldEditorFormBuilder) {\n        form.fields(fields => ({\n            imagesOnly: fields\n                .boolean()\n                .label(\"Images only\")\n                .description(\"Allow only images to be selected\")\n                .renderer(\"switch\")\n                .defaultValue(false)\n        }));\n        form.layout(layout => [layout.row(\"imagesOnly\")]);\n    }\n\n    mapToForm(field: CmsModelField) {\n        return { imagesOnly: field.settings?.imagesOnly ?? false };\n    }\n\n    mapFromForm(formData: Record<string, any>, field: CmsModelField) {\n        if (!field.settings) {\n            field.settings = {};\n        }\n        field.settings.imagesOnly = formData.imagesOnly;\n    }\n}\n\nexport const FileFieldSettingsModifier = CmsFieldEditorGroupModifier.createImplementation({\n    implementation: FileFieldSettingsModifierImpl,\n    dependencies: []\n});\n"],"names":["FileFieldSettingsModifierImpl","context","form","fields","layout","field","formData","FileFieldSettingsModifier","CmsFieldEditorGroupModifier"],"mappings":";AAOA,MAAMA;IAGF,YAAYC,OAA+B,EAAE;QACzC,OAAOA,AAA2B,WAA3BA,QAAQ,SAAS,CAAC,IAAI;IACjC;IAEA,WAAWC,IAAgC,EAAE;QACzCA,KAAK,MAAM,CAACC,CAAAA,SAAW;gBACnB,YAAYA,OACP,OAAO,GACP,KAAK,CAAC,eACN,WAAW,CAAC,oCACZ,QAAQ,CAAC,UACT,YAAY,CAAC;YACtB;QACAD,KAAK,MAAM,CAACE,CAAAA,SAAU;gBAACA,OAAO,GAAG,CAAC;aAAc;IACpD;IAEA,UAAUC,KAAoB,EAAE;QAC5B,OAAO;YAAE,YAAYA,MAAM,QAAQ,EAAE,cAAc;QAAM;IAC7D;IAEA,YAAYC,QAA6B,EAAED,KAAoB,EAAE;QAC7D,IAAI,CAACA,MAAM,QAAQ,EACfA,MAAM,QAAQ,GAAG,CAAC;QAEtBA,MAAM,QAAQ,CAAC,UAAU,GAAGC,SAAS,UAAU;IACnD;;aA3BA,KAAK,GAAG;;AA4BZ;AAEO,MAAMC,4BAA4BC,4BAA4B,oBAAoB,CAAC;IACtF,gBAAgBR;IAChB,cAAc,EAAE;AACpB"}

package/modules/HeadlessCms/fieldType/FileFieldType.d.ts

@@ -0,0 +1,25 @@
+import React from "react";
+import { CmsFieldType } from "@webiny/app-headless-cms/presentation/fieldTypes/abstractions.js";
+declare class FileFieldTypeImpl implements CmsFieldType.Interface {
+    type: string;
+    label: string;
+    description: string;
+    icon: React.JSX.Element;
+    allowList: boolean;
+    listLabel: string;
+    allowPredefinedValues: boolean;
+    validators: string[];
+    listValidators: string[];
+    deprecated: boolean;
+    createField(): {
+        type: string;
+        validation: never[];
+        renderer: {
+            name: string;
+        };
+    };
+}
+export declare const FileFieldType: typeof FileFieldTypeImpl & {
+    __abstraction: import("@webiny/di").Abstraction<import("@webiny/app-headless-cms/presentation/fieldTypes/abstractions.js").ICmsFieldType>;
+};
+export {};

package/modules/HeadlessCms/fieldType/FileFieldType.js

@@ -0,0 +1,38 @@
+import react from "react";
+import { ReactComponent } from "@webiny/icons/file_present.svg";
+import { CmsFieldType } from "@webiny/app-headless-cms/presentation/fieldTypes/abstractions.js";
+class FileFieldTypeImpl {
+    createField() {
+        return {
+            type: this.type,
+            validation: [],
+            renderer: {
+                name: ""
+            }
+        };
+    }
+    constructor(){
+        this.type = "file";
+        this.label = "Files";
+        this.description = "Images, videos and other files.";
+        this.icon = /*#__PURE__*/ react.createElement(ReactComponent, null);
+        this.allowList = true;
+        this.listLabel = "Use as a list of files or an image gallery";
+        this.allowPredefinedValues = false;
+        this.validators = [
+            "required"
+        ];
+        this.listValidators = [
+            "minLength",
+            "maxLength"
+        ];
+        this.deprecated = true;
+    }
+}
+const FileFieldType = CmsFieldType.createImplementation({
+    implementation: FileFieldTypeImpl,
+    dependencies: []
+});
+export { FileFieldType };
+
+//# sourceMappingURL=FileFieldType.js.map

package/modules/HeadlessCms/fieldType/FileFieldType.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"modules/HeadlessCms/fieldType/FileFieldType.js","sources":["../../../../src/modules/HeadlessCms/fieldType/FileFieldType.tsx"],"sourcesContent":["import React from \"react\";\nimport { ReactComponent as FileIcon } from \"@webiny/icons/file_present.svg\";\nimport { CmsFieldType } from \"@webiny/app-headless-cms/presentation/fieldTypes/abstractions.js\";\n\nclass FileFieldTypeImpl implements CmsFieldType.Interface {\n    type = \"file\";\n    label = \"Files\";\n    description = \"Images, videos and other files.\";\n    icon = <FileIcon />;\n    allowList = true;\n    listLabel = \"Use as a list of files or an image gallery\";\n    allowPredefinedValues = false;\n    validators = [\"required\"];\n    listValidators = [\"minLength\", \"maxLength\"];\n    // Superseded by the Asset field. Hidden from the palette unless a model already\n    // uses a file field, so existing models remain editable (backwards compatible).\n    deprecated = true;\n\n    createField() {\n        return {\n            type: this.type,\n            validation: [],\n            renderer: { name: \"\" }\n        };\n    }\n}\n\nexport const FileFieldType = CmsFieldType.createImplementation({\n    implementation: FileFieldTypeImpl,\n    dependencies: []\n});\n"],"names":["FileFieldTypeImpl","FileIcon","FileFieldType","CmsFieldType"],"mappings":";;;AAIA,MAAMA;IAcF,cAAc;QACV,OAAO;YACH,MAAM,IAAI,CAAC,IAAI;YACf,YAAY,EAAE;YACd,UAAU;gBAAE,MAAM;YAAG;QACzB;IACJ;;aAnBA,IAAI,GAAG;aACP,KAAK,GAAG;aACR,WAAW,GAAG;aACd,IAAI,GAAG,WAAP,GAAO,oBAACC,gBAAQA;aAChB,SAAS,GAAG;aACZ,SAAS,GAAG;aACZ,qBAAqB,GAAG;aACxB,UAAU,GAAG;YAAC;SAAW;aACzB,cAAc,GAAG;YAAC;YAAa;SAAY;aAG3C,UAAU,GAAG;;AASjB;AAEO,MAAMC,gBAAgBC,aAAa,oBAAoB,CAAC;IAC3D,gBAAgBH;IAChB,cAAc,EAAE;AACpB"}

package/modules/HeadlessCms/fieldType/FileInputRenderer.d.ts

@@ -0,0 +1,15 @@
+import { CmsFieldRenderer } from "@webiny/app-headless-cms/presentation/fieldRenderers/abstractions.js";
+import type { CmsModelField } from "@webiny/app-headless-cms-common/types/index.js";
+declare class FileInputRendererImpl implements CmsFieldRenderer.Interface {
+    rendererName: string;
+    formRenderer: string;
+    name: string;
+    description: string;
+    canUse({ field }: {
+        field: CmsModelField;
+    }): boolean;
+}
+export declare const FileInputRenderer: typeof FileInputRendererImpl & {
+    __abstraction: import("@webiny/di").Abstraction<import("@webiny/app-headless-cms/presentation/fieldRenderers/abstractions.js").ICmsFieldRenderer>;
+};
+export {};

package/modules/HeadlessCms/fieldType/FileInputRenderer.js

@@ -0,0 +1,19 @@
+import { CmsFieldRenderer } from "@webiny/app-headless-cms/presentation/fieldRenderers/abstractions.js";
+class FileInputRendererImpl {
+    canUse({ field }) {
+        return "file" === field.type && !field.list;
+    }
+    constructor(){
+        this.rendererName = "file-input";
+        this.formRenderer = "cmsFilePicker";
+        this.name = "File Input";
+        this.description = "Enables selecting a single file via File Manager.";
+    }
+}
+const FileInputRenderer = CmsFieldRenderer.createImplementation({
+    implementation: FileInputRendererImpl,
+    dependencies: []
+});
+export { FileInputRenderer };
+
+//# sourceMappingURL=FileInputRenderer.js.map

package/modules/HeadlessCms/fieldType/FileInputRenderer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"modules/HeadlessCms/fieldType/FileInputRenderer.js","sources":["../../../../src/modules/HeadlessCms/fieldType/FileInputRenderer.ts"],"sourcesContent":["import { CmsFieldRenderer } from \"@webiny/app-headless-cms/presentation/fieldRenderers/abstractions.js\";\nimport type { CmsModelField } from \"@webiny/app-headless-cms-common/types/index.js\";\n\nclass FileInputRendererImpl implements CmsFieldRenderer.Interface {\n    rendererName = \"file-input\";\n    formRenderer = \"cmsFilePicker\";\n    name = \"File Input\";\n    description = \"Enables selecting a single file via File Manager.\";\n\n    canUse({ field }: { field: CmsModelField }) {\n        return field.type === \"file\" && !field.list;\n    }\n}\n\nexport const FileInputRenderer = CmsFieldRenderer.createImplementation({\n    implementation: FileInputRendererImpl,\n    dependencies: []\n});\n"],"names":["FileInputRendererImpl","field","FileInputRenderer","CmsFieldRenderer"],"mappings":";AAGA,MAAMA;IAMF,OAAO,EAAEC,KAAK,EAA4B,EAAE;QACxC,OAAOA,AAAe,WAAfA,MAAM,IAAI,IAAe,CAACA,MAAM,IAAI;IAC/C;;aAPA,YAAY,GAAG;aACf,YAAY,GAAG;aACf,IAAI,GAAG;aACP,WAAW,GAAG;;AAKlB;AAEO,MAAMC,oBAAoBC,iBAAiB,oBAAoB,CAAC;IACnE,gBAAgBH;IAChB,cAAc,EAAE;AACpB"}

package/modules/HeadlessCms/fieldType/FileInputsRenderer.d.ts

@@ -0,0 +1,15 @@
+import { CmsFieldRenderer } from "@webiny/app-headless-cms/presentation/fieldRenderers/abstractions.js";
+import type { CmsModelField } from "@webiny/app-headless-cms-common/types/index.js";
+declare class FileInputsRendererImpl implements CmsFieldRenderer.Interface {
+    rendererName: string;
+    formRenderer: string;
+    name: string;
+    description: string;
+    canUse({ field }: {
+        field: CmsModelField;
+    }): boolean;
+}
+export declare const FileInputsRenderer: typeof FileInputsRendererImpl & {
+    __abstraction: import("@webiny/di").Abstraction<import("@webiny/app-headless-cms/presentation/fieldRenderers/abstractions.js").ICmsFieldRenderer>;
+};
+export {};

package/modules/HeadlessCms/fieldType/FileInputsRenderer.js

@@ -0,0 +1,19 @@
+import { CmsFieldRenderer } from "@webiny/app-headless-cms/presentation/fieldRenderers/abstractions.js";
+class FileInputsRendererImpl {
+    canUse({ field }) {
+        return "file" === field.type && !!field.list;
+    }
+    constructor(){
+        this.rendererName = "file-inputs";
+        this.formRenderer = "cmsMultiFilePicker";
+        this.name = "File Inputs";
+        this.description = "Enables selecting multiple files via File Manager.";
+    }
+}
+const FileInputsRenderer = CmsFieldRenderer.createImplementation({
+    implementation: FileInputsRendererImpl,
+    dependencies: []
+});
+export { FileInputsRenderer };
+
+//# sourceMappingURL=FileInputsRenderer.js.map

package/modules/HeadlessCms/fieldType/FileInputsRenderer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"modules/HeadlessCms/fieldType/FileInputsRenderer.js","sources":["../../../../src/modules/HeadlessCms/fieldType/FileInputsRenderer.ts"],"sourcesContent":["import { CmsFieldRenderer } from \"@webiny/app-headless-cms/presentation/fieldRenderers/abstractions.js\";\nimport type { CmsModelField } from \"@webiny/app-headless-cms-common/types/index.js\";\n\nclass FileInputsRendererImpl implements CmsFieldRenderer.Interface {\n    rendererName = \"file-inputs\";\n    formRenderer = \"cmsMultiFilePicker\";\n    name = \"File Inputs\";\n    description = \"Enables selecting multiple files via File Manager.\";\n\n    canUse({ field }: { field: CmsModelField }) {\n        return field.type === \"file\" && !!field.list;\n    }\n}\n\nexport const FileInputsRenderer = CmsFieldRenderer.createImplementation({\n    implementation: FileInputsRendererImpl,\n    dependencies: []\n});\n"],"names":["FileInputsRendererImpl","field","FileInputsRenderer","CmsFieldRenderer"],"mappings":";AAGA,MAAMA;IAMF,OAAO,EAAEC,KAAK,EAA4B,EAAE;QACxC,OAAOA,AAAe,WAAfA,MAAM,IAAI,IAAe,CAAC,CAACA,MAAM,IAAI;IAChD;;aAPA,YAAY,GAAG;aACf,YAAY,GAAG;aACf,IAAI,GAAG;aACP,WAAW,GAAG;;AAKlB;AAEO,MAAMC,qBAAqBC,iBAAiB,oBAAoB,CAAC;IACpE,gBAAgBH;IAChB,cAAc,EAAE;AACpB"}

package/modules/HeadlessCms/fieldType/feature.d.ts

@@ -0,0 +1 @@
+export declare const FileFieldTypeFeature: import("@webiny/feature/admin").FeatureDefinition<any, []>;

package/modules/HeadlessCms/fieldType/feature.js

@@ -0,0 +1,27 @@
+import { createFeature } from "@webiny/feature/admin";
+import { FileFieldType } from "./FileFieldType.js";
+import { AssetFieldType } from "./AssetFieldType.js";
+import { AssetFormFieldType } from "./AssetFormFieldType.js";
+import { FileFieldSettingsModifier } from "./FileFieldSettingsModifier.js";
+import { AssetFieldSettingsModifier } from "./AssetFieldSettingsModifier.js";
+import { FileInputRenderer } from "./FileInputRenderer.js";
+import { FileInputsRenderer } from "./FileInputsRenderer.js";
+import { AssetInputRenderer } from "./AssetInputRenderer.js";
+import { AssetInputsRenderer } from "./AssetInputsRenderer.js";
+const FileFieldTypeFeature = createFeature({
+    name: "FileFieldType",
+    register (container) {
+        container.register(FileFieldType);
+        container.register(AssetFieldType);
+        container.register(AssetFormFieldType);
+        container.register(FileFieldSettingsModifier);
+        container.register(AssetFieldSettingsModifier);
+        container.register(FileInputRenderer);
+        container.register(FileInputsRenderer);
+        container.register(AssetInputRenderer);
+        container.register(AssetInputsRenderer);
+    }
+});
+export { FileFieldTypeFeature };
+
+//# sourceMappingURL=feature.js.map

package/modules/HeadlessCms/fieldType/feature.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"modules/HeadlessCms/fieldType/feature.js","sources":["../../../../src/modules/HeadlessCms/fieldType/feature.ts"],"sourcesContent":["import { createFeature } from \"@webiny/feature/admin\";\nimport { FileFieldType } from \"./FileFieldType.js\";\nimport { AssetFieldType } from \"./AssetFieldType.js\";\nimport { AssetFormFieldType } from \"./AssetFormFieldType.js\";\nimport { FileFieldSettingsModifier } from \"./FileFieldSettingsModifier.js\";\nimport { AssetFieldSettingsModifier } from \"./AssetFieldSettingsModifier.js\";\nimport { FileInputRenderer } from \"./FileInputRenderer.js\";\nimport { FileInputsRenderer } from \"./FileInputsRenderer.js\";\nimport { AssetInputRenderer } from \"./AssetInputRenderer.js\";\nimport { AssetInputsRenderer } from \"./AssetInputsRenderer.js\";\n\nexport const FileFieldTypeFeature = createFeature({\n    name: \"FileFieldType\",\n    register(container) {\n        container.register(FileFieldType);\n        container.register(AssetFieldType);\n        container.register(AssetFormFieldType);\n        container.register(FileFieldSettingsModifier);\n        container.register(AssetFieldSettingsModifier);\n        container.register(FileInputRenderer);\n        container.register(FileInputsRenderer);\n        container.register(AssetInputRenderer);\n        container.register(AssetInputsRenderer);\n    }\n});\n"],"names":["FileFieldTypeFeature","createFeature","container","FileFieldType","AssetFieldType","AssetFormFieldType","FileFieldSettingsModifier","AssetFieldSettingsModifier","FileInputRenderer","FileInputsRenderer","AssetInputRenderer","AssetInputsRenderer"],"mappings":";;;;;;;;;;AAWO,MAAMA,uBAAuBC,cAAc;IAC9C,MAAM;IACN,UAASC,SAAS;QACdA,UAAU,QAAQ,CAACC;QACnBD,UAAU,QAAQ,CAACE;QACnBF,UAAU,QAAQ,CAACG;QACnBH,UAAU,QAAQ,CAACI;QACnBJ,UAAU,QAAQ,CAACK;QACnBL,UAAU,QAAQ,CAACM;QACnBN,UAAU,QAAQ,CAACO;QACnBP,UAAU,QAAQ,CAACQ;QACnBR,UAAU,QAAQ,CAACS;IACvB;AACJ"}

package/modules/HeadlessCms/fieldType/isAssetField.d.ts

@@ -0,0 +1,2 @@
+import type { CmsModelField } from "@webiny/app-headless-cms-common/types/index.js";
+export declare const isAssetField: (field: Pick<CmsModelField, "type">) => boolean;

package/modules/HeadlessCms/fieldType/isAssetField.js

@@ -0,0 +1,4 @@
+const isAssetField = (field)=>"asset" === field.type;
+export { isAssetField };
+
+//# sourceMappingURL=isAssetField.js.map

package/modules/HeadlessCms/fieldType/isAssetField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"modules/HeadlessCms/fieldType/isAssetField.js","sources":["../../../../src/modules/HeadlessCms/fieldType/isAssetField.ts"],"sourcesContent":["import type { CmsModelField } from \"@webiny/app-headless-cms-common/types/index.js\";\n\nexport const isAssetField = (field: Pick<CmsModelField, \"type\">): boolean => {\n    return field.type === \"asset\";\n};\n"],"names":["isAssetField","field"],"mappings":"AAEO,MAAMA,eAAe,CAACC,QAClBA,AAAe,YAAfA,MAAM,IAAI"}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@webiny/app-file-manager",
-	"version": "6.4.12-beta.4",
+	"version": "6.5.0-beta.0",
 	"type": "module",
 	"exports": {
 		".": "./index.js",
@@ -13,50 +13,40 @@
 	"author": "Jon Rapp ",
 	"license": "MIT",
 	"dependencies": {
-		"@apollo/react-common": "3.1.4",
-		"@apollo/react-components": "3.1.5",
 		"@types/react": "18.3.31",
-		"@webiny/admin-ui": "6.4.12-beta.4",
-		"@webiny/app": "6.4.12-beta.4",
-		"@webiny/app-aco": "6.4.12-beta.4",
-		"@webiny/app-admin": "6.4.12-beta.4",
-		"@webiny/app-headless-cms": "6.4.12-beta.4",
-		"@webiny/app-headless-cms-common": "6.4.12-beta.4",
-		"@webiny/app-websockets": "6.4.12-beta.4",
-		"@webiny/di": "1.1.0",
-		"@webiny/feature": "6.4.12-beta.4",
-		"@webiny/form": "6.4.12-beta.4",
-		"@webiny/icons": "6.4.12-beta.4",
-		"@webiny/plugins": "6.4.12-beta.4",
-		"@webiny/react-composition": "6.4.12-beta.4",
-		"@webiny/react-properties": "6.4.12-beta.4",
-		"@webiny/sdk": "6.4.12-beta.4",
-		"@webiny/validation": "6.4.12-beta.4",
-		"apollo-cache": "1.3.5",
-		"apollo-client": "2.6.10",
-		"apollo-link": "1.2.14",
-		"apollo-utilities": "1.3.4",
+		"@webiny/admin-ui": "6.5.0-beta.0",
+		"@webiny/app": "6.5.0-beta.0",
+		"@webiny/app-aco": "6.5.0-beta.0",
+		"@webiny/app-admin": "6.5.0-beta.0",
+		"@webiny/app-headless-cms": "6.5.0-beta.0",
+		"@webiny/app-headless-cms-common": "6.5.0-beta.0",
+		"@webiny/app-websockets": "6.5.0-beta.0",
+		"@webiny/di": "1.0.2",
+		"@webiny/feature": "6.5.0-beta.0",
+		"@webiny/form": "6.5.0-beta.0",
+		"@webiny/icons": "6.5.0-beta.0",
+		"@webiny/plugins": "6.5.0-beta.0",
+		"@webiny/react-composition": "6.5.0-beta.0",
+		"@webiny/react-properties": "6.5.0-beta.0",
+		"@webiny/sdk": "6.5.0-beta.0",
+		"@webiny/validation": "6.5.0-beta.0",
 		"bytes": "3.1.2",
-		"dayjs": "1.11.23",
-		"dot-prop-immutable": "2.1.1",
-		"graphql": "16.14.2",
-		"graphql-tag": "2.12.7",
+		"dayjs": "1.11.21",
 		"lodash": "4.18.1",
 		"mime": "4.1.0",
-		"minimatch": "10.2.6",
-		"mobx": "7.0.3",
-		"mobx-react-lite": "5.0.3",
+		"minimatch": "10.2.5",
+		"mobx": "6.16.1",
+		"mobx-react-lite": "4.1.1",
 		"react": "18.3.1",
 		"react-dom": "18.3.1",
 		"react-lazy-load": "4.0.1",
-		"zod": "4.6.5"
+		"zod": "4.4.3"
 	},
 	"devDependencies": {
-		"@svgr/webpack": "8.1.0",
-		"@webiny/build-tools": "6.4.12-beta.4",
+		"@webiny/build-tools": "6.5.0-beta.0",
 		"rimraf": "6.1.3",
-		"typescript": "6.0.3",
-		"vitest": "5.0.1"
+		"typescript": "7.0.2",
+		"vitest": "4.1.10"
 	},
 	"publishConfig": {
 		"access": "public"

package/presentation/FileActions/FileDetails/EditImage.d.ts

@@ -0,0 +1,2 @@
+import React from "react";
+export declare const EditImage: () => React.JSX.Element | null;

package/presentation/FileActions/FileDetails/EditImage.js

@@ -0,0 +1,39 @@
+import react, { useCallback } from "react";
+import { ReactComponent } from "@webiny/icons/crop.svg";
+import { ImageEditor } from "@webiny/admin-ui";
+import { FileManagerViewConfig, useFile } from "../../../index.js";
+import { useFileManagerPresenter } from "../../FileList/FileManagerPresenterProvider.js";
+import { useEditImage } from "../../hooks/useEditImage.js";
+const { FileDetails: FileDetails } = FileManagerViewConfig;
+const EditImage = ()=>{
+    const { file } = useFile();
+    const { vm } = useFileManagerPresenter();
+    const fileDetails = vm.fileDetails;
+    const onSaved = useCallback((updated)=>{
+        fileDetails?.setFile(updated);
+    }, [
+        fileDetails
+    ]);
+    const { open, openEditor, closeEditor, value, save } = useEditImage(file, {
+        onSaved
+    });
+    if (!file.type?.startsWith("image/") || "image/svg+xml" === file.type) return null;
+    return /*#__PURE__*/ react.createElement(react.Fragment, null, /*#__PURE__*/ react.createElement(FileDetails.Action.Button, {
+        label: "Edit image",
+        icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+        onAction: openEditor
+    }), /*#__PURE__*/ react.createElement(ImageEditor, {
+        open: open,
+        onClose: closeEditor,
+        image: {
+            src: file.src,
+            width: file.metadata?.image?.width ?? 0,
+            height: file.metadata?.image?.height ?? 0
+        },
+        value: value,
+        onSave: save
+    }));
+};
+export { EditImage };
+
+//# sourceMappingURL=EditImage.js.map

package/presentation/FileActions/FileDetails/EditImage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/FileActions/FileDetails/EditImage.js","sources":["../../../../src/presentation/FileActions/FileDetails/EditImage.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport { ReactComponent as CropIcon } from \"@webiny/icons/crop.svg\";\nimport { ImageEditor } from \"@webiny/admin-ui\";\nimport { FileManagerViewConfig, useFile } from \"~/index.js\";\nimport { useFileManagerPresenter } from \"~/presentation/FileList/FileManagerPresenterProvider.js\";\nimport { useEditImage } from \"~/presentation/hooks/useEditImage.js\";\nimport type { FileItem } from \"~/domain/types.js\";\n\nconst { FileDetails } = FileManagerViewConfig;\n\nexport const EditImage = () => {\n    const { file } = useFile();\n    const { vm } = useFileManagerPresenter();\n    const fileDetails = vm.fileDetails;\n\n    // After saving, replace the file shown in the drawer so the preview updates\n    // in place (without needing to close and reopen the drawer).\n    const onSaved = useCallback(\n        (updated: FileItem) => {\n            fileDetails?.setFile(updated);\n        },\n        [fileDetails]\n    );\n\n    const { open, openEditor, closeEditor, value, save } = useEditImage(file, { onSaved });\n\n    if (!file.type?.startsWith(\"image/\") || file.type === \"image/svg+xml\") {\n        return null;\n    }\n\n    return (\n        <>\n            <FileDetails.Action.Button\n                label={\"Edit image\"}\n                icon={<CropIcon />}\n                onAction={openEditor}\n            />\n            <ImageEditor\n                open={open}\n                onClose={closeEditor}\n                image={{\n                    src: file.src,\n                    width: file.metadata?.image?.width ?? 0,\n                    height: file.metadata?.image?.height ?? 0\n                }}\n                value={value}\n                onSave={save}\n            />\n        </>\n    );\n};\n"],"names":["FileDetails","FileManagerViewConfig","EditImage","file","useFile","vm","useFileManagerPresenter","fileDetails","onSaved","useCallback","updated","open","openEditor","closeEditor","value","save","useEditImage","CropIcon","ImageEditor"],"mappings":";;;;;;AAQA,MAAM,EAAEA,aAAAA,WAAW,EAAE,GAAGC;AAEjB,MAAMC,YAAY;IACrB,MAAM,EAAEC,IAAI,EAAE,GAAGC;IACjB,MAAM,EAAEC,EAAE,EAAE,GAAGC;IACf,MAAMC,cAAcF,GAAG,WAAW;IAIlC,MAAMG,UAAUC,YACZ,CAACC;QACGH,aAAa,QAAQG;IACzB,GACA;QAACH;KAAY;IAGjB,MAAM,EAAEI,IAAI,EAAEC,UAAU,EAAEC,WAAW,EAAEC,KAAK,EAAEC,IAAI,EAAE,GAAGC,aAAab,MAAM;QAAEK;IAAQ;IAEpF,IAAI,CAACL,KAAK,IAAI,EAAE,WAAW,aAAaA,AAAc,oBAAdA,KAAK,IAAI,EAC7C,OAAO;IAGX,OAAO,WAAP,GACI,wDACI,oBAACH,YAAY,MAAM,CAAC,MAAM;QACtB,OAAO;QACP,oBAAM,oBAACiB,gBAAQA;QACf,UAAUL;sBAEd,oBAACM,aAAWA;QACR,MAAMP;QACN,SAASE;QACT,OAAO;YACH,KAAKV,KAAK,GAAG;YACb,OAAOA,KAAK,QAAQ,EAAE,OAAO,SAAS;YACtC,QAAQA,KAAK,QAAQ,EAAE,OAAO,UAAU;QAC5C;QACA,OAAOW;QACP,QAAQC;;AAIxB"}

package/presentation/FileActions/index.js

@@ -8,6 +8,7 @@ import { Download as Download_js_Download } from "./FileDetails/Download.js";
 import { MoveToFolder as MoveToFolder_js_MoveToFolder } from "./FileDetails/MoveToFolder.js";
 import { CopyUrl } from "./FileDetails/CopyUrl.js";
 import { DeleteImage } from "./FileDetails/DeleteImage.js";
+import { EditImage } from "./FileDetails/EditImage.js";
 const { Browser: Browser, FileDetails: FileDetails } = FileManagerViewConfig;
 const FileActions = ()=>/*#__PURE__*/ react.createElement(react.Fragment, null, /*#__PURE__*/ react.createElement(Browser.Grid.Item.Action, {
         name: "settings",
@@ -21,6 +22,9 @@ const FileActions = ()=>/*#__PURE__*/ react.createElement(react.Fragment, null,
     }), /*#__PURE__*/ react.createElement(Browser.Grid.Item.Action, {
         name: "delete",
         element: /*#__PURE__*/ react.createElement(Delete, null)
+    }), /*#__PURE__*/ react.createElement(FileDetails.Action, {
+        name: "editImage",
+        element: /*#__PURE__*/ react.createElement(EditImage, null)
     }), /*#__PURE__*/ react.createElement(FileDetails.Action, {
         name: "download",
         element: /*#__PURE__*/ react.createElement(Download_js_Download, null)

package/presentation/FileActions/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"presentation/FileActions/index.js","sources":["../../../src/presentation/FileActions/index.tsx"],"sourcesContent":["import React from \"react\";\nimport { FileManagerViewConfig } from \"~/index.js\";\nimport { Delete as GridDelete } from \"./Grid/Delete.js\";\nimport { Download as GridDownload } from \"./Grid/Download.js\";\nimport { MoveToFolder as GridMoveToFolder } from \"./Grid/MoveToFolder.js\";\nimport { Settings as GridSettings } from \"./Grid/Settings.js\";\nimport { Download as FileDetailsDownload } from \"./FileDetails/Download.js\";\nimport { MoveToFolder as FileDetailsMoveToFolder } from \"./FileDetails/MoveToFolder.js\";\nimport { CopyUrl as FileDetailsCopyUrl } from \"./FileDetails/CopyUrl.js\";\nimport { DeleteImage as FileDetailsDeleteImage } from \"./FileDetails/DeleteImage.js\";\n\nconst { Browser, FileDetails } = FileManagerViewConfig;\n\nexport const FileActions = () => {\n    return (\n        <>\n            {/* Grid actions. */}\n            <Browser.Grid.Item.Action name={\"settings\"} element={<GridSettings />} />\n            <Browser.Grid.Item.Action name={\"download\"} element={<GridDownload />} />\n            <Browser.Grid.Item.Action name={\"move\"} element={<GridMoveToFolder />} />\n            <Browser.Grid.Item.Action name={\"delete\"} element={<GridDelete />} />\n            {/* File details actions. */}\n            <FileDetails.Action name={\"download\"} element={<FileDetailsDownload />} />\n            <FileDetails.Action name={\"moveToFolder\"} element={<FileDetailsMoveToFolder />} />\n            <FileDetails.Action name={\"copyUrl\"} element={<FileDetailsCopyUrl />} />\n            <FileDetails.Action name={\"delete\"} element={<FileDetailsDeleteImage />} />\n        </>\n    );\n};\n"],"names":["Browser","FileDetails","FileManagerViewConfig","FileActions","GridSettings","GridDownload","GridMoveToFolder","GridDelete","FileDetailsDownload","FileDetailsMoveToFolder","FileDetailsCopyUrl","FileDetailsDeleteImage"],"mappings":";;;;;;;;;;AAWA,MAAM,EAAEA,SAAAA,OAAO,EAAEC,aAAAA,WAAW,EAAE,GAAGC;AAE1B,MAAMC,cAAc,IAChB,WAAP,GACI,wDAEI,oBAACH,QAAQ,IAAI,CAAC,IAAI,CAAC,MAAM;QAAC,MAAM;QAAY,uBAAS,oBAACI,UAAYA;sBAClE,oBAACJ,QAAQ,IAAI,CAAC,IAAI,CAAC,MAAM;QAAC,MAAM;QAAY,uBAAS,oBAACK,UAAYA;sBAClE,oBAACL,QAAQ,IAAI,CAAC,IAAI,CAAC,MAAM;QAAC,MAAM;QAAQ,uBAAS,oBAACM,cAAgBA;sBAClE,oBAACN,QAAQ,IAAI,CAAC,IAAI,CAAC,MAAM;QAAC,MAAM;QAAU,uBAAS,oBAACO,QAAUA;sBAE9D,oBAACN,YAAY,MAAM;QAAC,MAAM;QAAY,uBAAS,oBAACO,sBAAmBA;sBACnE,oBAACP,YAAY,MAAM;QAAC,MAAM;QAAgB,uBAAS,oBAACQ,8BAAuBA;sBAC3E,oBAACR,YAAY,MAAM;QAAC,MAAM;QAAW,uBAAS,oBAACS,SAAkBA;sBACjE,oBAACT,YAAY,MAAM;QAAC,MAAM;QAAU,uBAAS,oBAACU,aAAsBA"}
+{"version":3,"file":"presentation/FileActions/index.js","sources":["../../../src/presentation/FileActions/index.tsx"],"sourcesContent":["import React from \"react\";\nimport { FileManagerViewConfig } from \"~/index.js\";\nimport { Delete as GridDelete } from \"./Grid/Delete.js\";\nimport { Download as GridDownload } from \"./Grid/Download.js\";\nimport { MoveToFolder as GridMoveToFolder } from \"./Grid/MoveToFolder.js\";\nimport { Settings as GridSettings } from \"./Grid/Settings.js\";\nimport { Download as FileDetailsDownload } from \"./FileDetails/Download.js\";\nimport { MoveToFolder as FileDetailsMoveToFolder } from \"./FileDetails/MoveToFolder.js\";\nimport { CopyUrl as FileDetailsCopyUrl } from \"./FileDetails/CopyUrl.js\";\nimport { DeleteImage as FileDetailsDeleteImage } from \"./FileDetails/DeleteImage.js\";\nimport { EditImage as FileDetailsEditImage } from \"./FileDetails/EditImage.js\";\n\nconst { Browser, FileDetails } = FileManagerViewConfig;\n\nexport const FileActions = () => {\n    return (\n        <>\n            {/* Grid actions. */}\n            <Browser.Grid.Item.Action name={\"settings\"} element={<GridSettings />} />\n            <Browser.Grid.Item.Action name={\"download\"} element={<GridDownload />} />\n            <Browser.Grid.Item.Action name={\"move\"} element={<GridMoveToFolder />} />\n            <Browser.Grid.Item.Action name={\"delete\"} element={<GridDelete />} />\n            {/* File details actions. */}\n            <FileDetails.Action name={\"editImage\"} element={<FileDetailsEditImage />} />\n            <FileDetails.Action name={\"download\"} element={<FileDetailsDownload />} />\n            <FileDetails.Action name={\"moveToFolder\"} element={<FileDetailsMoveToFolder />} />\n            <FileDetails.Action name={\"copyUrl\"} element={<FileDetailsCopyUrl />} />\n            <FileDetails.Action name={\"delete\"} element={<FileDetailsDeleteImage />} />\n        </>\n    );\n};\n"],"names":["Browser","FileDetails","FileManagerViewConfig","FileActions","GridSettings","GridDownload","GridMoveToFolder","GridDelete","FileDetailsEditImage","FileDetailsDownload","FileDetailsMoveToFolder","FileDetailsCopyUrl","FileDetailsDeleteImage"],"mappings":";;;;;;;;;;;AAYA,MAAM,EAAEA,SAAAA,OAAO,EAAEC,aAAAA,WAAW,EAAE,GAAGC;AAE1B,MAAMC,cAAc,IAChB,WAAP,GACI,wDAEI,oBAACH,QAAQ,IAAI,CAAC,IAAI,CAAC,MAAM;QAAC,MAAM;QAAY,uBAAS,oBAACI,UAAYA;sBAClE,oBAACJ,QAAQ,IAAI,CAAC,IAAI,CAAC,MAAM;QAAC,MAAM;QAAY,uBAAS,oBAACK,UAAYA;sBAClE,oBAACL,QAAQ,IAAI,CAAC,IAAI,CAAC,MAAM;QAAC,MAAM;QAAQ,uBAAS,oBAACM,cAAgBA;sBAClE,oBAACN,QAAQ,IAAI,CAAC,IAAI,CAAC,MAAM;QAAC,MAAM;QAAU,uBAAS,oBAACO,QAAUA;sBAE9D,oBAACN,YAAY,MAAM;QAAC,MAAM;QAAa,uBAAS,oBAACO,WAAoBA;sBACrE,oBAACP,YAAY,MAAM;QAAC,MAAM;QAAY,uBAAS,oBAACQ,sBAAmBA;sBACnE,oBAACR,YAAY,MAAM;QAAC,MAAM;QAAgB,uBAAS,oBAACS,8BAAuBA;sBAC3E,oBAACT,YAAY,MAAM;QAAC,MAAM;QAAW,uBAAS,oBAACU,SAAkBA;sBACjE,oBAACV,YAAY,MAAM;QAAC,MAAM;QAAU,uBAAS,oBAACW,aAAsBA"}

package/presentation/FileDetails/FileDetailsPresenter.d.ts

@@ -5,6 +5,7 @@ import { UpdateFileUseCase } from "../../features/updateFile/abstractions.js";
 import { FormModelFactory } from "@webiny/app-admin/features/formModel/abstractions.js";
 import { FileManagerPermissions } from "../../features/permissions/abstractions.js";
 import { GetSettingsRepository } from "../../features/settings/abstractions.js";
+import type { FmFile } from "../../features/shared/types.js";
 declare class FileDetailsPresenterImpl implements IFileDetailsPresenter {
     private getFileUseCase;
     private updateFileUseCase;
@@ -18,6 +19,7 @@ declare class FileDetailsPresenterImpl implements IFileDetailsPresenter {
     constructor(getFileUseCase: GetFileUseCase.Interface, updateFileUseCase: UpdateFileUseCase.Interface, formModelFactory: FormModelFactory.Interface, permissions: FileManagerPermissions.Interface, settingsRepository: GetSettingsRepository.Interface, wcp: WcpService.Interface);
     get vm(): IFileDetailsViewModel;
     loadFile(id: string): Promise<void>;
+    setFile(file: FmFile): void;
     saveFile(): Promise<boolean>;
     private buildForm;
     private canUsePrivateFiles;

package/presentation/FileDetails/FileDetailsPresenter.js

@@ -66,6 +66,11 @@ class FileDetailsPresenterImpl {
             });
         }
     }
+    setFile(file) {
+        runInAction(()=>{
+            this.file = file;
+        });
+    }
     async saveFile() {
         if (!this.file) return false;
         const data = await this.form.submit();

package/presentation/FileDetails/FileDetailsPresenter.js.map

@@ -1 +1 @@
-{"version":3,"file":"presentation/FileDetails/FileDetailsPresenter.js","sources":["../../../src/presentation/FileDetails/FileDetailsPresenter.ts"],"sourcesContent":["import { makeAutoObservable, runInAction, computed } from \"mobx\";\nimport { WcpService } from \"@webiny/app-admin/features/wcp/abstractions.js\";\nimport {\n    FileDetailsPresenter as Abstraction,\n    type IFileDetailsPresenter,\n    type IFileDetailsViewModel\n} from \"./abstractions.js\";\nimport { GetFileUseCase } from \"../../features/getFile/abstractions.js\";\nimport { UpdateFileUseCase } from \"../../features/updateFile/abstractions.js\";\nimport { FormModelFactory } from \"@webiny/app-admin/features/formModel/abstractions.js\";\nimport type { IFormModel } from \"@webiny/app-admin/features/formModel/abstractions.js\";\nimport { FileManagerPermissions } from \"../../features/permissions/abstractions.js\";\nimport { GetSettingsRepository } from \"../../features/settings/abstractions.js\";\nimport type { FmFile } from \"../../features/shared/types.js\";\nimport type { UpdateFileData } from \"../../features/updateFile/abstractions.js\";\n\nclass FileDetailsPresenterImpl implements IFileDetailsPresenter {\n    private file: FmFile | null = null;\n    private loading: string | null = null;\n    private form: IFormModel;\n\n    constructor(\n        private getFileUseCase: GetFileUseCase.Interface,\n        private updateFileUseCase: UpdateFileUseCase.Interface,\n        private formModelFactory: FormModelFactory.Interface,\n        private permissions: FileManagerPermissions.Interface,\n        private settingsRepository: GetSettingsRepository.Interface,\n        private wcp: WcpService.Interface\n    ) {\n        // Build an empty form initially.\n        this.form = this.buildForm();\n\n        makeAutoObservable(this, { vm: computed });\n    }\n\n    get vm(): IFileDetailsViewModel {\n        return {\n            file: this.file,\n            loading: this.loading,\n            form: this.form.vm,\n            previewUrl: this.buildPreviewUrl(),\n            permissions: {\n                canEdit: this.permissions.canEdit(\"file\", this.file ?? undefined),\n                canDelete: this.permissions.canDelete(\"file\", this.file ?? undefined)\n            }\n        };\n    }\n\n    async loadFile(id: string): Promise<void> {\n        runInAction(() => {\n            this.loading = \"Loading file...\";\n        });\n\n        try {\n            const result = await this.getFileUseCase.execute({ id });\n            runInAction(() => {\n                if (result.success) {\n                    this.file = result.file;\n                    this.form = this.buildForm();\n\n                    const formData: Record<string, unknown> = {\n                        name: result.file.name ?? \"\",\n                        description: result.file.description ?? \"\",\n                        tags: result.file.tags ?? []\n                    };\n\n                    if (this.canUsePrivateFiles()) {\n                        formData.accessControl = result.file.accessControl?.type ?? \"public\";\n                    }\n\n                    this.form.setData(formData);\n\n                    if (!this.permissions.canEdit(\"file\", result.file)) {\n                        this.form.field(\"name\").setDisabled(true);\n                        this.form.field(\"description\").setDisabled(true);\n                        this.form.field(\"tags\").setDisabled(true);\n                        if (this.canUsePrivateFiles()) {\n                            this.form.field(\"accessControl\").setDisabled(true);\n                        }\n                    }\n                }\n            });\n        } finally {\n            runInAction(() => {\n                this.loading = null;\n            });\n        }\n    }\n\n    async saveFile(): Promise<boolean> {\n        if (!this.file) {\n            return false;\n        }\n\n        const data = await this.form.submit();\n        if (!data) {\n            return false;\n        }\n\n        runInAction(() => {\n            this.loading = \"Saving changes...\";\n        });\n\n        try {\n            const updateData: UpdateFileData = {\n                name: data.name as string,\n                description: data.description as string,\n                tags: data.tags as string[]\n            };\n\n            if (this.canUsePrivateFiles()) {\n                updateData.accessControl = {\n                    type: data.accessControl as \"public\" | \"private-authenticated\"\n                };\n            }\n\n            await this.updateFileUseCase.execute({\n                id: this.file.id,\n                data: updateData\n            });\n            return true;\n        } finally {\n            runInAction(() => {\n                this.loading = null;\n            });\n        }\n    }\n\n    private buildForm(): IFormModel {\n        return this.formModelFactory.create({\n            fields: fields => {\n                const fieldDefs: Record<string, any> = {\n                    name: fields.text().label(\"Name\").required().placeholder(\"Enter name\"),\n                    description: fields\n                        .text()\n                        .label(\"Description\")\n                        .renderer(\"textarea\")\n                        .placeholder(\"Enter description\"),\n                    tags: fields\n                        .text()\n                        .label(\"Tags\")\n                        .list()\n                        .renderer(\"tags\")\n                        .placeholder(\"Add tags\")\n                };\n\n                if (this.canUsePrivateFiles()) {\n                    fieldDefs.accessControl = fields\n                        .text()\n                        .label(\"Access Control\")\n                        .help(\"Control who can access this file.\")\n                        .options([\n                            { label: \"Public\", value: \"public\" },\n                            {\n                                label: \"Private (Authenticated)\",\n                                value: \"private-authenticated\"\n                            }\n                        ])\n                        .defaultValue(\"public\");\n                }\n\n                return fieldDefs;\n            },\n            layout: layout => {\n                const rows = [layout.row(\"name\"), layout.row(\"description\"), layout.row(\"tags\")];\n\n                if (this.canUsePrivateFiles()) {\n                    rows.push(layout.row(\"accessControl\"));\n                }\n\n                return rows;\n            }\n        });\n    }\n\n    private canUsePrivateFiles(): boolean {\n        return this.wcp.getProject().canUsePrivateFiles();\n    }\n\n    private buildPreviewUrl(): string | null {\n        if (!this.file?.key) {\n            return null;\n        }\n        const srcPrefix = this.settingsRepository.settings?.srcPrefix ?? \"\";\n        return `${srcPrefix}${this.file.key}`;\n    }\n}\n\nexport const FileDetailsPresenter = Abstraction.createImplementation({\n    implementation: FileDetailsPresenterImpl,\n    dependencies: [\n        GetFileUseCase,\n        UpdateFileUseCase,\n        FormModelFactory,\n        FileManagerPermissions,\n        GetSettingsRepository,\n        WcpService\n    ]\n});\n"],"names":["FileDetailsPresenterImpl","getFileUseCase","updateFileUseCase","formModelFactory","permissions","settingsRepository","wcp","makeAutoObservable","computed","undefined","id","runInAction","result","formData","data","updateData","fields","fieldDefs","layout","rows","srcPrefix","FileDetailsPresenter","Abstraction","GetFileUseCase","UpdateFileUseCase","FormModelFactory","FileManagerPermissions","GetSettingsRepository","WcpService"],"mappings":"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"}
+{"version":3,"file":"presentation/FileDetails/FileDetailsPresenter.js","sources":["../../../src/presentation/FileDetails/FileDetailsPresenter.ts"],"sourcesContent":["import { makeAutoObservable, runInAction, computed } from \"mobx\";\nimport { WcpService } from \"@webiny/app-admin/features/wcp/abstractions.js\";\nimport {\n    FileDetailsPresenter as Abstraction,\n    type IFileDetailsPresenter,\n    type IFileDetailsViewModel\n} from \"./abstractions.js\";\nimport { GetFileUseCase } from \"../../features/getFile/abstractions.js\";\nimport { UpdateFileUseCase } from \"../../features/updateFile/abstractions.js\";\nimport { FormModelFactory } from \"@webiny/app-admin/features/formModel/abstractions.js\";\nimport type { IFormModel } from \"@webiny/app-admin/features/formModel/abstractions.js\";\nimport { FileManagerPermissions } from \"../../features/permissions/abstractions.js\";\nimport { GetSettingsRepository } from \"../../features/settings/abstractions.js\";\nimport type { FmFile } from \"../../features/shared/types.js\";\nimport type { UpdateFileData } from \"../../features/updateFile/abstractions.js\";\n\nclass FileDetailsPresenterImpl implements IFileDetailsPresenter {\n    private file: FmFile | null = null;\n    private loading: string | null = null;\n    private form: IFormModel;\n\n    constructor(\n        private getFileUseCase: GetFileUseCase.Interface,\n        private updateFileUseCase: UpdateFileUseCase.Interface,\n        private formModelFactory: FormModelFactory.Interface,\n        private permissions: FileManagerPermissions.Interface,\n        private settingsRepository: GetSettingsRepository.Interface,\n        private wcp: WcpService.Interface\n    ) {\n        // Build an empty form initially.\n        this.form = this.buildForm();\n\n        makeAutoObservable(this, { vm: computed });\n    }\n\n    get vm(): IFileDetailsViewModel {\n        return {\n            file: this.file,\n            loading: this.loading,\n            form: this.form.vm,\n            previewUrl: this.buildPreviewUrl(),\n            permissions: {\n                canEdit: this.permissions.canEdit(\"file\", this.file ?? undefined),\n                canDelete: this.permissions.canDelete(\"file\", this.file ?? undefined)\n            }\n        };\n    }\n\n    async loadFile(id: string): Promise<void> {\n        runInAction(() => {\n            this.loading = \"Loading file...\";\n        });\n\n        try {\n            const result = await this.getFileUseCase.execute({ id });\n            runInAction(() => {\n                if (result.success) {\n                    this.file = result.file;\n                    this.form = this.buildForm();\n\n                    const formData: Record<string, unknown> = {\n                        name: result.file.name ?? \"\",\n                        description: result.file.description ?? \"\",\n                        tags: result.file.tags ?? []\n                    };\n\n                    if (this.canUsePrivateFiles()) {\n                        formData.accessControl = result.file.accessControl?.type ?? \"public\";\n                    }\n\n                    this.form.setData(formData);\n\n                    if (!this.permissions.canEdit(\"file\", result.file)) {\n                        this.form.field(\"name\").setDisabled(true);\n                        this.form.field(\"description\").setDisabled(true);\n                        this.form.field(\"tags\").setDisabled(true);\n                        if (this.canUsePrivateFiles()) {\n                            this.form.field(\"accessControl\").setDisabled(true);\n                        }\n                    }\n                }\n            });\n        } finally {\n            runInAction(() => {\n                this.loading = null;\n            });\n        }\n    }\n\n    setFile(file: FmFile): void {\n        runInAction(() => {\n            this.file = file;\n        });\n    }\n\n    async saveFile(): Promise<boolean> {\n        if (!this.file) {\n            return false;\n        }\n\n        const data = await this.form.submit();\n        if (!data) {\n            return false;\n        }\n\n        runInAction(() => {\n            this.loading = \"Saving changes...\";\n        });\n\n        try {\n            const updateData: UpdateFileData = {\n                name: data.name as string,\n                description: data.description as string,\n                tags: data.tags as string[]\n            };\n\n            if (this.canUsePrivateFiles()) {\n                updateData.accessControl = {\n                    type: data.accessControl as \"public\" | \"private-authenticated\"\n                };\n            }\n\n            await this.updateFileUseCase.execute({\n                id: this.file.id,\n                data: updateData\n            });\n            return true;\n        } finally {\n            runInAction(() => {\n                this.loading = null;\n            });\n        }\n    }\n\n    private buildForm(): IFormModel {\n        return this.formModelFactory.create({\n            fields: fields => {\n                const fieldDefs: Record<string, any> = {\n                    name: fields.text().label(\"Name\").required().placeholder(\"Enter name\"),\n                    description: fields\n                        .text()\n                        .label(\"Description\")\n                        .renderer(\"textarea\")\n                        .placeholder(\"Enter description\"),\n                    tags: fields\n                        .text()\n                        .label(\"Tags\")\n                        .list()\n                        .renderer(\"tags\")\n                        .placeholder(\"Add tags\")\n                };\n\n                if (this.canUsePrivateFiles()) {\n                    fieldDefs.accessControl = fields\n                        .text()\n                        .label(\"Access Control\")\n                        .help(\"Control who can access this file.\")\n                        .options([\n                            { label: \"Public\", value: \"public\" },\n                            {\n                                label: \"Private (Authenticated)\",\n                                value: \"private-authenticated\"\n                            }\n                        ])\n                        .defaultValue(\"public\");\n                }\n\n                return fieldDefs;\n            },\n            layout: layout => {\n                const rows = [layout.row(\"name\"), layout.row(\"description\"), layout.row(\"tags\")];\n\n                if (this.canUsePrivateFiles()) {\n                    rows.push(layout.row(\"accessControl\"));\n                }\n\n                return rows;\n            }\n        });\n    }\n\n    private canUsePrivateFiles(): boolean {\n        return this.wcp.getProject().canUsePrivateFiles();\n    }\n\n    private buildPreviewUrl(): string | null {\n        if (!this.file?.key) {\n            return null;\n        }\n        const srcPrefix = this.settingsRepository.settings?.srcPrefix ?? \"\";\n        return `${srcPrefix}${this.file.key}`;\n    }\n}\n\nexport const FileDetailsPresenter = Abstraction.createImplementation({\n    implementation: FileDetailsPresenterImpl,\n    dependencies: [\n        GetFileUseCase,\n        UpdateFileUseCase,\n        FormModelFactory,\n        FileManagerPermissions,\n        GetSettingsRepository,\n        WcpService\n    ]\n});\n"],"names":["FileDetailsPresenterImpl","getFileUseCase","updateFileUseCase","formModelFactory","permissions","settingsRepository","wcp","makeAutoObservable","computed","undefined","id","runInAction","result","formData","file","data","updateData","fields","fieldDefs","layout","rows","srcPrefix","FileDetailsPresenter","Abstraction","GetFileUseCase","UpdateFileUseCase","FormModelFactory","FileManagerPermissions","GetSettingsRepository","WcpService"],"mappings":"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"}

package/presentation/FileDetails/FileDetailsPresenter.test.js

@@ -13,6 +13,7 @@ function createMockFormModel(overrides) {
     const vm = {
         layout: [],
         errors: [],
+        hasErrors: false,
         isDirty: false,
         isValid: true,
         submitCount: 0,