@webiny/app-aco 5.42.4-beta.0 → 5.43.0-beta.1

package/components/AdvancedSearch/domain/Filter.d.ts

@@ -30,54 +30,54 @@ export declare const filterValidationSchema: zod.ZodObject<{
             condition: zod.ZodString;
             value: zod.ZodUnion<[zod.ZodBoolean, zod.ZodNumber, zod.ZodString, zod.ZodArray<zod.ZodUnion<[zod.ZodBoolean, zod.ZodNumber, zod.ZodString]>, "atleastone">]>;
         }, "strip", zod.ZodTypeAny, {
-            value: string | number | boolean | [string | number | boolean, ...(string | number | boolean)[]];
             field: string;
             condition: string;
-        }, {
             value: string | number | boolean | [string | number | boolean, ...(string | number | boolean)[]];
+        }, {
             field: string;
             condition: string;
+            value: string | number | boolean | [string | number | boolean, ...(string | number | boolean)[]];
         }>, "many">;
     }, "strip", zod.ZodTypeAny, {
+        operation: Operation;
         filters: {
-            value: string | number | boolean | [string | number | boolean, ...(string | number | boolean)[]];
             field: string;
             condition: string;
+            value: string | number | boolean | [string | number | boolean, ...(string | number | boolean)[]];
         }[];
-        operation: Operation;
     }, {
+        operation: Operation;
         filters: {
-            value: string | number | boolean | [string | number | boolean, ...(string | number | boolean)[]];
             field: string;
             condition: string;
+            value: string | number | boolean | [string | number | boolean, ...(string | number | boolean)[]];
         }[];
-        operation: Operation;
     }>, "many">;
 }, "strip", zod.ZodTypeAny, {
+    name: string;
+    description: string;
+    operation: Operation;
     groups: {
+        operation: Operation;
         filters: {
-            value: string | number | boolean | [string | number | boolean, ...(string | number | boolean)[]];
             field: string;
             condition: string;
+            value: string | number | boolean | [string | number | boolean, ...(string | number | boolean)[]];
         }[];
-        operation: Operation;
     }[];
+    id?: string | null | undefined;
+}, {
     name: string;
     description: string;
     operation: Operation;
-    id?: string | null | undefined;
-}, {
     groups: {
+        operation: Operation;
         filters: {
-            value: string | number | boolean | [string | number | boolean, ...(string | number | boolean)[]];
             field: string;
             condition: string;
+            value: string | number | boolean | [string | number | boolean, ...(string | number | boolean)[]];
         }[];
-        operation: Operation;
     }[];
-    name: string;
-    description: string;
-    operation: Operation;
     id?: string | null | undefined;
 }>;
 export declare class Filter {
@@ -91,30 +91,30 @@ export declare class Filter {
     static createEmpty(): Filter;
     static create(data: FilterDTO): Filter;
     static validate(data: FilterDTO): zod.SafeParseReturnType<{
+        name: string;
+        description: string;
+        operation: Operation;
         groups: {
+            operation: Operation;
             filters: {
-                value: string | number | boolean | [string | number | boolean, ...(string | number | boolean)[]];
                 field: string;
                 condition: string;
+                value: string | number | boolean | [string | number | boolean, ...(string | number | boolean)[]];
             }[];
-            operation: Operation;
         }[];
+        id?: string | null | undefined;
+    }, {
         name: string;
         description: string;
         operation: Operation;
-        id?: string | null | undefined;
-    }, {
         groups: {
+            operation: Operation;
             filters: {
-                value: string | number | boolean | [string | number | boolean, ...(string | number | boolean)[]];
                 field: string;
                 condition: string;
+                value: string | number | boolean | [string | number | boolean, ...(string | number | boolean)[]];
             }[];
-            operation: Operation;
         }[];
-        name: string;
-        description: string;
-        operation: Operation;
         id?: string | null | undefined;
     }>;
     protected constructor(data: {

package/components/FolderTree/List/index.js

@@ -30,6 +30,9 @@ var List = exports.List = function List(_ref) {
     updateFolder = _useUpdateFolder.updateFolder;
   var _useGetFolderLevelPer = (0, _features.useGetFolderLevelPermission)("canManageStructure"),
     canManageStructure = _useGetFolderLevelPer.getFolderLevelPermission;
+  var _useListFoldersByPare = (0, _features.useListFoldersByParentIds)(),
+    listFoldersByParentIds = _useListFoldersByPare.listFoldersByParentIds,
+    getIsFolderLoading = _useListFoldersByPare.getIsFolderLoading;
   var _useSnackbar = (0, _appAdmin.useSnackbar)(),
     showSnackbar = _useSnackbar.showSnackbar;
   var _useState = (0, _react.useState)([]),
@@ -48,12 +51,12 @@ var List = exports.List = function List(_ref) {
     if (folders) {
       setTreeData((0, _utils.createTreeData)(folders, focusedFolderId, hiddenFolderIds));
     }
-  }, [folders, focusedFolderId]);
+  }, [folders, focusedFolderId, hiddenFolderIds]);
+  var memoCreateInitialOpenList = (0, _react.useCallback)(function (focusedFolderId) {
+    return (0, _utils.createInitialOpenList)(folders, openFolderIds, focusedFolderId);
+  }, [folders, openFolderIds]);
   (0, _react.useEffect)(function () {
-    if (!folders) {
-      return;
-    }
-    setInitialOpenList((0, _utils.createInitialOpenList)(folders, openFolderIds, focusedFolderId));
+    setInitialOpenList(memoCreateInitialOpenList(focusedFolderId));
   }, [focusedFolderId]);
   var handleDrop = async function handleDrop(newTree, _ref2) {
     var dragSourceId = _ref2.dragSourceId,
@@ -87,13 +90,36 @@ var List = exports.List = function List(_ref) {
       });
     };
   }, []);
-  var handleChangeOpen = function handleChangeOpen(folderIds) {
-    setOpenFolderIds([_constants.ROOT_FOLDER].concat((0, _toConsumableArray2.default)(folderIds)));
+  var handleChangeOpen = async function handleChangeOpen(folderIds) {
+    setOpenFolderIds((0, _toConsumableArray2.default)(new Set([_constants.ROOT_FOLDER].concat((0, _toConsumableArray2.default)(folderIds)))));
+    var filteredFolderIds = folderIds.filter(function (item) {
+      return item !== _constants.ROOT_FOLDER && item !== "0";
+    });
+    await listFoldersByParentIds(filteredFolderIds);
   };
   var _canDrag = (0, _react.useCallback)(function (folderId) {
     var isRootFolder = folderId === _constants.ROOT_FOLDER;
     return !isRootFolder && canManageStructure(folderId);
   }, [canManageStructure]);
+  var renderNode = (0, _react.useCallback)(function (node, _ref3) {
+    var depth = _ref3.depth,
+      isOpen = _ref3.isOpen,
+      onToggle = _ref3.onToggle;
+    var folder = folders.find(function (folder) {
+      return folder.id === node.id;
+    });
+    return /*#__PURE__*/_react.default.createElement(_folder.FolderProvider, {
+      folder: folder
+    }, /*#__PURE__*/_react.default.createElement(_Node.Node, {
+      node: node,
+      depth: depth,
+      isOpen: isOpen,
+      onToggle: onToggle,
+      isLoading: getIsFolderLoading(folder?.id),
+      enableActions: enableActions,
+      onClick: onFolderClick
+    }));
+  }, [folders, getIsFolderLoading, enableActions, onFolderClick]);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_reactDnd.DndProvider, {
     backend: _reactDndTreeview.MultiBackend,
     options: (0, _reactDndTreeview.getBackendOptions)(),
@@ -109,26 +135,7 @@ var List = exports.List = function List(_ref) {
     canDrag: function canDrag(item) {
       return _canDrag(item.id);
     },
-    render: function render(node, _ref3) {
-      var depth = _ref3.depth,
-        isOpen = _ref3.isOpen,
-        onToggle = _ref3.onToggle;
-      var folder = folders.find(function (folder) {
-        return folder.id === node.id;
-      });
-      return /*#__PURE__*/_react.default.createElement(_folder.FolderProvider, {
-        folder: folder
-      }, /*#__PURE__*/_react.default.createElement(_Node.Node, {
-        node: node,
-        depth: depth,
-        isOpen: isOpen,
-        enableActions: enableActions,
-        onToggle: onToggle,
-        onClick: function onClick(data) {
-          return onFolderClick(data);
-        }
-      }));
-    },
+    render: renderNode,
     dragPreviewRender: function dragPreviewRender(monitorProps) {
       return /*#__PURE__*/_react.default.createElement(_NodePreview.NodePreview, {
         monitorProps: monitorProps

package/components/FolderTree/List/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_reactDndTreeview","_appAdmin","_reactDnd","_Node","_NodePreview","_Placeholder","_utils","_features","_constants","_folder","List","exports","_ref","folders","onFolderClick","focusedFolderId","hiddenFolderIds","enableActions","_useUpdateFolder","useUpdateFolder","updateFolder","_useGetFolderLevelPer","useGetFolderLevelPermission","canManageStructure","getFolderLevelPermission","_useSnackbar","useSnackbar","showSnackbar","_useState","useState","_useState2","_slicedToArray2","default","treeData","setTreeData","_useState3","_useState4","initialOpenList","setInitialOpenList","_useState5","ROOT_FOLDER","_useState6","openFolderIds","setOpenFolderIds","useEffect","createTreeData","createInitialOpenList","handleDrop","newTree","_ref2","dragSourceId","dropTargetId","oldTree","_toConsumableArray2","item","find","folder","id","Error","_objectSpread2","parentId","error","message","sort","useMemo","a","b","text","localeCompare","undefined","numeric","handleChangeOpen","folderIds","concat","canDrag","useCallback","folderId","isRootFolder","createElement","Fragment","DndProvider","backend","MultiBackend","options","getBackendOptions","context","window","Tree","tree","rootId","onDrop","onChangeOpen","ids","render","node","_ref3","depth","isOpen","onToggle","FolderProvider","Node","onClick","data","dragPreviewRender","monitorProps","NodePreview","classes","dropTarget","draggingSource","placeholder","initialOpen","placeholderRender","_","_ref4","Placeholder"],"sources":["index.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport {\n    DropOptions,\n    getBackendOptions,\n    InitialOpen,\n    MultiBackend,\n    NodeModel,\n    Tree\n} from \"@minoru/react-dnd-treeview\";\nimport { useSnackbar } from \"@webiny/app-admin\";\nimport { DndProvider } from \"react-dnd\";\nimport { Node } from \"../Node\";\nimport { NodePreview } from \"../NodePreview\";\nimport { Placeholder } from \"../Placeholder\";\nimport { createInitialOpenList, createTreeData } from \"./utils\";\nimport { useGetFolderLevelPermission, useUpdateFolder } from \"~/features\";\nimport { ROOT_FOLDER } from \"~/constants\";\nimport { DndFolderItemData, FolderItem } from \"~/types\";\nimport { FolderProvider } from \"~/contexts/folder\";\n\ninterface ListProps {\n    folders: FolderItem[];\n    focusedFolderId?: string;\n    hiddenFolderIds?: string[];\n    enableActions?: boolean;\n    onFolderClick: (data: FolderItem) => void;\n}\n\nexport const List = ({\n    folders,\n    onFolderClick,\n    focusedFolderId,\n    hiddenFolderIds,\n    enableActions\n}: ListProps) => {\n    const { updateFolder } = useUpdateFolder();\n    const { getFolderLevelPermission: canManageStructure } =\n        useGetFolderLevelPermission(\"canManageStructure\");\n    const { showSnackbar } = useSnackbar();\n    const [treeData, setTreeData] = useState<NodeModel<DndFolderItemData>[]>([]);\n    const [initialOpenList, setInitialOpenList] = useState<undefined | InitialOpen>();\n    const [openFolderIds, setOpenFolderIds] = useState<string[]>([ROOT_FOLDER]);\n\n    useEffect(() => {\n        if (folders) {\n            setTreeData(createTreeData(folders, focusedFolderId, hiddenFolderIds));\n        }\n    }, [folders, focusedFolderId]);\n\n    useEffect(() => {\n        if (!folders) {\n            return;\n        }\n        setInitialOpenList(createInitialOpenList(folders, openFolderIds, focusedFolderId));\n    }, [focusedFolderId]);\n\n    const handleDrop = async (\n        newTree: NodeModel<DndFolderItemData>[],\n        { dragSourceId, dropTargetId }: DropOptions\n    ) => {\n        // Store the current state of the tree before the drop action\n        const oldTree = [...treeData];\n        try {\n            const item = folders.find(folder => folder.id === dragSourceId);\n\n            if (!item) {\n                throw new Error(\"Folder not found!\");\n            }\n\n            setTreeData(newTree);\n\n            await updateFolder({\n                ...item,\n                parentId: dropTargetId !== ROOT_FOLDER ? (dropTargetId as string) : null\n            });\n        } catch (error) {\n            // If an error occurred, revert the tree back to its previous state\n            setTreeData(oldTree);\n            return showSnackbar(error.message);\n        }\n    };\n\n    const sort = useMemo(\n        () => (a: NodeModel<DndFolderItemData>, b: NodeModel<DndFolderItemData>) => {\n            if (a.id === ROOT_FOLDER || b.id === ROOT_FOLDER) {\n                return 1;\n            }\n            return a.text.localeCompare(b.text, undefined, { numeric: true });\n        },\n        []\n    );\n\n    const handleChangeOpen = (folderIds: string[]) => {\n        setOpenFolderIds([ROOT_FOLDER, ...folderIds]);\n    };\n\n    const canDrag = useCallback(\n        (folderId: string) => {\n            const isRootFolder = folderId === ROOT_FOLDER;\n            return !isRootFolder && canManageStructure(folderId);\n        },\n        [canManageStructure]\n    );\n\n    return (\n        <>\n            <DndProvider backend={MultiBackend} options={getBackendOptions()} context={window}>\n                <Tree\n                    tree={treeData}\n                    rootId={\"0\"}\n                    onDrop={handleDrop}\n                    onChangeOpen={ids => handleChangeOpen(ids as string[])}\n                    sort={sort}\n                    canDrag={item => canDrag(item!.id as string)}\n                    render={(node, { depth, isOpen, onToggle }) => {\n                        const folder = folders.find(folder => folder.id === node.id);\n\n                        return (\n                            <FolderProvider folder={folder}>\n                                <Node\n                                    node={node}\n                                    depth={depth}\n                                    isOpen={isOpen}\n                                    enableActions={enableActions}\n                                    onToggle={onToggle}\n                                    onClick={data => onFolderClick(data)}\n                                />\n                            </FolderProvider>\n                        );\n                    }}\n                    dragPreviewRender={monitorProps => <NodePreview monitorProps={monitorProps} />}\n                    classes={{\n                        dropTarget: \"dropTarget\",\n                        draggingSource: \"draggingSource\",\n                        placeholder: \"placeholderContainer\"\n                    }}\n                    initialOpen={initialOpenList}\n                    placeholderRender={(_, { depth }) => <Placeholder depth={depth} />}\n                />\n            </DndProvider>\n        </>\n    );\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireWildcard","require","_reactDndTreeview","_appAdmin","_reactDnd","_Node","_NodePreview","_Placeholder","_utils","_features","_constants","_folder","List","exports","_ref","folders","onFolderClick","focusedFolderId","hiddenFolderIds","enableActions","_useUpdateFolder","useUpdateFolder","updateFolder","_useGetFolderLevelPer","useGetFolderLevelPermission","canManageStructure","getFolderLevelPermission","_useListFoldersByPare","useListFoldersByParentIds","listFoldersByParentIds","getIsFolderLoading","_useSnackbar","useSnackbar","showSnackbar","_useState","useState","_useState2","_slicedToArray2","default","treeData","setTreeData","_useState3","_useState4","initialOpenList","setInitialOpenList","_useState5","ROOT_FOLDER","_useState6","openFolderIds","setOpenFolderIds","useEffect","createTreeData","memoCreateInitialOpenList","useCallback","createInitialOpenList","handleDrop","newTree","_ref2","dragSourceId","dropTargetId","oldTree","_toConsumableArray2","item","find","folder","id","Error","_objectSpread2","parentId","error","message","sort","useMemo","a","b","text","localeCompare","undefined","numeric","handleChangeOpen","folderIds","Set","concat","filteredFolderIds","filter","canDrag","folderId","isRootFolder","renderNode","node","_ref3","depth","isOpen","onToggle","createElement","FolderProvider","Node","isLoading","onClick","Fragment","DndProvider","backend","MultiBackend","options","getBackendOptions","context","window","Tree","tree","rootId","onDrop","onChangeOpen","ids","render","dragPreviewRender","monitorProps","NodePreview","classes","dropTarget","draggingSource","placeholder","initialOpen","placeholderRender","_","_ref4","Placeholder"],"sources":["index.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport {\n    DropOptions,\n    getBackendOptions,\n    InitialOpen,\n    MultiBackend,\n    NodeModel,\n    Tree\n} from \"@minoru/react-dnd-treeview\";\nimport { useSnackbar } from \"@webiny/app-admin\";\nimport { DndProvider } from \"react-dnd\";\nimport { Node } from \"../Node\";\nimport { NodePreview } from \"../NodePreview\";\nimport { Placeholder } from \"../Placeholder\";\nimport { createInitialOpenList, createTreeData } from \"./utils\";\nimport {\n    useGetFolderLevelPermission,\n    useListFoldersByParentIds,\n    useUpdateFolder\n} from \"~/features\";\nimport { ROOT_FOLDER } from \"~/constants\";\nimport { DndFolderItemData, FolderItem } from \"~/types\";\nimport { FolderProvider } from \"~/contexts/folder\";\n\ninterface ListProps {\n    folders: FolderItem[];\n    focusedFolderId?: string;\n    hiddenFolderIds?: string[];\n    enableActions?: boolean;\n    onFolderClick: (data: FolderItem) => void;\n}\n\nexport const List = ({\n    folders,\n    onFolderClick,\n    focusedFolderId,\n    hiddenFolderIds,\n    enableActions\n}: ListProps) => {\n    const { updateFolder } = useUpdateFolder();\n    const { getFolderLevelPermission: canManageStructure } =\n        useGetFolderLevelPermission(\"canManageStructure\");\n    const { listFoldersByParentIds, getIsFolderLoading } = useListFoldersByParentIds();\n    const { showSnackbar } = useSnackbar();\n    const [treeData, setTreeData] = useState<NodeModel<DndFolderItemData>[]>([]);\n    const [initialOpenList, setInitialOpenList] = useState<undefined | InitialOpen>();\n    const [openFolderIds, setOpenFolderIds] = useState<string[]>([ROOT_FOLDER]);\n\n    useEffect(() => {\n        if (folders) {\n            setTreeData(createTreeData(folders, focusedFolderId, hiddenFolderIds));\n        }\n    }, [folders, focusedFolderId, hiddenFolderIds]);\n\n    const memoCreateInitialOpenList = useCallback(\n        (focusedFolderId?: string) => {\n            return createInitialOpenList(folders, openFolderIds, focusedFolderId);\n        },\n        [folders, openFolderIds]\n    );\n\n    useEffect(() => {\n        setInitialOpenList(memoCreateInitialOpenList(focusedFolderId));\n    }, [focusedFolderId]);\n\n    const handleDrop = async (\n        newTree: NodeModel<DndFolderItemData>[],\n        { dragSourceId, dropTargetId }: DropOptions\n    ) => {\n        // Store the current state of the tree before the drop action\n        const oldTree = [...treeData];\n        try {\n            const item = folders.find(folder => folder.id === dragSourceId);\n\n            if (!item) {\n                throw new Error(\"Folder not found!\");\n            }\n\n            setTreeData(newTree);\n\n            await updateFolder({\n                ...item,\n                parentId: dropTargetId !== ROOT_FOLDER ? (dropTargetId as string) : null\n            });\n        } catch (error) {\n            // If an error occurred, revert the tree back to its previous state\n            setTreeData(oldTree);\n            return showSnackbar(error.message);\n        }\n    };\n\n    const sort = useMemo(\n        () => (a: NodeModel<DndFolderItemData>, b: NodeModel<DndFolderItemData>) => {\n            if (a.id === ROOT_FOLDER || b.id === ROOT_FOLDER) {\n                return 1;\n            }\n            return a.text.localeCompare(b.text, undefined, { numeric: true });\n        },\n        []\n    );\n\n    const handleChangeOpen = async (folderIds: string[]) => {\n        setOpenFolderIds([...new Set([ROOT_FOLDER, ...folderIds])]);\n        const filteredFolderIds = folderIds.filter(item => item !== ROOT_FOLDER && item !== \"0\");\n        await listFoldersByParentIds(filteredFolderIds);\n    };\n\n    const canDrag = useCallback(\n        (folderId: string) => {\n            const isRootFolder = folderId === ROOT_FOLDER;\n            return !isRootFolder && canManageStructure(folderId);\n        },\n        [canManageStructure]\n    );\n\n    const renderNode = useCallback(\n        (node: NodeModel<DndFolderItemData>, { depth, isOpen, onToggle }: any) => {\n            const folder = folders.find(folder => folder.id === node.id);\n            return (\n                <FolderProvider folder={folder}>\n                    <Node\n                        node={node}\n                        depth={depth}\n                        isOpen={isOpen}\n                        onToggle={onToggle}\n                        isLoading={getIsFolderLoading(folder?.id)}\n                        enableActions={enableActions}\n                        onClick={onFolderClick}\n                    />\n                </FolderProvider>\n            );\n        },\n        [folders, getIsFolderLoading, enableActions, onFolderClick]\n    );\n\n    return (\n        <>\n            <DndProvider backend={MultiBackend} options={getBackendOptions()} context={window}>\n                <Tree\n                    tree={treeData}\n                    rootId={\"0\"}\n                    onDrop={handleDrop}\n                    onChangeOpen={ids => handleChangeOpen(ids as string[])}\n                    sort={sort}\n                    canDrag={item => canDrag(item!.id as string)}\n                    render={renderNode}\n                    dragPreviewRender={monitorProps => <NodePreview monitorProps={monitorProps} />}\n                    classes={{\n                        dropTarget: \"dropTarget\",\n                        draggingSource: \"draggingSource\",\n                        placeholder: \"placeholderContainer\"\n                    }}\n                    initialOpen={initialOpenList}\n                    placeholderRender={(_, { depth }) => <Placeholder depth={depth} />}\n                />\n            </DndProvider>\n        </>\n    );\n};\n"],"mappings":"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","ignoreList":[]}

package/components/FolderTree/Node/index.d.ts

@@ -5,6 +5,7 @@ type NodeProps = {
     node: NodeModel<DndFolderItemData>;
     depth: number;
     isOpen: boolean;
+    isLoading?: boolean;
     enableActions?: boolean;
     onToggle: (id: string | number) => void;
     onClick: (data: FolderItem) => void;
@@ -14,9 +15,10 @@ type FolderProps = {
     isRoot: boolean;
     isOpen: boolean;
     isFocused?: boolean;
+    isLoading?: boolean;
     hasNonInheritedPermissions?: boolean;
     canManagePermissions?: boolean;
 };
 export declare const FolderNode: ({ isRoot, isFocused, hasNonInheritedPermissions, canManagePermissions, text }: FolderProps) => React.JSX.Element;
-export declare const Node: ({ node, depth, isOpen, enableActions, onToggle, onClick }: NodeProps) => React.JSX.Element;
+export declare const Node: ({ node, depth, isOpen, enableActions, onToggle, onClick, isLoading }: NodeProps) => React.JSX.Element;
 export {};

package/components/FolderTree/Node/index.js

@@ -16,6 +16,7 @@ var _styled = require("./styled");
 var _utils = require("@webiny/utils");
 var _constants = require("../../../constants");
 var _hooks = require("../../../hooks");
+var _Progress = require("@webiny/ui/Progress");
 var FolderNode = exports.FolderNode = function FolderNode(_ref) {
   var isRoot = _ref.isRoot,
     isFocused = _ref.isFocused,
@@ -35,48 +36,76 @@ var FolderNode = exports.FolderNode = function FolderNode(_ref) {
     use: "body2"
   }, text));
 };
-var Node = exports.Node = function Node(_ref2) {
-  var node = _ref2.node,
-    depth = _ref2.depth,
+var FolderIndicator = function FolderIndicator(_ref2) {
+  var isLoading = _ref2.isLoading,
     isOpen = _ref2.isOpen,
-    enableActions = _ref2.enableActions,
-    onToggle = _ref2.onToggle,
-    onClick = _ref2.onClick;
+    onToggle = _ref2.onToggle;
   var _useFolder = (0, _hooks.useFolder)(),
     folder = _useFolder.folder;
   var isRoot = folder.id === _constants.ROOT_FOLDER;
-  // Move the placeholder line to the left based on the element depth within the tree.
-  // Let's add some pixels so that the element is detached from the container but takes up the whole length while it's highlighted during dnd.
-  var indent = depth === 1 ? 4 : (depth - 1) * 20 + 8;
-  var dragOverProps = (0, _reactDndTreeview.useDragOver)(folder.id, isOpen, onToggle);
   var handleToggle = function handleToggle(e) {
     e.stopPropagation();
     onToggle(folder.id);
   };
+  if (isRoot) {
+    return null;
+  }
+  if (isLoading) {
+    return /*#__PURE__*/_react.default.createElement(_styled.LoaderContainer, null, /*#__PURE__*/_react.default.createElement(_Progress.CircularProgress, {
+      size: 12,
+      spinnerWidth: 2,
+      spinnerColor: "#d9d9d9",
+      style: {
+        background: "transparent"
+      }
+    }));
+  }
+  return /*#__PURE__*/_react.default.createElement(_styled.ArrowIcon, {
+    isOpen: isOpen,
+    onClick: handleToggle
+  }, /*#__PURE__*/_react.default.createElement(_arrow_right.ReactComponent, null));
+};
+var Node = exports.Node = function Node(_ref3) {
+  var node = _ref3.node,
+    depth = _ref3.depth,
+    isOpen = _ref3.isOpen,
+    enableActions = _ref3.enableActions,
+    onToggle = _ref3.onToggle,
+    onClick = _ref3.onClick,
+    isLoading = _ref3.isLoading;
+  var _useFolder2 = (0, _hooks.useFolder)(),
+    folder = _useFolder2.folder;
+  var isRoot = folder.id === _constants.ROOT_FOLDER;
+  // Move the placeholder line to the left based on the element depth within the tree.
+  // Let's add some pixels so that the element is detached from the container but takes up the whole length while it's highlighted during dnd.
+  var indent = depth === 1 ? 4 : (depth - 1) * 20 + 8;
+  var dragOverProps = (0, _reactDndTreeview.useDragOver)(folder.id, isOpen, onToggle);
   var handleClick = function handleClick(e) {
     e.stopPropagation();
-    onClick(folder);
     if (folder.id !== _constants.ROOT_FOLDER) {
       onToggle(folder.id);
     }
+    onClick(folder);
   };
   var id = (0, _react.useMemo)(function () {
     var _parseIdentifier = (0, _utils.parseIdentifier)(String(folder.id)),
       id = _parseIdentifier.id;
     return id;
   }, [folder.id]);
-  var _ref3 = folder || {},
-    hasNonInheritedPermissions = _ref3.hasNonInheritedPermissions,
-    canManagePermissions = _ref3.canManagePermissions;
+  var _ref4 = folder || {},
+    hasNonInheritedPermissions = _ref4.hasNonInheritedPermissions,
+    canManagePermissions = _ref4.canManagePermissions;
   return /*#__PURE__*/_react.default.createElement(_styled.Container, Object.assign({
     isFocused: !!node.data?.isFocused,
+    isLoading: isLoading,
     style: {
       paddingInlineStart: indent
     }
-  }, dragOverProps), isRoot ? null : /*#__PURE__*/_react.default.createElement(_styled.ArrowIcon, {
+  }, dragOverProps), /*#__PURE__*/_react.default.createElement(FolderIndicator, {
+    isLoading: isLoading,
     isOpen: isOpen,
-    onClick: handleToggle
-  }, /*#__PURE__*/_react.default.createElement(_arrow_right.ReactComponent, null)), /*#__PURE__*/_react.default.createElement(_styled.Content, {
+    onToggle: onToggle
+  }), /*#__PURE__*/_react.default.createElement(_styled.Content, {
     onClick: handleClick,
     className: "aco-folder-".concat(id)
   }, /*#__PURE__*/_react.default.createElement(FolderNode, {

package/components/FolderTree/Node/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_arrow_right","_folderFill","_folder_sharedFill","_home","_reactDndTreeview","_MenuActions","_styled","_utils","_constants","_hooks","FolderNode","exports","_ref","isRoot","isFocused","hasNonInheritedPermissions","canManagePermissions","text","icon","default","createElement","ReactComponent","Fragment","FolderIcon","Text","className","use","Node","_ref2","node","depth","isOpen","enableActions","onToggle","onClick","_useFolder","useFolder","folder","id","ROOT_FOLDER","indent","dragOverProps","useDragOver","handleToggle","e","stopPropagation","handleClick","useMemo","_parseIdentifier","parseIdentifier","String","_ref3","Container","Object","assign","data","style","paddingInlineStart","ArrowIcon","Content","concat","MenuActions"],"sources":["index.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport { ReactComponent as ArrowRight } from \"@material-symbols/svg-400/rounded/arrow_right.svg\";\nimport { ReactComponent as Folder } from \"@material-symbols/svg-400/rounded/folder-fill.svg\";\nimport { ReactComponent as FolderShared } from \"@material-symbols/svg-400/rounded/folder_shared-fill.svg\";\nimport { ReactComponent as HomeIcon } from \"@material-design-icons/svg/filled/home.svg\";\nimport { NodeModel, useDragOver } from \"@minoru/react-dnd-treeview\";\nimport { MenuActions } from \"../MenuActions\";\nimport { Container, ArrowIcon, FolderIcon, Text, Content } from \"./styled\";\nimport { DndFolderItemData, FolderItem } from \"~/types\";\nimport { parseIdentifier } from \"@webiny/utils\";\nimport { ROOT_FOLDER } from \"~/constants\";\nimport { useFolder } from \"~/hooks\";\n\ntype NodeProps = {\n    node: NodeModel<DndFolderItemData>;\n    depth: number;\n    isOpen: boolean;\n    enableActions?: boolean;\n    onToggle: (id: string | number) => void;\n    onClick: (data: FolderItem) => void;\n};\n\ntype FolderProps = {\n    text: string;\n    isRoot: boolean;\n    isOpen: boolean;\n    isFocused?: boolean;\n    hasNonInheritedPermissions?: boolean;\n    canManagePermissions?: boolean;\n};\n\nexport const FolderNode = ({\n    isRoot,\n    isFocused,\n    hasNonInheritedPermissions,\n    canManagePermissions,\n    text\n}: FolderProps) => {\n    let icon = <HomeIcon />;\n\n    if (!isRoot) {\n        if (hasNonInheritedPermissions && canManagePermissions) {\n            icon = <FolderShared />;\n        } else {\n            icon = <Folder />;\n        }\n    }\n\n    return (\n        <>\n            <FolderIcon>{icon}</FolderIcon>\n            <Text className={isFocused ? \"focused\" : \"\"} use={\"body2\"}>\n                {text}\n            </Text>\n        </>\n    );\n};\n\nexport const Node = ({ node, depth, isOpen, enableActions, onToggle, onClick }: NodeProps) => {\n    const { folder } = useFolder();\n    const isRoot = folder.id === ROOT_FOLDER;\n    // Move the placeholder line to the left based on the element depth within the tree.\n    // Let's add some pixels so that the element is detached from the container but takes up the whole length while it's highlighted during dnd.\n    const indent = depth === 1 ? 4 : (depth - 1) * 20 + 8;\n\n    const dragOverProps = useDragOver(folder.id, isOpen, onToggle);\n\n    const handleToggle = (e: React.MouseEvent) => {\n        e.stopPropagation();\n        onToggle(folder.id);\n    };\n\n    const handleClick = (e: React.MouseEvent) => {\n        e.stopPropagation();\n        onClick(folder);\n        if (folder.id !== ROOT_FOLDER) {\n            onToggle(folder.id);\n        }\n    };\n\n    const id = useMemo(() => {\n        const { id } = parseIdentifier(String(folder.id));\n        return id;\n    }, [folder.id]);\n\n    const { hasNonInheritedPermissions, canManagePermissions } = folder || {};\n\n    return (\n        <Container\n            isFocused={!!node.data?.isFocused}\n            style={{ paddingInlineStart: indent }}\n            {...dragOverProps}\n        >\n            {isRoot ? null : (\n                <ArrowIcon isOpen={isOpen} onClick={handleToggle}>\n                    <ArrowRight />\n                </ArrowIcon>\n            )}\n            <Content onClick={handleClick} className={`aco-folder-${id}`}>\n                <FolderNode\n                    isRoot={isRoot}\n                    text={node.text}\n                    hasNonInheritedPermissions={hasNonInheritedPermissions}\n                    canManagePermissions={canManagePermissions}\n                    isOpen={isRoot ? true : isOpen}\n                    isFocused={!!node.data?.isFocused}\n                />\n            </Content>\n            {enableActions && !isRoot && <MenuActions />}\n        </Container>\n    );\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireWildcard","require","_arrow_right","_folderFill","_folder_sharedFill","_home","_reactDndTreeview","_MenuActions","_styled","_utils","_constants","_hooks","_Progress","FolderNode","exports","_ref","isRoot","isFocused","hasNonInheritedPermissions","canManagePermissions","text","icon","default","createElement","ReactComponent","Fragment","FolderIcon","Text","className","use","FolderIndicator","_ref2","isLoading","isOpen","onToggle","_useFolder","useFolder","folder","id","ROOT_FOLDER","handleToggle","e","stopPropagation","LoaderContainer","CircularProgress","size","spinnerWidth","spinnerColor","style","background","ArrowIcon","onClick","Node","_ref3","node","depth","enableActions","_useFolder2","indent","dragOverProps","useDragOver","handleClick","useMemo","_parseIdentifier","parseIdentifier","String","_ref4","Container","Object","assign","data","paddingInlineStart","Content","concat","MenuActions"],"sources":["index.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport { ReactComponent as ArrowRight } from \"@material-symbols/svg-400/rounded/arrow_right.svg\";\nimport { ReactComponent as Folder } from \"@material-symbols/svg-400/rounded/folder-fill.svg\";\nimport { ReactComponent as FolderShared } from \"@material-symbols/svg-400/rounded/folder_shared-fill.svg\";\nimport { ReactComponent as HomeIcon } from \"@material-design-icons/svg/filled/home.svg\";\nimport { NodeModel, useDragOver } from \"@minoru/react-dnd-treeview\";\nimport { MenuActions } from \"../MenuActions\";\nimport { Container, ArrowIcon, FolderIcon, Text, Content, LoaderContainer } from \"./styled\";\nimport { DndFolderItemData, FolderItem } from \"~/types\";\nimport { parseIdentifier } from \"@webiny/utils\";\nimport { ROOT_FOLDER } from \"~/constants\";\nimport { useFolder } from \"~/hooks\";\nimport { CircularProgress } from \"@webiny/ui/Progress\";\n\ntype NodeProps = {\n    node: NodeModel<DndFolderItemData>;\n    depth: number;\n    isOpen: boolean;\n    isLoading?: boolean;\n    enableActions?: boolean;\n    onToggle: (id: string | number) => void;\n    onClick: (data: FolderItem) => void;\n};\n\ntype FolderProps = {\n    text: string;\n    isRoot: boolean;\n    isOpen: boolean;\n    isFocused?: boolean;\n    isLoading?: boolean;\n    hasNonInheritedPermissions?: boolean;\n    canManagePermissions?: boolean;\n};\n\nexport const FolderNode = ({\n    isRoot,\n    isFocused,\n    hasNonInheritedPermissions,\n    canManagePermissions,\n    text\n}: FolderProps) => {\n    let icon = <HomeIcon />;\n\n    if (!isRoot) {\n        if (hasNonInheritedPermissions && canManagePermissions) {\n            icon = <FolderShared />;\n        } else {\n            icon = <Folder />;\n        }\n    }\n\n    return (\n        <>\n            <FolderIcon>{icon}</FolderIcon>\n            <Text className={isFocused ? \"focused\" : \"\"} use={\"body2\"}>\n                {text}\n            </Text>\n        </>\n    );\n};\n\ntype FolderIndicatorProps = Pick<NodeProps, \"isLoading\" | \"isOpen\" | \"onToggle\">;\n\nconst FolderIndicator = ({ isLoading, isOpen, onToggle }: FolderIndicatorProps) => {\n    const { folder } = useFolder();\n    const isRoot = folder.id === ROOT_FOLDER;\n\n    const handleToggle = (e: React.MouseEvent) => {\n        e.stopPropagation();\n        onToggle(folder.id);\n    };\n\n    if (isRoot) {\n        return null;\n    }\n\n    if (isLoading) {\n        return (\n            <LoaderContainer>\n                <CircularProgress\n                    size={12}\n                    spinnerWidth={2}\n                    spinnerColor={\"#d9d9d9\"}\n                    style={{ background: \"transparent\" }}\n                />\n            </LoaderContainer>\n        );\n    }\n\n    return (\n        <ArrowIcon isOpen={isOpen} onClick={handleToggle}>\n            <ArrowRight />\n        </ArrowIcon>\n    );\n};\n\nexport const Node = ({\n    node,\n    depth,\n    isOpen,\n    enableActions,\n    onToggle,\n    onClick,\n    isLoading\n}: NodeProps) => {\n    const { folder } = useFolder();\n    const isRoot = folder.id === ROOT_FOLDER;\n    // Move the placeholder line to the left based on the element depth within the tree.\n    // Let's add some pixels so that the element is detached from the container but takes up the whole length while it's highlighted during dnd.\n    const indent = depth === 1 ? 4 : (depth - 1) * 20 + 8;\n\n    const dragOverProps = useDragOver(folder.id, isOpen, onToggle);\n\n    const handleClick = (e: React.MouseEvent) => {\n        e.stopPropagation();\n        if (folder.id !== ROOT_FOLDER) {\n            onToggle(folder.id);\n        }\n        onClick(folder);\n    };\n\n    const id = useMemo(() => {\n        const { id } = parseIdentifier(String(folder.id));\n        return id;\n    }, [folder.id]);\n\n    const { hasNonInheritedPermissions, canManagePermissions } = folder || {};\n\n    return (\n        <Container\n            isFocused={!!node.data?.isFocused}\n            isLoading={isLoading}\n            style={{ paddingInlineStart: indent }}\n            {...dragOverProps}\n        >\n            <FolderIndicator isLoading={isLoading} isOpen={isOpen} onToggle={onToggle} />\n            <Content onClick={handleClick} className={`aco-folder-${id}`}>\n                <FolderNode\n                    isRoot={isRoot}\n                    text={node.text}\n                    hasNonInheritedPermissions={hasNonInheritedPermissions}\n                    canManagePermissions={canManagePermissions}\n                    isOpen={isRoot ? true : isOpen}\n                    isFocused={!!node.data?.isFocused}\n                />\n            </Content>\n            {enableActions && !isRoot && <MenuActions />}\n        </Container>\n    );\n};\n"],"mappings":"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","ignoreList":[]}

package/components/FolderTree/Node/styled.d.ts

@@ -1,6 +1,7 @@
 /// <reference types="react" />
 type ContainerProps = {
     isFocused: boolean;
+    isLoading?: boolean;
 };
 type ArrowIconContainerProps = {
     isOpen: boolean;
@@ -32,4 +33,8 @@ export declare const Content: import("@emotion/styled").StyledComponent<{
 export declare const Text: import("@emotion/styled").StyledComponent<import("@webiny/ui/Typography/Typography").TypographyProps & {
     theme?: import("@emotion/react").Theme | undefined;
 }, {}, {}>;
+export declare const LoaderContainer: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export {};