@webiny/app-file-manager 6.3.0 → 6.4.0-beta.0

package/presentation/FileList/components/NoResults/NoResults.js

@@ -0,0 +1,21 @@
+import react from "react";
+import { Heading } from "@webiny/admin-ui";
+import { ReactComponent } from "@webiny/icons/search_off.svg";
+const NoResults = ()=>/*#__PURE__*/ react.createElement("div", {
+        className: "w-full h-full p-lg flex items-center justify-center bg-neutral-base"
+    }, /*#__PURE__*/ react.createElement("div", {
+        className: "flex flex-col items-center justify-center gap-sm"
+    }, /*#__PURE__*/ react.createElement("div", {
+        className: "fill-neutral-strong"
+    }, /*#__PURE__*/ react.createElement(ReactComponent, {
+        width: 75,
+        height: 75
+    })), /*#__PURE__*/ react.createElement("div", {
+        className: "text-center"
+    }, /*#__PURE__*/ react.createElement(Heading, {
+        level: 4,
+        className: "text-neutral-strong"
+    }, "No results found."))));
+export { NoResults };
+
+//# sourceMappingURL=NoResults.js.map

package/presentation/FileList/components/NoResults/NoResults.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/FileList/components/NoResults/NoResults.js","sources":["../../../../../src/presentation/FileList/components/NoResults/NoResults.tsx"],"sourcesContent":["import React from \"react\";\nimport { Heading } from \"@webiny/admin-ui\";\nimport { ReactComponent as SearchOffIcon } from \"@webiny/icons/search_off.svg\";\n\nexport const NoResults = () => {\n    return (\n        <div className={\"w-full h-full p-lg flex items-center justify-center bg-neutral-base\"}>\n            <div className={\"flex flex-col items-center justify-center gap-sm\"}>\n                <div className={\"fill-neutral-strong\"}>\n                    <SearchOffIcon width={75} height={75} />\n                </div>\n                <div className={\"text-center\"}>\n                    <Heading level={4} className={\"text-neutral-strong\"}>\n                        {\"No results found.\"}\n                    </Heading>\n                </div>\n            </div>\n        </div>\n    );\n};\n"],"names":["NoResults","SearchOffIcon","Heading"],"mappings":";;;AAIO,MAAMA,YAAY,IACd,WAAP,GACI,oBAAC;QAAI,WAAW;qBACZ,oBAAC;QAAI,WAAW;qBACZ,oBAAC;QAAI,WAAW;qBACZ,oBAACC,gBAAaA;QAAC,OAAO;QAAI,QAAQ;uBAEtC,oBAAC;QAAI,WAAW;qBACZ,oBAACC,SAAOA;QAAC,OAAO;QAAG,WAAW;OACzB"}

package/presentation/FileList/components/NoResults/index.js

@@ -0,0 +1 @@
+export * from "./NoResults.js";

package/presentation/FileList/components/Search/SearchBar.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+/**
+ * Search bar component wired to the FileListPresenter.
+ * Uses DelayedOnChange for debounced input, reads current search from vm.list.search,
+ * and dispatches changes via presenter.actions.search.set().
+ */
+export declare const SearchBar: (() => React.JSX.Element) & {
+    displayName: string;
+};

package/presentation/FileList/components/Search/SearchBar.js

@@ -0,0 +1,33 @@
+import react from "react";
+import { observer } from "mobx-react-lite";
+import { DelayedOnChange, Icon, Input } from "@webiny/admin-ui";
+import { ReactComponent } from "@webiny/icons/search.svg";
+import { i18n } from "@webiny/app/i18n/index.js";
+import { useFileManagerPresenter } from "../../FileManagerPresenterProvider.js";
+const t = i18n.ns("app-file-manager/presentation/search-bar");
+const SearchBar_SearchBar = observer(function() {
+    const { vm, actions } = useFileManagerPresenter();
+    return /*#__PURE__*/ react.createElement(DelayedOnChange, {
+        value: vm.list.search,
+        onChange: (value)=>{
+            if (value) actions.search.set(value);
+            else actions.search.clear();
+        }
+    }, ({ value, onChange })=>/*#__PURE__*/ react.createElement(Input, {
+            id: "file-manager__search-input",
+            value: value,
+            onChange: (value)=>onChange(value),
+            placeholder: t`Search files...`,
+            disabled: !vm.permissions.canRead,
+            "data-testid": "fm-search-bar",
+            startIcon: /*#__PURE__*/ react.createElement(Icon, {
+                label: "Search",
+                icon: /*#__PURE__*/ react.createElement(ReactComponent, null)
+            }),
+            size: "md",
+            variant: "ghost"
+        }));
+});
+export { SearchBar_SearchBar as SearchBar };
+
+//# sourceMappingURL=SearchBar.js.map

package/presentation/FileList/components/Search/SearchBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/FileList/components/Search/SearchBar.js","sources":["../../../../../src/presentation/FileList/components/Search/SearchBar.tsx"],"sourcesContent":["import React from \"react\";\nimport { observer } from \"mobx-react-lite\";\nimport { DelayedOnChange, Icon, Input } from \"@webiny/admin-ui\";\nimport { ReactComponent as SearchIcon } from \"@webiny/icons/search.svg\";\nimport { i18n } from \"@webiny/app/i18n/index.js\";\nimport { useFileManagerPresenter } from \"../../FileManagerPresenterProvider.js\";\n\nconst t = i18n.ns(\"app-file-manager/presentation/search-bar\");\n\n/**\n * Search bar component wired to the FileListPresenter.\n * Uses DelayedOnChange for debounced input, reads current search from vm.list.search,\n * and dispatches changes via presenter.actions.search.set().\n */\nexport const SearchBar = observer(function SearchBar() {\n    const { vm, actions } = useFileManagerPresenter();\n\n    return (\n        <DelayedOnChange\n            value={vm.list.search}\n            onChange={value => {\n                if (value) {\n                    actions.search.set(value);\n                } else {\n                    actions.search.clear();\n                }\n            }}\n        >\n            {({ value, onChange }) => (\n                <Input\n                    id={\"file-manager__search-input\"}\n                    value={value}\n                    onChange={value => onChange(value)}\n                    placeholder={t`Search files...`}\n                    disabled={!vm.permissions.canRead}\n                    data-testid={\"fm-search-bar\"}\n                    startIcon={<Icon label={\"Search\"} icon={<SearchIcon />} />}\n                    size={\"md\"}\n                    variant={\"ghost\"}\n                />\n            )}\n        </DelayedOnChange>\n    );\n});\n"],"names":["t","i18n","SearchBar","observer","vm","actions","useFileManagerPresenter","DelayedOnChange","value","onChange","Input","Icon","SearchIcon"],"mappings":";;;;;;AAOA,MAAMA,IAAIC,KAAK,EAAE,CAAC;AAOX,MAAMC,sBAAYC,SAAS;IAC9B,MAAM,EAAEC,EAAE,EAAEC,OAAO,EAAE,GAAGC;IAExB,OAAO,WAAP,GACI,oBAACC,iBAAeA;QACZ,OAAOH,GAAG,IAAI,CAAC,MAAM;QACrB,UAAUI,CAAAA;YACN,IAAIA,OACAH,QAAQ,MAAM,CAAC,GAAG,CAACG;iBAEnBH,QAAQ,MAAM,CAAC,KAAK;QAE5B;OAEC,CAAC,EAAEG,KAAK,EAAEC,QAAQ,EAAE,iBACjB,oBAACC,OAAKA;YACF,IAAI;YACJ,OAAOF;YACP,UAAUA,CAAAA,QAASC,SAASD;YAC5B,aAAaR,CAAC,CAAC,eAAe,CAAC;YAC/B,UAAU,CAACI,GAAG,WAAW,CAAC,OAAO;YACjC,eAAa;YACb,yBAAW,oBAACO,MAAIA;gBAAC,OAAO;gBAAU,oBAAM,oBAACC,gBAAUA;;YACnD,MAAM;YACN,SAAS;;AAK7B"}

package/presentation/FileList/components/Search/index.d.ts

@@ -0,0 +1 @@
+export { SearchBar } from "./SearchBar.js";

package/presentation/FileList/components/Search/index.js

@@ -0,0 +1 @@
+export { SearchBar } from "./SearchBar.js";

package/presentation/FileList/components/Table/Actions/CopyFile.js

@@ -0,0 +1,21 @@
+import react from "react";
+import { ReactComponent } from "@webiny/icons/content_copy.svg";
+import { FileManagerViewConfig } from "../../../../config/FileManagerViewConfig.js";
+import { useCopyFile } from "../../../../hooks/useCopyFile.js";
+import { useFile } from "../../../../hooks/useFile.js";
+const CopyFile = ()=>{
+    const { file } = useFile();
+    const { copyFileUrl } = useCopyFile({
+        file
+    });
+    const { OptionsMenuItem } = FileManagerViewConfig.Browser.File.Action;
+    return /*#__PURE__*/ react.createElement(OptionsMenuItem, {
+        icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+        label: "Copy",
+        onAction: copyFileUrl,
+        "data-testid": "aco.actions.file.copy"
+    });
+};
+export { CopyFile };
+
+//# sourceMappingURL=CopyFile.js.map

package/presentation/FileList/components/Table/Actions/CopyFile.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/FileList/components/Table/Actions/CopyFile.js","sources":["../../../../../../src/presentation/FileList/components/Table/Actions/CopyFile.tsx"],"sourcesContent":["import React from \"react\";\nimport { ReactComponent as Copy } from \"@webiny/icons/content_copy.svg\";\nimport { FileManagerViewConfig } from \"~/presentation/config/FileManagerViewConfig.js\";\nimport { useCopyFile } from \"~/presentation/hooks/useCopyFile.js\";\nimport { useFile } from \"~/presentation/hooks/useFile.js\";\n\nexport const CopyFile = () => {\n    const { file } = useFile();\n    const { copyFileUrl } = useCopyFile({ file });\n    const { OptionsMenuItem } = FileManagerViewConfig.Browser.File.Action;\n\n    return (\n        <OptionsMenuItem\n            icon={<Copy />}\n            label={\"Copy\"}\n            onAction={copyFileUrl}\n            data-testid={\"aco.actions.file.copy\"}\n        />\n    );\n};\n"],"names":["CopyFile","file","useFile","copyFileUrl","useCopyFile","OptionsMenuItem","FileManagerViewConfig","Copy"],"mappings":";;;;;AAMO,MAAMA,WAAW;IACpB,MAAM,EAAEC,IAAI,EAAE,GAAGC;IACjB,MAAM,EAAEC,WAAW,EAAE,GAAGC,YAAY;QAAEH;IAAK;IAC3C,MAAM,EAAEI,eAAe,EAAE,GAAGC,sBAAsB,OAAO,CAAC,IAAI,CAAC,MAAM;IAErE,OAAO,WAAP,GACI,oBAACD,iBAAAA;QACG,oBAAM,oBAACE,gBAAIA;QACX,OAAO;QACP,UAAUJ;QACV,eAAa;;AAGzB"}

package/presentation/FileList/components/Table/Actions/DeleteFile.js

@@ -0,0 +1,24 @@
+import react from "react";
+import { ReactComponent } from "@webiny/icons/delete.svg";
+import { FileManagerViewConfig } from "../../../../config/FileManagerViewConfig.js";
+import { useFileManagerPresenter } from "../../../FileManagerPresenterProvider.js";
+import { useDeleteFile } from "../../../../hooks/useDeleteFile.js";
+import { useFile } from "../../../../hooks/useFile.js";
+const DeleteFile = ()=>{
+    const { file } = useFile();
+    const { vm } = useFileManagerPresenter();
+    const { openDialogDeleteFile } = useDeleteFile({
+        file
+    });
+    const { OptionsMenuItem } = FileManagerViewConfig.Browser.File.Action;
+    if (!vm.permissions.canDeleteFile(file)) return null;
+    return /*#__PURE__*/ react.createElement(OptionsMenuItem, {
+        icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+        label: "Delete",
+        onAction: openDialogDeleteFile,
+        "data-testid": "aco.actions.file.delete"
+    });
+};
+export { DeleteFile };
+
+//# sourceMappingURL=DeleteFile.js.map

package/presentation/FileList/components/Table/Actions/DeleteFile.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/FileList/components/Table/Actions/DeleteFile.js","sources":["../../../../../../src/presentation/FileList/components/Table/Actions/DeleteFile.tsx"],"sourcesContent":["import React from \"react\";\nimport { ReactComponent as Delete } from \"@webiny/icons/delete.svg\";\nimport { FileManagerViewConfig } from \"~/presentation/config/FileManagerViewConfig.js\";\nimport { useFileManagerPresenter } from \"~/presentation/FileList/FileManagerPresenterProvider.js\";\nimport { useDeleteFile } from \"~/presentation/hooks/useDeleteFile.js\";\nimport { useFile } from \"~/presentation/hooks/useFile.js\";\n\nexport const DeleteFile = () => {\n    const { file } = useFile();\n    const { vm } = useFileManagerPresenter();\n    const { openDialogDeleteFile } = useDeleteFile({\n        file\n    });\n    const { OptionsMenuItem } = FileManagerViewConfig.Browser.File.Action;\n\n    if (!vm.permissions.canDeleteFile(file)) {\n        return null;\n    }\n\n    return (\n        <OptionsMenuItem\n            icon={<Delete />}\n            label={\"Delete\"}\n            onAction={openDialogDeleteFile}\n            data-testid={\"aco.actions.file.delete\"}\n        />\n    );\n};\n"],"names":["DeleteFile","file","useFile","vm","useFileManagerPresenter","openDialogDeleteFile","useDeleteFile","OptionsMenuItem","FileManagerViewConfig","Delete"],"mappings":";;;;;;AAOO,MAAMA,aAAa;IACtB,MAAM,EAAEC,IAAI,EAAE,GAAGC;IACjB,MAAM,EAAEC,EAAE,EAAE,GAAGC;IACf,MAAM,EAAEC,oBAAoB,EAAE,GAAGC,cAAc;QAC3CL;IACJ;IACA,MAAM,EAAEM,eAAe,EAAE,GAAGC,sBAAsB,OAAO,CAAC,IAAI,CAAC,MAAM;IAErE,IAAI,CAACL,GAAG,WAAW,CAAC,aAAa,CAACF,OAC9B,OAAO;IAGX,OAAO,WAAP,GACI,oBAACM,iBAAAA;QACG,oBAAM,oBAACE,gBAAMA;QACb,OAAO;QACP,UAAUJ;QACV,eAAa;;AAGzB"}

package/presentation/FileList/components/Table/Actions/EditFile.js

@@ -0,0 +1,19 @@
+import react from "react";
+import { ReactComponent } from "@webiny/icons/edit.svg";
+import { FileManagerViewConfig } from "../../../../config/FileManagerViewConfig.js";
+import { useFileManagerPresenter } from "../../../FileManagerPresenterProvider.js";
+import { useFile } from "../../../../hooks/useFile.js";
+const EditFile = ()=>{
+    const { file } = useFile();
+    const { actions } = useFileManagerPresenter();
+    const { OptionsMenuItem } = FileManagerViewConfig.Browser.File.Action;
+    return /*#__PURE__*/ react.createElement(OptionsMenuItem, {
+        icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+        label: "Edit",
+        onAction: ()=>actions.showFileDetails(file.id),
+        "data-testid": "aco.actions.file.edit"
+    });
+};
+export { EditFile };
+
+//# sourceMappingURL=EditFile.js.map

package/presentation/FileList/components/Table/Actions/EditFile.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/FileList/components/Table/Actions/EditFile.js","sources":["../../../../../../src/presentation/FileList/components/Table/Actions/EditFile.tsx"],"sourcesContent":["import React from \"react\";\nimport { ReactComponent as Edit } from \"@webiny/icons/edit.svg\";\nimport { FileManagerViewConfig } from \"~/presentation/config/FileManagerViewConfig.js\";\nimport { useFileManagerPresenter } from \"~/presentation/FileList/FileManagerPresenterProvider.js\";\nimport { useFile } from \"~/presentation/hooks/useFile.js\";\n\nexport const EditFile = () => {\n    const { file } = useFile();\n    const { actions } = useFileManagerPresenter();\n    const { OptionsMenuItem } = FileManagerViewConfig.Browser.File.Action;\n\n    return (\n        <OptionsMenuItem\n            icon={<Edit />}\n            label={\"Edit\"}\n            onAction={() => actions.showFileDetails(file.id)}\n            data-testid={\"aco.actions.file.edit\"}\n        />\n    );\n};\n"],"names":["EditFile","file","useFile","actions","useFileManagerPresenter","OptionsMenuItem","FileManagerViewConfig","Edit"],"mappings":";;;;;AAMO,MAAMA,WAAW;IACpB,MAAM,EAAEC,IAAI,EAAE,GAAGC;IACjB,MAAM,EAAEC,OAAO,EAAE,GAAGC;IACpB,MAAM,EAAEC,eAAe,EAAE,GAAGC,sBAAsB,OAAO,CAAC,IAAI,CAAC,MAAM;IAErE,OAAO,WAAP,GACI,oBAACD,iBAAAA;QACG,oBAAM,oBAACE,gBAAIA;QACX,OAAO;QACP,UAAU,IAAMJ,QAAQ,eAAe,CAACF,KAAK,EAAE;QAC/C,eAAa;;AAGzB"}

package/presentation/FileList/components/Table/Actions/MoveFile.js

@@ -0,0 +1,19 @@
+import react from "react";
+import { ReactComponent } from "@webiny/icons/drive_file_move.svg";
+import { FileManagerViewConfig } from "../../../../config/FileManagerViewConfig.js";
+import { useFile } from "../../../../hooks/useFile.js";
+import { useMoveFileToFolder } from "../../../../hooks/useMoveFileToFolder.js";
+const MoveFile = ()=>{
+    const { file } = useFile();
+    const moveFileToFolder = useMoveFileToFolder(file);
+    const { OptionsMenuItem } = FileManagerViewConfig.Browser.File.Action;
+    return /*#__PURE__*/ react.createElement(OptionsMenuItem, {
+        icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+        label: "Move",
+        onAction: moveFileToFolder,
+        "data-testid": "aco.actions.file.move"
+    });
+};
+export { MoveFile };
+
+//# sourceMappingURL=MoveFile.js.map

package/presentation/FileList/components/Table/Actions/MoveFile.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/FileList/components/Table/Actions/MoveFile.js","sources":["../../../../../../src/presentation/FileList/components/Table/Actions/MoveFile.tsx"],"sourcesContent":["import React from \"react\";\nimport { ReactComponent as Move } from \"@webiny/icons/drive_file_move.svg\";\nimport { FileManagerViewConfig } from \"~/presentation/config/FileManagerViewConfig.js\";\nimport { useFile } from \"~/presentation/hooks/useFile.js\";\nimport { useMoveFileToFolder } from \"~/presentation/hooks/useMoveFileToFolder.js\";\n\nexport const MoveFile = () => {\n    const { file } = useFile();\n    const moveFileToFolder = useMoveFileToFolder(file);\n    const { OptionsMenuItem } = FileManagerViewConfig.Browser.File.Action;\n\n    return (\n        <OptionsMenuItem\n            icon={<Move />}\n            label={\"Move\"}\n            onAction={moveFileToFolder}\n            data-testid={\"aco.actions.file.move\"}\n        />\n    );\n};\n"],"names":["MoveFile","file","useFile","moveFileToFolder","useMoveFileToFolder","OptionsMenuItem","FileManagerViewConfig","Move"],"mappings":";;;;;AAMO,MAAMA,WAAW;IACpB,MAAM,EAAEC,IAAI,EAAE,GAAGC;IACjB,MAAMC,mBAAmBC,oBAAoBH;IAC7C,MAAM,EAAEI,eAAe,EAAE,GAAGC,sBAAsB,OAAO,CAAC,IAAI,CAAC,MAAM;IAErE,OAAO,WAAP,GACI,oBAACD,iBAAAA;QACG,oBAAM,oBAACE,gBAAIA;QACX,OAAO;QACP,UAAUJ;QACV,eAAa;;AAGzB"}

package/presentation/FileList/components/Table/Actions/index.js

@@ -0,0 +1,4 @@
+export * from "./CopyFile.js";
+export * from "./DeleteFile.js";
+export * from "./EditFile.js";
+export * from "./MoveFile.js";

package/presentation/FileList/components/Table/Cells/CellActions.js

@@ -0,0 +1,28 @@
+import react from "react";
+import { OptionsMenu } from "@webiny/app-admin";
+import { FolderProvider } from "@webiny/app-aco";
+import { FileProvider } from "../../../../contexts/FileProvider.js";
+import { FileManagerViewConfig, useFileManagerConfig } from "../../../../config/FileManagerViewConfig.js";
+const CellActions = ()=>{
+    const { useTableRow, isFolderRow } = FileManagerViewConfig.Browser.Table.Column;
+    const { row } = useTableRow();
+    const { browser } = useFileManagerConfig();
+    if (isFolderRow(row)) {
+        if (!row.data.canManageStructure) return null;
+        return /*#__PURE__*/ react.createElement(FolderProvider, {
+            folder: row.data
+        }, /*#__PURE__*/ react.createElement(OptionsMenu, {
+            actions: browser.folder.actions,
+            "data-testid": "table.row.folder.menu-action"
+        }));
+    }
+    return /*#__PURE__*/ react.createElement(FileProvider, {
+        file: row.data
+    }, /*#__PURE__*/ react.createElement(OptionsMenu, {
+        actions: browser.file.actions,
+        "data-testid": "table.row.file.menu-action"
+    }));
+};
+export { CellActions };
+
+//# sourceMappingURL=CellActions.js.map

package/presentation/FileList/components/Table/Cells/CellActions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/FileList/components/Table/Cells/CellActions.js","sources":["../../../../../../src/presentation/FileList/components/Table/Cells/CellActions.tsx"],"sourcesContent":["import React from \"react\";\nimport { OptionsMenu } from \"@webiny/app-admin\";\nimport { FolderProvider } from \"@webiny/app-aco\";\nimport { FileProvider } from \"~/presentation/contexts/FileProvider.js\";\nimport {\n    FileManagerViewConfig,\n    useFileManagerConfig\n} from \"~/presentation/config/FileManagerViewConfig.js\";\n\nexport const CellActions = () => {\n    const { useTableRow, isFolderRow } = FileManagerViewConfig.Browser.Table.Column;\n    const { row } = useTableRow();\n    const { browser } = useFileManagerConfig();\n\n    if (isFolderRow(row)) {\n        if (!row.data.canManageStructure) {\n            return null;\n        }\n\n        return (\n            <FolderProvider folder={row.data}>\n                <OptionsMenu\n                    actions={browser.folder.actions}\n                    data-testid={\"table.row.folder.menu-action\"}\n                />\n            </FolderProvider>\n        );\n    }\n\n    return (\n        <FileProvider file={row.data}>\n            <OptionsMenu\n                actions={browser.file.actions}\n                data-testid={\"table.row.file.menu-action\"}\n            />\n        </FileProvider>\n    );\n};\n"],"names":["CellActions","useTableRow","isFolderRow","FileManagerViewConfig","row","browser","useFileManagerConfig","FolderProvider","OptionsMenu","FileProvider"],"mappings":";;;;;AASO,MAAMA,cAAc;IACvB,MAAM,EAAEC,WAAW,EAAEC,WAAW,EAAE,GAAGC,sBAAsB,OAAO,CAAC,KAAK,CAAC,MAAM;IAC/E,MAAM,EAAEC,GAAG,EAAE,GAAGH;IAChB,MAAM,EAAEI,OAAO,EAAE,GAAGC;IAEpB,IAAIJ,YAAYE,MAAM;QAClB,IAAI,CAACA,IAAI,IAAI,CAAC,kBAAkB,EAC5B,OAAO;QAGX,OAAO,WAAP,GACI,oBAACG,gBAAcA;YAAC,QAAQH,IAAI,IAAI;yBAC5B,oBAACI,aAAWA;YACR,SAASH,QAAQ,MAAM,CAAC,OAAO;YAC/B,eAAa;;IAI7B;IAEA,OAAO,WAAP,GACI,oBAACI,cAAYA;QAAC,MAAML,IAAI,IAAI;qBACxB,oBAACI,aAAWA;QACR,SAASH,QAAQ,IAAI,CAAC,OAAO;QAC7B,eAAa;;AAI7B"}

package/presentation/FileList/components/Table/Cells/CellAuthor.js

@@ -0,0 +1,10 @@
+import react from "react";
+import { FileManagerViewConfig } from "../../../../config/FileManagerViewConfig.js";
+const CellAuthor = ()=>{
+    const { useTableRow } = FileManagerViewConfig.Browser.Table.Column;
+    const { row } = useTableRow();
+    return /*#__PURE__*/ react.createElement(react.Fragment, null, row.data.createdBy.displayName);
+};
+export { CellAuthor };
+
+//# sourceMappingURL=CellAuthor.js.map

package/presentation/FileList/components/Table/Cells/CellAuthor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/FileList/components/Table/Cells/CellAuthor.js","sources":["../../../../../../src/presentation/FileList/components/Table/Cells/CellAuthor.tsx"],"sourcesContent":["import React from \"react\";\nimport { FileManagerViewConfig } from \"~/presentation/config/FileManagerViewConfig.js\";\n\nexport const CellAuthor = () => {\n    const { useTableRow } = FileManagerViewConfig.Browser.Table.Column;\n    const { row } = useTableRow();\n\n    return <>{row.data.createdBy.displayName}</>;\n};\n"],"names":["CellAuthor","useTableRow","FileManagerViewConfig","row"],"mappings":";;AAGO,MAAMA,aAAa;IACtB,MAAM,EAAEC,WAAW,EAAE,GAAGC,sBAAsB,OAAO,CAAC,KAAK,CAAC,MAAM;IAClE,MAAM,EAAEC,GAAG,EAAE,GAAGF;IAEhB,OAAO,WAAP,GAAO,0CAAGE,IAAI,IAAI,CAAC,SAAS,CAAC,WAAW;AAC5C"}

package/presentation/FileList/components/Table/Cells/CellCreated.js

@@ -0,0 +1,13 @@
+import react from "react";
+import { TimeAgo } from "@webiny/admin-ui";
+import { FileManagerViewConfig } from "../../../../config/FileManagerViewConfig.js";
+const CellCreated = ()=>{
+    const { useTableRow } = FileManagerViewConfig.Browser.Table.Column;
+    const { row } = useTableRow();
+    return /*#__PURE__*/ react.createElement(TimeAgo, {
+        datetime: row.data.createdOn
+    });
+};
+export { CellCreated };
+
+//# sourceMappingURL=CellCreated.js.map

package/presentation/FileList/components/Table/Cells/CellCreated.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/FileList/components/Table/Cells/CellCreated.js","sources":["../../../../../../src/presentation/FileList/components/Table/Cells/CellCreated.tsx"],"sourcesContent":["import React from \"react\";\nimport { TimeAgo } from \"@webiny/admin-ui\";\nimport { FileManagerViewConfig } from \"~/presentation/config/FileManagerViewConfig.js\";\n\nexport const CellCreated = () => {\n    const { useTableRow } = FileManagerViewConfig.Browser.Table.Column;\n    const { row } = useTableRow();\n\n    return <TimeAgo datetime={row.data.createdOn} />;\n};\n"],"names":["CellCreated","useTableRow","FileManagerViewConfig","row","TimeAgo"],"mappings":";;;AAIO,MAAMA,cAAc;IACvB,MAAM,EAAEC,WAAW,EAAE,GAAGC,sBAAsB,OAAO,CAAC,KAAK,CAAC,MAAM;IAClE,MAAM,EAAEC,GAAG,EAAE,GAAGF;IAEhB,OAAO,WAAP,GAAO,oBAACG,SAAOA;QAAC,UAAUD,IAAI,IAAI,CAAC,SAAS;;AAChD"}

package/presentation/FileList/components/Table/Cells/CellModified.js

@@ -0,0 +1,13 @@
+import react from "react";
+import { TimeAgo } from "@webiny/admin-ui";
+import { FileManagerViewConfig } from "../../../../config/FileManagerViewConfig.js";
+const CellModified = ()=>{
+    const { useTableRow } = FileManagerViewConfig.Browser.Table.Column;
+    const { row } = useTableRow();
+    return /*#__PURE__*/ react.createElement(TimeAgo, {
+        datetime: row.data.savedOn
+    });
+};
+export { CellModified };
+
+//# sourceMappingURL=CellModified.js.map

package/presentation/FileList/components/Table/Cells/CellModified.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/FileList/components/Table/Cells/CellModified.js","sources":["../../../../../../src/presentation/FileList/components/Table/Cells/CellModified.tsx"],"sourcesContent":["import React from \"react\";\nimport { TimeAgo } from \"@webiny/admin-ui\";\nimport { FileManagerViewConfig } from \"~/presentation/config/FileManagerViewConfig.js\";\n\nexport const CellModified = () => {\n    const { useTableRow } = FileManagerViewConfig.Browser.Table.Column;\n    const { row } = useTableRow();\n\n    return <TimeAgo datetime={row.data.savedOn} />;\n};\n"],"names":["CellModified","useTableRow","FileManagerViewConfig","row","TimeAgo"],"mappings":";;;AAIO,MAAMA,eAAe;IACxB,MAAM,EAAEC,WAAW,EAAE,GAAGC,sBAAsB,OAAO,CAAC,KAAK,CAAC,MAAM;IAClE,MAAM,EAAEC,GAAG,EAAE,GAAGF;IAEhB,OAAO,WAAP,GAAO,oBAACG,SAAOA;QAAC,UAAUD,IAAI,IAAI,CAAC,OAAO;;AAC9C"}

package/presentation/FileList/components/Table/Cells/CellName.d.ts

@@ -0,0 +1,16 @@
+import React from "react";
+import type { FolderDto } from "@webiny/app-aco";
+import type { FileItem } from "../../../../../domain/types.js";
+interface DefaultProps {
+    onClick: (id: string) => void;
+}
+interface FolderCellNameProps extends DefaultProps {
+    folder: FolderDto;
+}
+export declare const FolderCellName: ({ folder, onClick }: FolderCellNameProps) => React.JSX.Element;
+interface FileCellNameProps extends DefaultProps {
+    file: FileItem;
+}
+export declare const FileCellName: ({ file, onClick }: FileCellNameProps) => React.JSX.Element;
+export declare const CellName: () => React.JSX.Element;
+export {};

package/presentation/FileList/components/Table/Cells/CellName.js

@@ -0,0 +1,59 @@
+import react from "react";
+import { FolderIcon, FolderSharedIcon } from "@webiny/app-aco";
+import { FileManagerViewConfig } from "../../../../config/FileManagerViewConfig.js";
+import { useFileManagerPresenter } from "../../../FileManagerPresenterProvider.js";
+import { Text, cn } from "@webiny/admin-ui";
+import { CellThumbnail } from "./CellThumbnail.js";
+import { FileProvider } from "../../../../contexts/FileProvider.js";
+const FolderCellName = ({ folder, onClick })=>{
+    let icon = /*#__PURE__*/ react.createElement(FolderIcon, {
+        width: 32,
+        height: 32
+    });
+    if (folder.hasNonInheritedPermissions && folder.canManagePermissions) icon = /*#__PURE__*/ react.createElement(FolderSharedIcon, {
+        width: 32,
+        height: 32
+    });
+    return /*#__PURE__*/ react.createElement("div", {
+        className: cn([
+            "flex items-center gap-md",
+            "truncate cursor-pointer font-semibold",
+            "hover:underline"
+        ]),
+        onClick: ()=>onClick(folder.id)
+    }, /*#__PURE__*/ react.createElement("div", {
+        className: "size-xl rounded-md overflow-hidden flex-shrink-0"
+    }, icon), /*#__PURE__*/ react.createElement(Text, {
+        className: "truncate min-w-0 flex-shrink"
+    }, folder.title));
+};
+const FileCellName = ({ file, onClick })=>/*#__PURE__*/ react.createElement("div", {
+        className: cn([
+            "flex items-center gap-md",
+            "truncate cursor-pointer",
+            "hover:underline"
+        ]),
+        onClick: ()=>onClick(file.id)
+    }, /*#__PURE__*/ react.createElement(FileProvider, {
+        file: file
+    }, /*#__PURE__*/ react.createElement("div", {
+        className: "size-xl aspect-square rounded-md bg-neutral-muted overflow-hidden flex-shrink-0"
+    }, /*#__PURE__*/ react.createElement(CellThumbnail, null))), /*#__PURE__*/ react.createElement(Text, {
+        className: "truncate min-w-0 flex-shrink"
+    }, file.name));
+const CellName = ()=>{
+    const { useTableRow, isFolderRow } = FileManagerViewConfig.Browser.Table.Column;
+    const { row } = useTableRow();
+    const { actions } = useFileManagerPresenter();
+    if (isFolderRow(row)) return /*#__PURE__*/ react.createElement(FolderCellName, {
+        folder: row.data,
+        onClick: (id)=>actions.folders.selectFolder(id)
+    });
+    return /*#__PURE__*/ react.createElement(FileCellName, {
+        file: row.data,
+        onClick: (id)=>actions.showFileDetails(id)
+    });
+};
+export { CellName, FileCellName, FolderCellName };
+
+//# sourceMappingURL=CellName.js.map

package/presentation/FileList/components/Table/Cells/CellName.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/FileList/components/Table/Cells/CellName.js","sources":["../../../../../../src/presentation/FileList/components/Table/Cells/CellName.tsx"],"sourcesContent":["import React from \"react\";\nimport { FolderIcon, FolderSharedIcon } from \"@webiny/app-aco\";\nimport { FileManagerViewConfig } from \"~/presentation/config/FileManagerViewConfig.js\";\nimport { useFileManagerPresenter } from \"~/presentation/FileList/FileManagerPresenterProvider.js\";\nimport type { FolderDto } from \"@webiny/app-aco\";\nimport { cn, Text } from \"@webiny/admin-ui\";\nimport { CellThumbnail } from \"./CellThumbnail.js\";\nimport { FileProvider } from \"~/presentation/contexts/FileProvider.js\";\nimport type { FileItem } from \"~/domain/types.js\";\n\ninterface DefaultProps {\n    onClick: (id: string) => void;\n}\n\ninterface FolderCellNameProps extends DefaultProps {\n    folder: FolderDto;\n}\n\nexport const FolderCellName = ({ folder, onClick }: FolderCellNameProps) => {\n    let icon = <FolderIcon width={32} height={32} />;\n    if (folder.hasNonInheritedPermissions && folder.canManagePermissions) {\n        icon = <FolderSharedIcon width={32} height={32} />;\n    }\n\n    return (\n        <div\n            className={cn([\n                \"flex items-center gap-md\",\n                \"truncate cursor-pointer font-semibold\",\n                \"hover:underline\"\n            ])}\n            onClick={() => onClick(folder.id)}\n        >\n            <div className={\"size-xl rounded-md overflow-hidden flex-shrink-0\"}>{icon}</div>\n            <Text className={\"truncate min-w-0 flex-shrink\"}>{folder.title}</Text>\n        </div>\n    );\n};\n\ninterface FileCellNameProps extends DefaultProps {\n    file: FileItem;\n}\n\nexport const FileCellName = ({ file, onClick }: FileCellNameProps) => {\n    return (\n        <div\n            className={cn([\n                \"flex items-center gap-md\",\n                \"truncate cursor-pointer\",\n                \"hover:underline\"\n            ])}\n            onClick={() => onClick(file.id)}\n        >\n            <FileProvider file={file}>\n                <div\n                    className={\n                        \"size-xl aspect-square rounded-md bg-neutral-muted overflow-hidden flex-shrink-0\"\n                    }\n                >\n                    <CellThumbnail />\n                </div>\n            </FileProvider>\n            <Text className={\"truncate min-w-0 flex-shrink\"}>{file.name}</Text>\n        </div>\n    );\n};\n\nexport const CellName = () => {\n    const { useTableRow, isFolderRow } = FileManagerViewConfig.Browser.Table.Column;\n    const { row } = useTableRow();\n    const { actions } = useFileManagerPresenter();\n\n    if (isFolderRow(row)) {\n        return (\n            <FolderCellName folder={row.data} onClick={id => actions.folders.selectFolder(id)} />\n        );\n    }\n\n    return <FileCellName file={row.data} onClick={id => actions.showFileDetails(id)} />;\n};\n"],"names":["FolderCellName","folder","onClick","icon","FolderIcon","FolderSharedIcon","cn","Text","FileCellName","file","FileProvider","CellThumbnail","CellName","useTableRow","isFolderRow","FileManagerViewConfig","row","actions","useFileManagerPresenter","id"],"mappings":";;;;;;;AAkBO,MAAMA,iBAAiB,CAAC,EAAEC,MAAM,EAAEC,OAAO,EAAuB;IACnE,IAAIC,OAAO,WAAPA,GAAO,oBAACC,YAAUA;QAAC,OAAO;QAAI,QAAQ;;IAC1C,IAAIH,OAAO,0BAA0B,IAAIA,OAAO,oBAAoB,EAChEE,OAAO,WAAPA,GAAO,oBAACE,kBAAgBA;QAAC,OAAO;QAAI,QAAQ;;IAGhD,OAAO,WAAP,GACI,oBAAC;QACG,WAAWC,GAAG;YACV;YACA;YACA;SACH;QACD,SAAS,IAAMJ,QAAQD,OAAO,EAAE;qBAEhC,oBAAC;QAAI,WAAW;OAAqDE,OAAAA,WAAAA,GACrE,oBAACI,MAAIA;QAAC,WAAW;OAAiCN,OAAO,KAAK;AAG1E;AAMO,MAAMO,eAAe,CAAC,EAAEC,IAAI,EAAEP,OAAO,EAAqB,GACtD,WAAP,GACI,oBAAC;QACG,WAAWI,GAAG;YACV;YACA;YACA;SACH;QACD,SAAS,IAAMJ,QAAQO,KAAK,EAAE;qBAE9B,oBAACC,cAAYA;QAAC,MAAMD;qBAChB,oBAAC;QACG,WACI;qBAGJ,oBAACE,eAAaA,SAAAA,WAAAA,GAGtB,oBAACJ,MAAIA;QAAC,WAAW;OAAiCE,KAAK,IAAI;AAKhE,MAAMG,WAAW;IACpB,MAAM,EAAEC,WAAW,EAAEC,WAAW,EAAE,GAAGC,sBAAsB,OAAO,CAAC,KAAK,CAAC,MAAM;IAC/E,MAAM,EAAEC,GAAG,EAAE,GAAGH;IAChB,MAAM,EAAEI,OAAO,EAAE,GAAGC;IAEpB,IAAIJ,YAAYE,MACZ,OAAO,WAAP,GACI,oBAAChB,gBAAcA;QAAC,QAAQgB,IAAI,IAAI;QAAE,SAASG,CAAAA,KAAMF,QAAQ,OAAO,CAAC,YAAY,CAACE;;IAItF,OAAO,WAAP,GAAO,oBAACX,cAAYA;QAAC,MAAMQ,IAAI,IAAI;QAAE,SAASG,CAAAA,KAAMF,QAAQ,eAAe,CAACE;;AAChF"}

package/presentation/FileList/components/Table/Cells/CellSize.js

@@ -0,0 +1,14 @@
+import react from "react";
+import bytes from "bytes";
+import { FileManagerViewConfig } from "../../../../config/FileManagerViewConfig.js";
+const CellSize = ()=>{
+    const { useTableRow, isFolderRow } = FileManagerViewConfig.Browser.Table.Column;
+    const { row } = useTableRow();
+    if (isFolderRow(row)) return /*#__PURE__*/ react.createElement(react.Fragment, null, "-");
+    return /*#__PURE__*/ react.createElement(react.Fragment, null, bytes.format(row.data.size, {
+        unitSeparator: " "
+    }));
+};
+export { CellSize };
+
+//# sourceMappingURL=CellSize.js.map

package/presentation/FileList/components/Table/Cells/CellSize.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/FileList/components/Table/Cells/CellSize.js","sources":["../../../../../../src/presentation/FileList/components/Table/Cells/CellSize.tsx"],"sourcesContent":["import React from \"react\";\nimport bytes from \"bytes\";\nimport { FileManagerViewConfig } from \"~/presentation/config/FileManagerViewConfig.js\";\n\nexport const CellSize = () => {\n    const { useTableRow, isFolderRow } = FileManagerViewConfig.Browser.Table.Column;\n    const { row } = useTableRow();\n\n    if (isFolderRow(row)) {\n        return <>{\"-\"}</>;\n    }\n\n    return <>{bytes.format(row.data.size, { unitSeparator: \" \" })}</>;\n};\n"],"names":["CellSize","useTableRow","isFolderRow","FileManagerViewConfig","row","bytes"],"mappings":";;;AAIO,MAAMA,WAAW;IACpB,MAAM,EAAEC,WAAW,EAAEC,WAAW,EAAE,GAAGC,sBAAsB,OAAO,CAAC,KAAK,CAAC,MAAM;IAC/E,MAAM,EAAEC,GAAG,EAAE,GAAGH;IAEhB,IAAIC,YAAYE,MACZ,OAAO,WAAP,GAAO,0CAAG;IAGd,OAAO,WAAP,GAAO,0CAAGC,MAAM,MAAM,CAACD,IAAI,IAAI,CAAC,IAAI,EAAE;QAAE,eAAe;IAAI;AAC/D"}

package/presentation/FileList/components/Table/Cells/CellThumbnail.js

@@ -0,0 +1,12 @@
+import react from "react";
+import { useFile } from "../../../../hooks/useFile.js";
+import { useFileManagerConfig } from "../../../../config/FileManagerViewConfig.js";
+const CellThumbnail = ()=>{
+    const { file } = useFile();
+    const { browser, getThumbnailRenderer } = useFileManagerConfig();
+    const renderer = getThumbnailRenderer(browser.table.cellThumbnails, file);
+    return /*#__PURE__*/ react.createElement(react.Fragment, null, renderer?.element || null);
+};
+export { CellThumbnail };
+
+//# sourceMappingURL=CellThumbnail.js.map

package/presentation/FileList/components/Table/Cells/CellThumbnail.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/FileList/components/Table/Cells/CellThumbnail.js","sources":["../../../../../../src/presentation/FileList/components/Table/Cells/CellThumbnail.tsx"],"sourcesContent":["import React from \"react\";\nimport { useFile } from \"~/presentation/hooks/useFile.js\";\nimport { useFileManagerConfig } from \"~/presentation/config/FileManagerViewConfig.js\";\n\nexport const CellThumbnail = () => {\n    const { file } = useFile();\n    const { browser, getThumbnailRenderer } = useFileManagerConfig();\n\n    const renderer = getThumbnailRenderer(browser.table.cellThumbnails, file);\n\n    return <>{renderer?.element || null}</>;\n};\n"],"names":["CellThumbnail","file","useFile","browser","getThumbnailRenderer","useFileManagerConfig","renderer"],"mappings":";;;AAIO,MAAMA,gBAAgB;IACzB,MAAM,EAAEC,IAAI,EAAE,GAAGC;IACjB,MAAM,EAAEC,OAAO,EAAEC,oBAAoB,EAAE,GAAGC;IAE1C,MAAMC,WAAWF,qBAAqBD,QAAQ,KAAK,CAAC,cAAc,EAAEF;IAEpE,OAAO,WAAP,GAAO,0CAAGK,UAAU,WAAW;AACnC"}

package/presentation/FileList/components/Table/Cells/CellType.js

@@ -0,0 +1,11 @@
+import react from "react";
+import { FileManagerViewConfig } from "../../../../config/FileManagerViewConfig.js";
+const CellType = ()=>{
+    const { useTableRow, isFolderRow } = FileManagerViewConfig.Browser.Table.Column;
+    const { row } = useTableRow();
+    if (isFolderRow(row)) return /*#__PURE__*/ react.createElement(react.Fragment, null, "-");
+    return /*#__PURE__*/ react.createElement(react.Fragment, null, row.data.type);
+};
+export { CellType };
+
+//# sourceMappingURL=CellType.js.map

package/presentation/FileList/components/Table/Cells/CellType.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/FileList/components/Table/Cells/CellType.js","sources":["../../../../../../src/presentation/FileList/components/Table/Cells/CellType.tsx"],"sourcesContent":["import React from \"react\";\nimport { FileManagerViewConfig } from \"~/presentation/config/FileManagerViewConfig.js\";\n\nexport const CellType = () => {\n    const { useTableRow, isFolderRow } = FileManagerViewConfig.Browser.Table.Column;\n    const { row } = useTableRow();\n\n    if (isFolderRow(row)) {\n        return <>{\"-\"}</>;\n    }\n\n    return <>{row.data.type}</>;\n};\n"],"names":["CellType","useTableRow","isFolderRow","FileManagerViewConfig","row"],"mappings":";;AAGO,MAAMA,WAAW;IACpB,MAAM,EAAEC,WAAW,EAAEC,WAAW,EAAE,GAAGC,sBAAsB,OAAO,CAAC,KAAK,CAAC,MAAM;IAC/E,MAAM,EAAEC,GAAG,EAAE,GAAGH;IAEhB,IAAIC,YAAYE,MACZ,OAAO,WAAP,GAAO,0CAAG;IAGd,OAAO,WAAP,GAAO,0CAAGA,IAAI,IAAI,CAAC,IAAI;AAC3B"}

package/presentation/FileList/components/Table/Cells/index.js

@@ -0,0 +1,7 @@
+export * from "./CellActions.js";
+export * from "./CellAuthor.js";
+export * from "./CellCreated.js";
+export * from "./CellModified.js";
+export * from "./CellName.js";
+export * from "./CellSize.js";
+export * from "./CellType.js";

package/presentation/FileList/components/Table/FileTable.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+import type { FolderTableRow, RecordTableRow } from "@webiny/app-aco";
+import type { FmFile } from "../../../../features/shared/types.js";
+export type FileTableItem = FolderTableRow | RecordTableRow<FmFile>;
+/**
+ * Table View component driven by FileListPresenter vm.
+ * Bridges the presenter's state to the ACO Table component,
+ * wiring sort and selection actions back to the presenter.
+ */
+export declare const FileTable: (() => React.JSX.Element) & {
+    displayName: string;
+};

package/presentation/FileList/components/Table/FileTable.js

@@ -0,0 +1,79 @@
+import react, { useCallback, useMemo } from "react";
+import { observer } from "mobx-react-lite";
+import { useShiftKey } from "@webiny/app-admin";
+import { useOverlay } from "../../../FileManager/OverlayContext.js";
+import { Table, createRecordsData } from "@webiny/app-aco";
+import { useFileManagerPresenter } from "../../FileManagerPresenterProvider.js";
+import { useFileManagerConfig } from "../../../config/FileManagerViewConfig.js";
+const toFolderTableRows = (folders)=>folders.map((folder)=>({
+            id: folder.id,
+            $type: "FOLDER",
+            $selectable: false,
+            data: folder
+        }));
+const toDataTableSorting = (sort)=>{
+    if (!sort) return [];
+    return [
+        {
+            id: sort.field,
+            desc: "DESC" === sort.direction
+        }
+    ];
+};
+const FileTable_FileTable = observer(function() {
+    const presenter = useFileManagerPresenter();
+    const { browser } = useFileManagerConfig();
+    const { vm, actions } = presenter;
+    const { isPressed: isShiftPressed } = useShiftKey();
+    const overlay = useOverlay();
+    const fileRows = createRecordsData(vm.list.rows);
+    const data = vm.showFolders ? [
+        ...toFolderTableRows(vm.folders.childFolders),
+        ...fileRows
+    ] : fileRows;
+    const selected = createRecordsData(vm.list.rows.filter((file)=>vm.list.selection.selectedIds.has(file.id)));
+    const sorting = useMemo(()=>toDataTableSorting(vm.list.sort), [
+        vm.list.sort
+    ]);
+    const onSortingChange = useCallback((updater)=>{
+        const newSorting = "function" == typeof updater ? updater(sorting) : updater;
+        if (newSorting.length > 0) {
+            const { id, desc } = newSorting[0];
+            actions.sort.set(id, desc ? "DESC" : "ASC");
+        }
+    }, [
+        sorting,
+        actions.sort
+    ]);
+    const onToggleRow = (row)=>{
+        if ("RECORD" !== row.$type) return;
+        if (isShiftPressed()) return void actions.selection.selectRangeTo(row.id);
+        if (overlay) {
+            const file = vm.list.rows.find((f)=>f.id === row.id);
+            if (file) overlay.onFileClick(file);
+            return;
+        }
+        actions.selection.toggle(row.id);
+    };
+    const onSelectRow = useCallback((rows)=>{
+        if (0 === rows.length) return void actions.selection.deselectAll();
+        const ids = rows.filter((row)=>"RECORD" === row.$type).map((row)=>row.id);
+        actions.selection.selectRows(ids);
+    }, [
+        actions.selection
+    ]);
+    return /*#__PURE__*/ react.createElement(Table, {
+        columns: browser.table.columns,
+        data: data,
+        loading: vm.list.pagination.loading,
+        onSelectRow: onSelectRow,
+        onToggleRow: onToggleRow,
+        sorting: sorting,
+        onSortingChange: onSortingChange,
+        selected: selected,
+        namespace: "fm/file/list"
+    });
+});
+export { FileTable_FileTable as FileTable };
+
+//# sourceMappingURL=FileTable.js.map

package/presentation/FileList/components/Table/FileTable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/FileList/components/Table/FileTable.js","sources":["../../../../../src/presentation/FileList/components/Table/FileTable.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from \"react\";\nimport { observer } from \"mobx-react-lite\";\nimport type { DataTableSorting, OnDataTableSortingChange } from \"@webiny/admin-ui\";\nimport { useShiftKey } from \"@webiny/app-admin\";\nimport { useOverlay } from \"~/presentation/FileManager/OverlayContext.js\";\nimport { createRecordsData, Table as AcoTable } from \"@webiny/app-aco\";\nimport type { FolderTableRow, RecordTableRow } from \"@webiny/app-aco\";\nimport { useFileManagerPresenter } from \"../../FileManagerPresenterProvider.js\";\nimport { useFileManagerConfig } from \"~/presentation/config/FileManagerViewConfig.js\";\nimport type { FmFile } from \"~/features/shared/types.js\";\nimport type { FolderDto } from \"@webiny/app-aco\";\n\nexport type FileTableItem = FolderTableRow | RecordTableRow<FmFile>;\n\nconst toFolderTableRows = (folders: FolderDto[]): FolderTableRow[] => {\n    return folders.map(folder => ({\n        id: folder.id,\n        $type: \"FOLDER\" as const,\n        $selectable: false,\n        data: folder\n    }));\n};\n\n/**\n * Convert presenter sort state to DataTable sorting format.\n */\nconst toDataTableSorting = (\n    sort: { field: string; direction: \"ASC\" | \"DESC\" } | null\n): DataTableSorting => {\n    if (!sort) {\n        return [];\n    }\n    return [{ id: sort.field, desc: sort.direction === \"DESC\" }];\n};\n\n/**\n * Table View component driven by FileListPresenter vm.\n * Bridges the presenter's state to the ACO Table component,\n * wiring sort and selection actions back to the presenter.\n */\nexport const FileTable = observer(function FileTable() {\n    const presenter = useFileManagerPresenter();\n    const { browser } = useFileManagerConfig();\n    const { vm, actions } = presenter;\n\n    const { isPressed: isShiftPressed } = useShiftKey();\n    const overlay = useOverlay();\n\n    // No useMemo — MobX observer needs to track these observable accesses during render.\n    const fileRows = createRecordsData(vm.list.rows);\n    const data: FileTableItem[] = vm.showFolders\n        ? [...toFolderTableRows(vm.folders.childFolders), ...fileRows]\n        : fileRows;\n\n    const selected: FileTableItem[] = createRecordsData(\n        vm.list.rows.filter(file => vm.list.selection.selectedIds.has(file.id))\n    );\n\n    // Convert presenter sort state to DataTable format.\n    const sorting = useMemo(() => toDataTableSorting(vm.list.sort), [vm.list.sort]);\n\n    // Handle sorting changes from the DataTable.\n    const onSortingChange: OnDataTableSortingChange = useCallback(\n        updater => {\n            const newSorting = typeof updater === \"function\" ? updater(sorting) : updater;\n            if (newSorting.length > 0) {\n                const { id, desc } = newSorting[0];\n                actions.sort.set(id, desc ? \"DESC\" : \"ASC\");\n            }\n        },\n        [sorting, actions.sort]\n    );\n\n    const onToggleRow = (row: FileTableItem) => {\n        if (row.$type !== \"RECORD\") {\n            return;\n        }\n\n        if (isShiftPressed()) {\n            actions.selection.selectRangeTo(row.id);\n            return;\n        }\n\n        if (overlay) {\n            const file = vm.list.rows.find(f => f.id === row.id);\n            if (file) {\n                overlay.onFileClick(file);\n            }\n            return;\n        }\n\n        actions.selection.toggle(row.id);\n    };\n\n    // Handle select all / bulk selection.\n    const onSelectRow = useCallback(\n        (rows: FileTableItem[] | []) => {\n            if (rows.length === 0) {\n                actions.selection.deselectAll();\n                return;\n            }\n            const ids = rows\n                .filter((row): row is RecordTableRow<FmFile> => row.$type === \"RECORD\")\n                .map(row => row.id);\n            actions.selection.selectRows(ids);\n        },\n        [actions.selection]\n    );\n\n    return (\n        <AcoTable<FileTableItem>\n            columns={browser.table.columns}\n            data={data}\n            loading={vm.list.pagination.loading}\n            onSelectRow={onSelectRow}\n            onToggleRow={onToggleRow}\n            sorting={sorting}\n            onSortingChange={onSortingChange}\n            selected={selected}\n            namespace={\"fm/file/list\"}\n        />\n    );\n});\n"],"names":["toFolderTableRows","folders","folder","toDataTableSorting","sort","FileTable","observer","presenter","useFileManagerPresenter","browser","useFileManagerConfig","vm","actions","isShiftPressed","useShiftKey","overlay","useOverlay","fileRows","createRecordsData","data","selected","file","sorting","useMemo","onSortingChange","useCallback","updater","newSorting","id","desc","onToggleRow","row","f","onSelectRow","rows","ids","AcoTable"],"mappings":";;;;;;;AAcA,MAAMA,oBAAoB,CAACC,UAChBA,QAAQ,GAAG,CAACC,CAAAA,SAAW;YAC1B,IAAIA,OAAO,EAAE;YACb,OAAO;YACP,aAAa;YACb,MAAMA;QACV;AAMJ,MAAMC,qBAAqB,CACvBC;IAEA,IAAI,CAACA,MACD,OAAO,EAAE;IAEb,OAAO;QAAC;YAAE,IAAIA,KAAK,KAAK;YAAE,MAAMA,AAAmB,WAAnBA,KAAK,SAAS;QAAY;KAAE;AAChE;AAOO,MAAMC,sBAAYC,SAAS;IAC9B,MAAMC,YAAYC;IAClB,MAAM,EAAEC,OAAO,EAAE,GAAGC;IACpB,MAAM,EAAEC,EAAE,EAAEC,OAAO,EAAE,GAAGL;IAExB,MAAM,EAAE,WAAWM,cAAc,EAAE,GAAGC;IACtC,MAAMC,UAAUC;IAGhB,MAAMC,WAAWC,kBAAkBP,GAAG,IAAI,CAAC,IAAI;IAC/C,MAAMQ,OAAwBR,GAAG,WAAW,GACtC;WAAIX,kBAAkBW,GAAG,OAAO,CAAC,YAAY;WAAMM;KAAS,GAC5DA;IAEN,MAAMG,WAA4BF,kBAC9BP,GAAG,IAAI,CAAC,IAAI,CAAC,MAAM,CAACU,CAAAA,OAAQV,GAAG,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,GAAG,CAACU,KAAK,EAAE;IAIzE,MAAMC,UAAUC,QAAQ,IAAMpB,mBAAmBQ,GAAG,IAAI,CAAC,IAAI,GAAG;QAACA,GAAG,IAAI,CAAC,IAAI;KAAC;IAG9E,MAAMa,kBAA4CC,YAC9CC,CAAAA;QACI,MAAMC,aAAa,AAAmB,cAAnB,OAAOD,UAAyBA,QAAQJ,WAAWI;QACtE,IAAIC,WAAW,MAAM,GAAG,GAAG;YACvB,MAAM,EAAEC,EAAE,EAAEC,IAAI,EAAE,GAAGF,UAAU,CAAC,EAAE;YAClCf,QAAQ,IAAI,CAAC,GAAG,CAACgB,IAAIC,OAAO,SAAS;QACzC;IACJ,GACA;QAACP;QAASV,QAAQ,IAAI;KAAC;IAG3B,MAAMkB,cAAc,CAACC;QACjB,IAAIA,AAAc,aAAdA,IAAI,KAAK,EACT;QAGJ,IAAIlB,kBAAkB,YAClBD,QAAQ,SAAS,CAAC,aAAa,CAACmB,IAAI,EAAE;QAI1C,IAAIhB,SAAS;YACT,MAAMM,OAAOV,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,CAACqB,CAAAA,IAAKA,EAAE,EAAE,KAAKD,IAAI,EAAE;YACnD,IAAIV,MACAN,QAAQ,WAAW,CAACM;YAExB;QACJ;QAEAT,QAAQ,SAAS,CAAC,MAAM,CAACmB,IAAI,EAAE;IACnC;IAGA,MAAME,cAAcR,YAChB,CAACS;QACG,IAAIA,AAAgB,MAAhBA,KAAK,MAAM,EAAQ,YACnBtB,QAAQ,SAAS,CAAC,WAAW;QAGjC,MAAMuB,MAAMD,KACP,MAAM,CAAC,CAACH,MAAuCA,AAAc,aAAdA,IAAI,KAAK,EACxD,GAAG,CAACA,CAAAA,MAAOA,IAAI,EAAE;QACtBnB,QAAQ,SAAS,CAAC,UAAU,CAACuB;IACjC,GACA;QAACvB,QAAQ,SAAS;KAAC;IAGvB,OAAO,WAAP,GACI,oBAACwB,OAAQA;QACL,SAAS3B,QAAQ,KAAK,CAAC,OAAO;QAC9B,MAAMU;QACN,SAASR,GAAG,IAAI,CAAC,UAAU,CAAC,OAAO;QACnC,aAAasB;QACb,aAAaH;QACb,SAASR;QACT,iBAAiBE;QACjB,UAAUJ;QACV,WAAW;;AAGvB"}

package/presentation/FileList/components/Table/FileTable.test.d.ts

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