@webiny/app-aco 6.3.0-beta.4 → 6.4.0-beta.0

package/components/FolderTree/List/List.js

@@ -1,4 +1,4 @@
-import React, { useCallback, useEffect, useMemo, useState } from "react";
+import react, { useCallback, useEffect, useMemo, useState } from "react";
 import { Tree } from "@webiny/admin-ui";
 import { useSnackbar } from "@webiny/app-admin";
 import { useGetFolderLevelPermission } from "../../../features/folders/getFolderLevelPermission/index.js";
@@ -10,141 +10,126 @@ import { createInitialOpenList, createTreeData } from "./utils.js";
 import { ROOT_FOLDER } from "../../../constants.js";
 import { FolderProvider } from "../../../contexts/folder.js";
 import { useConfirmMoveFolderDialog } from "../../../dialogs/index.js";
-export const List = ({
-  folders,
-  folderActions,
-  onFolderClick,
-  focusedFolderId,
-  hiddenFolderIds,
-  enableActions,
-  dropConfirmation = false
-}) => {
-  const {
-    listFoldersByParentIds,
-    loading
-  } = useListFoldersByParentIds();
-  const {
-    updateFolder
-  } = useUpdateFolder();
-  const {
-    getFolderLevelPermission: canManageStructure
-  } = useGetFolderLevelPermission("canManageStructure");
-  const {
-    getFolderAncestors
-  } = useGetFolderAncestors();
-  const {
-    showSnackbar
-  } = useSnackbar();
-  const [treeData, setTreeData] = useState([]);
-  const [openFolderIds, setOpenFolderIds] = useState([ROOT_FOLDER]);
-  const {
-    showDialog: showConfirmMoveFolderDialog
-  } = useConfirmMoveFolderDialog();
-  useEffect(() => {
-    setTreeData(createTreeData(folders, focusedFolderId, hiddenFolderIds));
-  }, [folders, focusedFolderId, hiddenFolderIds]);
-  useEffect(() => {
-    setOpenFolderIds(prev => {
-      const expanded = createInitialOpenList(folders, prev, focusedFolderId);
-      return [...new Set([ROOT_FOLDER, ...expanded])];
+const List = ({ folders, folderActions, onFolderClick, focusedFolderId, hiddenFolderIds, enableActions, dropConfirmation = false })=>{
+    const { listFoldersByParentIds, loading } = useListFoldersByParentIds();
+    const { updateFolder } = useUpdateFolder();
+    const { getFolderLevelPermission: canManageStructure } = useGetFolderLevelPermission("canManageStructure");
+    const { getFolderAncestors } = useGetFolderAncestors();
+    const { showSnackbar } = useSnackbar();
+    const [treeData, setTreeData] = useState([]);
+    const [openFolderIds, setOpenFolderIds] = useState([
+        ROOT_FOLDER
+    ]);
+    const { showDialog: showConfirmMoveFolderDialog } = useConfirmMoveFolderDialog();
+    useEffect(()=>{
+        setTreeData(createTreeData(folders, focusedFolderId, hiddenFolderIds));
+    }, [
+        folders,
+        focusedFolderId,
+        hiddenFolderIds
+    ]);
+    useEffect(()=>{
+        setOpenFolderIds((prev)=>{
+            const expanded = createInitialOpenList(folders, prev, focusedFolderId);
+            return [
+                ...new Set([
+                    ROOT_FOLDER,
+                    ...expanded
+                ])
+            ];
+        });
+    }, [
+        focusedFolderId,
+        folders,
+        setOpenFolderIds
+    ]);
+    const handleChangeOpen = async (nodes)=>{
+        const folderIds = nodes.map((node)=>node.id);
+        const updatedOpenIds = [
+            ...new Set([
+                ROOT_FOLDER,
+                ...folderIds
+            ])
+        ];
+        setOpenFolderIds(updatedOpenIds);
+        const fetchableIds = folderIds.filter((id)=>id !== ROOT_FOLDER && "0" !== id);
+        await listFoldersByParentIds(fetchableIds);
+    };
+    const handleDrop = async (_, { dragSourceId, dropTargetId })=>{
+        try {
+            const item = folders.find((folder)=>folder.id === dragSourceId);
+            if (!item) throw new Error("Folder not found!");
+            await updateFolder({
+                ...item,
+                parentId: dropTargetId !== ROOT_FOLDER ? dropTargetId : null
+            });
+        } catch (error) {
+            showSnackbar(error.message);
+        }
+    };
+    const onDrop = useCallback(async (newTree, options)=>{
+        const runDrop = async ()=>handleDrop(newTree, options);
+        if (dropConfirmation) {
+            const { dragSourceId, dropTargetId } = options;
+            const folder = folders.find((f)=>f.id === dragSourceId);
+            const targetFolder = folders.find((f)=>f.id === dropTargetId);
+            if (!folder || !targetFolder) return;
+            showConfirmMoveFolderDialog({
+                folder,
+                targetFolder,
+                onAccept: runDrop
+            });
+        } else await runDrop();
+    }, [
+        folders,
+        dropConfirmation,
+        showConfirmMoveFolderDialog
+    ]);
+    const sort = useMemo(()=>(a, b)=>{
+            if (a.id === ROOT_FOLDER || b.id === ROOT_FOLDER) return 1;
+            return a.label.localeCompare(b.label, void 0, {
+                numeric: true
+            });
+        }, []);
+    const canDrag = useCallback((node)=>node.id !== ROOT_FOLDER && canManageStructure(node.id), [
+        canManageStructure
+    ]);
+    const canDrop = (_, options)=>{
+        const { dragSourceId, dropTargetId } = options;
+        const dropTagetAncestorIds = getFolderAncestors(dropTargetId).map((item)=>item.id);
+        return !(dragSourceId && dropTagetAncestorIds.includes(dragSourceId));
+    };
+    const nodeRenderer = (node)=>{
+        const folder = folders.find((folder)=>folder.id === node.id);
+        return /*#__PURE__*/ react.createElement(FolderProvider, {
+            folder: folder
+        }, /*#__PURE__*/ react.createElement(Node, {
+            enableActions: enableActions,
+            folderActions: folderActions
+        }));
+    };
+    const handleNodeClick = useCallback((node)=>{
+        onFolderClick(node);
+    }, [
+        onFolderClick
+    ]);
+    return /*#__PURE__*/ react.createElement(Tree, {
+        nodes: treeData,
+        rootId: "0",
+        defaultOpenNodeIds: openFolderIds,
+        onChangeOpen: handleChangeOpen,
+        onDrop: onDrop,
+        onNodeClick: handleNodeClick,
+        sort: sort,
+        canDrag: canDrag,
+        canDrop: canDrop,
+        renderer: nodeRenderer,
+        defaultLockedOpenNodeIds: [
+            ROOT_FOLDER
+        ],
+        loadingNodeIds: loading
     });
-  }, [focusedFolderId, folders, setOpenFolderIds]);
-  const handleChangeOpen = async nodes => {
-    const folderIds = nodes.map(node => node.id);
-    const updatedOpenIds = [...new Set([ROOT_FOLDER, ...folderIds])];
-    setOpenFolderIds(updatedOpenIds);
-    const fetchableIds = folderIds.filter(id => id !== ROOT_FOLDER && id !== "0");
-    await listFoldersByParentIds(fetchableIds);
-  };
-  const handleDrop = async (_, {
-    dragSourceId,
-    dropTargetId
-  }) => {
-    try {
-      const item = folders.find(folder => folder.id === dragSourceId);
-      if (!item) {
-        throw new Error("Folder not found!");
-      }
-      await updateFolder({
-        ...item,
-        parentId: dropTargetId !== ROOT_FOLDER ? dropTargetId : null
-      });
-    } catch (error) {
-      showSnackbar(error.message);
-    }
-  };
-  const onDrop = useCallback(async (newTree, options) => {
-    // Function to execute the drop logic
-    const runDrop = async () => handleDrop(newTree, options);
-
-    // If drop confirmation is enabled, show dialog before proceeding
-    if (dropConfirmation) {
-      const {
-        dragSourceId,
-        dropTargetId
-      } = options;
-      const folder = folders.find(f => f.id === dragSourceId);
-      const targetFolder = folders.find(f => f.id === dropTargetId);
-
-      // Abort if either folder is not found
-      if (!folder || !targetFolder) {
-        return;
-      }
-      showConfirmMoveFolderDialog({
-        folder,
-        targetFolder,
-        onAccept: runDrop
-      });
-    } else {
-      // Otherwise, perform the drop immediately
-      await runDrop();
-    }
-  }, [folders, dropConfirmation, showConfirmMoveFolderDialog]);
-  const sort = useMemo(() => (a, b) => {
-    if (a.id === ROOT_FOLDER || b.id === ROOT_FOLDER) {
-      return 1;
-    }
-    return a.label.localeCompare(b.label, undefined, {
-      numeric: true
-    });
-  }, []);
-  const canDrag = useCallback(node => node.id !== ROOT_FOLDER && canManageStructure(node.id), [canManageStructure]);
-  const canDrop = (_, options) => {
-    const {
-      dragSourceId,
-      dropTargetId
-    } = options;
-    const dropTagetAncestorIds = getFolderAncestors(dropTargetId).map(item => item.id);
-
-    // Prevent dropping a folder into itself or its descendants
-    return !(dragSourceId && dropTagetAncestorIds.includes(dragSourceId));
-  };
-  const nodeRenderer = node => {
-    const folder = folders.find(folder => folder.id === node.id);
-    return /*#__PURE__*/React.createElement(FolderProvider, {
-      folder: folder
-    }, /*#__PURE__*/React.createElement(Node, {
-      enableActions: enableActions,
-      folderActions: folderActions
-    }));
-  };
-  const handleNodeClick = useCallback(node => {
-    onFolderClick(node);
-  }, [onFolderClick]);
-  return /*#__PURE__*/React.createElement(Tree, {
-    nodes: treeData,
-    rootId: "0",
-    defaultOpenNodeIds: openFolderIds,
-    onChangeOpen: handleChangeOpen,
-    onDrop: onDrop,
-    onNodeClick: handleNodeClick,
-    sort: sort,
-    canDrag: canDrag,
-    canDrop: canDrop,
-    renderer: nodeRenderer,
-    defaultLockedOpenNodeIds: [ROOT_FOLDER],
-    loadingNodeIds: loading
-  });
 };
+export { List };
 
 //# sourceMappingURL=List.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["React","useCallback","useEffect","useMemo","useState","Tree","useSnackbar","useGetFolderLevelPermission","useListFoldersByParentIds","useGetFolderAncestors","useUpdateFolder","Node","createInitialOpenList","createTreeData","ROOT_FOLDER","FolderProvider","useConfirmMoveFolderDialog","List","folders","folderActions","onFolderClick","focusedFolderId","hiddenFolderIds","enableActions","dropConfirmation","listFoldersByParentIds","loading","updateFolder","getFolderLevelPermission","canManageStructure","getFolderAncestors","showSnackbar","treeData","setTreeData","openFolderIds","setOpenFolderIds","showDialog","showConfirmMoveFolderDialog","prev","expanded","Set","handleChangeOpen","nodes","folderIds","map","node","id","updatedOpenIds","fetchableIds","filter","handleDrop","_","dragSourceId","dropTargetId","item","find","folder","Error","parentId","error","message","onDrop","newTree","options","runDrop","f","targetFolder","onAccept","sort","a","b","label","localeCompare","undefined","numeric","canDrag","canDrop","dropTagetAncestorIds","includes","nodeRenderer","createElement","handleNodeClick","rootId","defaultOpenNodeIds","onChangeOpen","onNodeClick","renderer","defaultLockedOpenNodeIds","loadingNodeIds"],"sources":["List.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport {\n    Tree,\n    type NodeDto,\n    type TreeProps,\n    type WithDefaultNodeData,\n    type DropOptions\n} from \"@webiny/admin-ui\";\nimport { useSnackbar } from \"@webiny/app-admin\";\nimport type { FolderDto } from \"~/domain/folder/FolderDto.js\";\nimport { useGetFolderLevelPermission } from \"~/features/folders/getFolderLevelPermission/index.js\";\nimport { useListFoldersByParentIds } from \"~/features/folders/listFoldersByParentIds/index.js\";\nimport { useGetFolderAncestors } from \"~/features/folders/getFolderAncestors/index.js\";\nimport { useUpdateFolder } from \"~/features/folders/updateFolder/index.js\";\nimport { Node } from \"../Node/index.js\";\nimport { createInitialOpenList, createTreeData } from \"./utils.js\";\nimport { ROOT_FOLDER } from \"~/constants.js\";\nimport { FolderProvider } from \"~/contexts/folder.js\";\nimport { useConfirmMoveFolderDialog } from \"~/dialogs/index.js\";\nimport type { FolderActionConfig } from \"~/config/AcoConfig.js\";\n\ninterface ListProps {\n    folders: FolderDto[];\n    folderActions: FolderActionConfig[];\n    dropConfirmation?: boolean;\n    focusedFolderId?: string;\n    hiddenFolderIds?: string[];\n    enableActions?: boolean;\n    onFolderClick: (data: FolderDto) => void;\n}\n\nexport const List = ({\n    folders,\n    folderActions,\n    onFolderClick,\n    focusedFolderId,\n    hiddenFolderIds,\n    enableActions,\n    dropConfirmation = false\n}: ListProps) => {\n    const { listFoldersByParentIds, loading } = useListFoldersByParentIds();\n    const { updateFolder } = useUpdateFolder();\n    const { getFolderLevelPermission: canManageStructure } =\n        useGetFolderLevelPermission(\"canManageStructure\");\n    const { getFolderAncestors } = useGetFolderAncestors();\n    const { showSnackbar } = useSnackbar();\n\n    const [treeData, setTreeData] = useState<NodeDto<FolderDto>[]>([]);\n    const [openFolderIds, setOpenFolderIds] = useState<string[]>([ROOT_FOLDER]);\n    const { showDialog: showConfirmMoveFolderDialog } = useConfirmMoveFolderDialog();\n\n    useEffect(() => {\n        setTreeData(createTreeData(folders, focusedFolderId, hiddenFolderIds));\n    }, [folders, focusedFolderId, hiddenFolderIds]);\n\n    useEffect(() => {\n        setOpenFolderIds(prev => {\n            const expanded = createInitialOpenList(folders, prev, focusedFolderId);\n            return [...new Set([ROOT_FOLDER, ...expanded])];\n        });\n    }, [focusedFolderId, folders, setOpenFolderIds]);\n\n    const handleChangeOpen: TreeProps[\"onChangeOpen\"] = async nodes => {\n        const folderIds = nodes.map(node => node.id);\n        const updatedOpenIds = [...new Set([ROOT_FOLDER, ...folderIds])];\n        setOpenFolderIds(updatedOpenIds);\n\n        const fetchableIds = folderIds.filter(id => id !== ROOT_FOLDER && id !== \"0\");\n        await listFoldersByParentIds(fetchableIds);\n    };\n\n    const handleDrop: TreeProps[\"onDrop\"] = async (_, { dragSourceId, dropTargetId }) => {\n        try {\n            const item = folders.find(folder => folder.id === dragSourceId);\n            if (!item) {\n                throw new Error(\"Folder not found!\");\n            }\n\n            await updateFolder({\n                ...item,\n                parentId: dropTargetId !== ROOT_FOLDER ? (dropTargetId as string) : null\n            });\n        } catch (error) {\n            showSnackbar(error.message);\n        }\n    };\n\n    const onDrop = useCallback<NonNullable<TreeProps[\"onDrop\"]>>(\n        async (newTree, options: DropOptions) => {\n            // Function to execute the drop logic\n            const runDrop = async () => handleDrop(newTree, options);\n\n            // If drop confirmation is enabled, show dialog before proceeding\n            if (dropConfirmation) {\n                const { dragSourceId, dropTargetId } = options;\n                const folder = folders.find(f => f.id === dragSourceId);\n                const targetFolder = folders.find(f => f.id === dropTargetId);\n\n                // Abort if either folder is not found\n                if (!folder || !targetFolder) {\n                    return;\n                }\n\n                showConfirmMoveFolderDialog({\n                    folder,\n                    targetFolder,\n                    onAccept: runDrop\n                });\n            } else {\n                // Otherwise, perform the drop immediately\n                await runDrop();\n            }\n        },\n        [folders, dropConfirmation, showConfirmMoveFolderDialog]\n    );\n\n    const sort = useMemo(\n        () => (a: NodeDto<any>, b: NodeDto<any>) => {\n            if (a.id === ROOT_FOLDER || b.id === ROOT_FOLDER) {\n                return 1;\n            }\n            return a.label.localeCompare(b.label, undefined, { numeric: true });\n        },\n        []\n    );\n\n    const canDrag: TreeProps<FolderDto>[\"canDrag\"] = useCallback(\n        (node: NodeDto<FolderDto>) => node.id !== ROOT_FOLDER && canManageStructure(node.id),\n        [canManageStructure]\n    );\n\n    const canDrop: TreeProps<FolderDto>[\"canDrop\"] = (_, options: DropOptions<FolderDto>) => {\n        const { dragSourceId, dropTargetId } = options;\n        const dropTagetAncestorIds = getFolderAncestors(dropTargetId).map(item => item.id);\n\n        // Prevent dropping a folder into itself or its descendants\n        return !(dragSourceId && dropTagetAncestorIds.includes(dragSourceId));\n    };\n\n    const nodeRenderer: TreeProps<FolderDto>[\"renderer\"] = node => {\n        const folder = folders.find(folder => folder.id === node.id);\n        return (\n            <FolderProvider folder={folder}>\n                <Node enableActions={enableActions} folderActions={folderActions} />\n            </FolderProvider>\n        );\n    };\n\n    const handleNodeClick = useCallback(\n        (node: WithDefaultNodeData<FolderDto>) => {\n            onFolderClick(node);\n        },\n        [onFolderClick]\n    );\n\n    return (\n        <Tree<FolderDto>\n            nodes={treeData}\n            rootId={\"0\"}\n            defaultOpenNodeIds={openFolderIds}\n            onChangeOpen={handleChangeOpen}\n            onDrop={onDrop}\n            onNodeClick={handleNodeClick}\n            sort={sort}\n            canDrag={canDrag}\n            canDrop={canDrop}\n            renderer={nodeRenderer}\n            defaultLockedOpenNodeIds={[ROOT_FOLDER]}\n            loadingNodeIds={loading}\n        />\n    );\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"components/FolderTree/List/List.js","sources":["../../../../src/components/FolderTree/List/List.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport {\n    Tree,\n    type NodeDto,\n    type TreeProps,\n    type WithDefaultNodeData,\n    type DropOptions\n} from \"@webiny/admin-ui\";\nimport { useSnackbar } from \"@webiny/app-admin\";\nimport type { FolderDto } from \"~/domain/folder/FolderDto.js\";\nimport { useGetFolderLevelPermission } from \"~/features/folders/getFolderLevelPermission/index.js\";\nimport { useListFoldersByParentIds } from \"~/features/folders/listFoldersByParentIds/index.js\";\nimport { useGetFolderAncestors } from \"~/features/folders/getFolderAncestors/index.js\";\nimport { useUpdateFolder } from \"~/features/folders/updateFolder/index.js\";\nimport { Node } from \"../Node/index.js\";\nimport { createInitialOpenList, createTreeData } from \"./utils.js\";\nimport { ROOT_FOLDER } from \"~/constants.js\";\nimport { FolderProvider } from \"~/contexts/folder.js\";\nimport { useConfirmMoveFolderDialog } from \"~/dialogs/index.js\";\nimport type { FolderActionConfig } from \"~/config/AcoConfig.js\";\n\ninterface ListProps {\n    folders: FolderDto[];\n    folderActions: FolderActionConfig[];\n    dropConfirmation?: boolean;\n    focusedFolderId?: string;\n    hiddenFolderIds?: string[];\n    enableActions?: boolean;\n    onFolderClick: (data: FolderDto) => void;\n}\n\nexport const List = ({\n    folders,\n    folderActions,\n    onFolderClick,\n    focusedFolderId,\n    hiddenFolderIds,\n    enableActions,\n    dropConfirmation = false\n}: ListProps) => {\n    const { listFoldersByParentIds, loading } = useListFoldersByParentIds();\n    const { updateFolder } = useUpdateFolder();\n    const { getFolderLevelPermission: canManageStructure } =\n        useGetFolderLevelPermission(\"canManageStructure\");\n    const { getFolderAncestors } = useGetFolderAncestors();\n    const { showSnackbar } = useSnackbar();\n\n    const [treeData, setTreeData] = useState<NodeDto<FolderDto>[]>([]);\n    const [openFolderIds, setOpenFolderIds] = useState<string[]>([ROOT_FOLDER]);\n    const { showDialog: showConfirmMoveFolderDialog } = useConfirmMoveFolderDialog();\n\n    useEffect(() => {\n        setTreeData(createTreeData(folders, focusedFolderId, hiddenFolderIds));\n    }, [folders, focusedFolderId, hiddenFolderIds]);\n\n    useEffect(() => {\n        setOpenFolderIds(prev => {\n            const expanded = createInitialOpenList(folders, prev, focusedFolderId);\n            return [...new Set([ROOT_FOLDER, ...expanded])];\n        });\n    }, [focusedFolderId, folders, setOpenFolderIds]);\n\n    const handleChangeOpen: TreeProps[\"onChangeOpen\"] = async nodes => {\n        const folderIds = nodes.map(node => node.id);\n        const updatedOpenIds = [...new Set([ROOT_FOLDER, ...folderIds])];\n        setOpenFolderIds(updatedOpenIds);\n\n        const fetchableIds = folderIds.filter(id => id !== ROOT_FOLDER && id !== \"0\");\n        await listFoldersByParentIds(fetchableIds);\n    };\n\n    const handleDrop: TreeProps[\"onDrop\"] = async (_, { dragSourceId, dropTargetId }) => {\n        try {\n            const item = folders.find(folder => folder.id === dragSourceId);\n            if (!item) {\n                throw new Error(\"Folder not found!\");\n            }\n\n            await updateFolder({\n                ...item,\n                parentId: dropTargetId !== ROOT_FOLDER ? (dropTargetId as string) : null\n            });\n        } catch (error) {\n            showSnackbar(error.message);\n        }\n    };\n\n    const onDrop = useCallback<NonNullable<TreeProps[\"onDrop\"]>>(\n        async (newTree, options: DropOptions) => {\n            // Function to execute the drop logic\n            const runDrop = async () => handleDrop(newTree, options);\n\n            // If drop confirmation is enabled, show dialog before proceeding\n            if (dropConfirmation) {\n                const { dragSourceId, dropTargetId } = options;\n                const folder = folders.find(f => f.id === dragSourceId);\n                const targetFolder = folders.find(f => f.id === dropTargetId);\n\n                // Abort if either folder is not found\n                if (!folder || !targetFolder) {\n                    return;\n                }\n\n                showConfirmMoveFolderDialog({\n                    folder,\n                    targetFolder,\n                    onAccept: runDrop\n                });\n            } else {\n                // Otherwise, perform the drop immediately\n                await runDrop();\n            }\n        },\n        [folders, dropConfirmation, showConfirmMoveFolderDialog]\n    );\n\n    const sort = useMemo(\n        () => (a: NodeDto<any>, b: NodeDto<any>) => {\n            if (a.id === ROOT_FOLDER || b.id === ROOT_FOLDER) {\n                return 1;\n            }\n            return a.label.localeCompare(b.label, undefined, { numeric: true });\n        },\n        []\n    );\n\n    const canDrag: TreeProps<FolderDto>[\"canDrag\"] = useCallback(\n        (node: NodeDto<FolderDto>) => node.id !== ROOT_FOLDER && canManageStructure(node.id),\n        [canManageStructure]\n    );\n\n    const canDrop: TreeProps<FolderDto>[\"canDrop\"] = (_, options: DropOptions<FolderDto>) => {\n        const { dragSourceId, dropTargetId } = options;\n        const dropTagetAncestorIds = getFolderAncestors(dropTargetId).map(item => item.id);\n\n        // Prevent dropping a folder into itself or its descendants\n        return !(dragSourceId && dropTagetAncestorIds.includes(dragSourceId));\n    };\n\n    const nodeRenderer: TreeProps<FolderDto>[\"renderer\"] = node => {\n        const folder = folders.find(folder => folder.id === node.id);\n        return (\n            <FolderProvider folder={folder}>\n                <Node enableActions={enableActions} folderActions={folderActions} />\n            </FolderProvider>\n        );\n    };\n\n    const handleNodeClick = useCallback(\n        (node: WithDefaultNodeData<FolderDto>) => {\n            onFolderClick(node);\n        },\n        [onFolderClick]\n    );\n\n    return (\n        <Tree<FolderDto>\n            nodes={treeData}\n            rootId={\"0\"}\n            defaultOpenNodeIds={openFolderIds}\n            onChangeOpen={handleChangeOpen}\n            onDrop={onDrop}\n            onNodeClick={handleNodeClick}\n            sort={sort}\n            canDrag={canDrag}\n            canDrop={canDrop}\n            renderer={nodeRenderer}\n            defaultLockedOpenNodeIds={[ROOT_FOLDER]}\n            loadingNodeIds={loading}\n        />\n    );\n};\n"],"names":["List","folders","folderActions","onFolderClick","focusedFolderId","hiddenFolderIds","enableActions","dropConfirmation","listFoldersByParentIds","loading","useListFoldersByParentIds","updateFolder","useUpdateFolder","canManageStructure","useGetFolderLevelPermission","getFolderAncestors","useGetFolderAncestors","showSnackbar","useSnackbar","treeData","setTreeData","useState","openFolderIds","setOpenFolderIds","ROOT_FOLDER","showConfirmMoveFolderDialog","useConfirmMoveFolderDialog","useEffect","createTreeData","prev","expanded","createInitialOpenList","Set","handleChangeOpen","nodes","folderIds","node","updatedOpenIds","fetchableIds","id","handleDrop","_","dragSourceId","dropTargetId","item","folder","Error","error","onDrop","useCallback","newTree","options","runDrop","f","targetFolder","sort","useMemo","a","b","undefined","canDrag","canDrop","dropTagetAncestorIds","nodeRenderer","FolderProvider","Node","handleNodeClick","Tree"],"mappings":"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"}

package/components/FolderTree/List/index.js

@@ -1,3 +1 @@
 export * from "./List.js";
-
-//# sourceMappingURL=index.js.map

package/components/FolderTree/List/utils.js

@@ -1,69 +1,36 @@
 import { ROOT_FOLDER } from "../../../constants.js";
-/**
- * Transform an array of folders returned by folders cache into an array of elements for the tree component.
- *
- * @param folders list of folders returned by folders cache.
- * @param focusedNodeId id of the current folder selected/focused.
- * @param hiddenFolderIds list ids of the folder you don't want to show within the list.
- * @return array of elements to render the tree component.
- */
-export const createTreeData = (folders = [], focusedNodeId, hiddenFolderIds = []) => {
-  return folders.map(item => {
-    const {
-      id,
-      parentId,
-      title
-    } = item;
-    return {
-      id,
-      // toLowerCase() fixes a bug introduced by 5.36.0: accidentally we stored "ROOT" as parentId, instead of null
-      parentId: parentId?.toLowerCase() || ROOT_FOLDER,
-      label: title,
-      droppable: true,
-      active: focusedNodeId === id
-    };
-  }).filter(item => !hiddenFolderIds.includes(item.id));
-};
-
-/**
- * Return an array of ids of open folders, based on the current focused folder id, its parent folders and the folders
- * opened by user interaction.
- *
- * @param folders list of folders returned by folders cache.
- * @param openIds list of open folders ids.
- * @param focusedId id of the current folder selected/focused.
- * @return array of ids of open folders.
- */
-export const createInitialOpenList = (folders = [], openIds = [], focusedId) => {
-  //  There is always a root folder, opened by default
-  if (!focusedId) {
-    return openIds;
-  }
-
-  // Create a map for quick folder lookup by id
-  const folderMap = new Map(folders.map(folder => [folder.id, folder]));
-  // Store the chain of folder ids from the focused folder up to the root
-  const result = [];
-  let currentId = focusedId;
-
-  // Traverse up the folder tree, collecting parent ids
-  while (currentId) {
-    // Add the current folder id if not already in the result
-    if (!result.includes(currentId)) {
-      result.push(currentId);
-    }
-    // Get the folder object for the current id
-    const folder = folderMap.get(currentId);
-    // Get the parent id of the current folder
-    const parentId = folder?.parentId;
-    // Stop if there is no parent or we've already added this parent
-    if (!parentId || result.includes(parentId)) {
-      break;
+const createTreeData = (folders = [], focusedNodeId, hiddenFolderIds = [])=>folders.map((item)=>{
+        const { id, parentId, title } = item;
+        return {
+            id,
+            parentId: parentId?.toLowerCase() || ROOT_FOLDER,
+            label: title,
+            droppable: true,
+            active: focusedNodeId === id
+        };
+    }).filter((item)=>!hiddenFolderIds.includes(item.id));
+const createInitialOpenList = (folders = [], openIds = [], focusedId)=>{
+    if (!focusedId) return openIds;
+    const folderMap = new Map(folders.map((folder)=>[
+            folder.id,
+            folder
+        ]));
+    const result = [];
+    let currentId = focusedId;
+    while(currentId){
+        if (!result.includes(currentId)) result.push(currentId);
+        const folder = folderMap.get(currentId);
+        const parentId = folder?.parentId;
+        if (!parentId || result.includes(parentId)) break;
+        currentId = parentId;
     }
-    // Move up to the parent folder
-    currentId = parentId;
-  }
-  return [...new Set([...result, ...openIds])];
+    return [
+        ...new Set([
+            ...result,
+            ...openIds
+        ])
+    ];
 };
+export { createInitialOpenList, createTreeData };
 
 //# sourceMappingURL=utils.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["ROOT_FOLDER","createTreeData","folders","focusedNodeId","hiddenFolderIds","map","item","id","parentId","title","toLowerCase","label","droppable","active","filter","includes","createInitialOpenList","openIds","focusedId","folderMap","Map","folder","result","currentId","push","get","Set"],"sources":["utils.ts"],"sourcesContent":["import { ROOT_FOLDER } from \"~/constants.js\";\nimport type { NodeDto } from \"@webiny/admin-ui\";\nimport type { FolderDto } from \"~/domain/folder/FolderDto.js\";\n\n/**\n * Transform an array of folders returned by folders cache into an array of elements for the tree component.\n *\n * @param folders list of folders returned by folders cache.\n * @param focusedNodeId id of the current folder selected/focused.\n * @param hiddenFolderIds list ids of the folder you don't want to show within the list.\n * @return array of elements to render the tree component.\n */\nexport const createTreeData = (\n    folders: FolderDto[] = [],\n    focusedNodeId?: string,\n    hiddenFolderIds: string[] = []\n): NodeDto<FolderDto>[] => {\n    return folders\n        .map(item => {\n            const { id, parentId, title } = item;\n\n            return {\n                id,\n                // toLowerCase() fixes a bug introduced by 5.36.0: accidentally we stored \"ROOT\" as parentId, instead of null\n                parentId: parentId?.toLowerCase() || ROOT_FOLDER,\n                label: title,\n                droppable: true,\n                active: focusedNodeId === id\n            };\n        })\n        .filter(item => !hiddenFolderIds.includes(item.id));\n};\n\n/**\n * Return an array of ids of open folders, based on the current focused folder id, its parent folders and the folders\n * opened by user interaction.\n *\n * @param folders list of folders returned by folders cache.\n * @param openIds list of open folders ids.\n * @param focusedId id of the current folder selected/focused.\n * @return array of ids of open folders.\n */\nexport const createInitialOpenList = (\n    folders: FolderDto[] = [],\n    openIds: string[] = [],\n    focusedId?: string\n): string[] => {\n    //  There is always a root folder, opened by default\n    if (!focusedId) {\n        return openIds;\n    }\n\n    // Create a map for quick folder lookup by id\n    const folderMap = new Map(folders.map(folder => [folder.id, folder]));\n    // Store the chain of folder ids from the focused folder up to the root\n    const result: string[] = [];\n\n    let currentId: string | undefined = focusedId;\n\n    // Traverse up the folder tree, collecting parent ids\n    while (currentId) {\n        // Add the current folder id if not already in the result\n        if (!result.includes(currentId)) {\n            result.push(currentId);\n        }\n        // Get the folder object for the current id\n        const folder = folderMap.get(currentId) as FolderDto | undefined;\n        // Get the parent id of the current folder\n        const parentId = folder?.parentId;\n        // Stop if there is no parent or we've already added this parent\n        if (!parentId || result.includes(parentId)) {\n            break;\n        }\n        // Move up to the parent folder\n        currentId = parentId;\n    }\n\n    return [...new Set([...result, ...openIds])];\n};\n"],"mappings":"AAAA,SAASA,WAAW;AAIpB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,cAAc,GAAGA,CAC1BC,OAAoB,GAAG,EAAE,EACzBC,aAAsB,EACtBC,eAAyB,GAAG,EAAE,KACP;EACvB,OAAOF,OAAO,CACTG,GAAG,CAACC,IAAI,IAAI;IACT,MAAM;MAAEC,EAAE;MAAEC,QAAQ;MAAEC;IAAM,CAAC,GAAGH,IAAI;IAEpC,OAAO;MACHC,EAAE;MACF;MACAC,QAAQ,EAAEA,QAAQ,EAAEE,WAAW,CAAC,CAAC,IAAIV,WAAW;MAChDW,KAAK,EAAEF,KAAK;MACZG,SAAS,EAAE,IAAI;MACfC,MAAM,EAAEV,aAAa,KAAKI;IAC9B,CAAC;EACL,CAAC,CAAC,CACDO,MAAM,CAACR,IAAI,IAAI,CAACF,eAAe,CAACW,QAAQ,CAACT,IAAI,CAACC,EAAE,CAAC,CAAC;AAC3D,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMS,qBAAqB,GAAGA,CACjCd,OAAoB,GAAG,EAAE,EACzBe,OAAiB,GAAG,EAAE,EACtBC,SAAkB,KACP;EACX;EACA,IAAI,CAACA,SAAS,EAAE;IACZ,OAAOD,OAAO;EAClB;;EAEA;EACA,MAAME,SAAS,GAAG,IAAIC,GAAG,CAAClB,OAAO,CAACG,GAAG,CAACgB,MAAM,IAAI,CAACA,MAAM,CAACd,EAAE,EAAEc,MAAM,CAAC,CAAC,CAAC;EACrE;EACA,MAAMC,MAAgB,GAAG,EAAE;EAE3B,IAAIC,SAA6B,GAAGL,SAAS;;EAE7C;EACA,OAAOK,SAAS,EAAE;IACd;IACA,IAAI,CAACD,MAAM,CAACP,QAAQ,CAACQ,SAAS,CAAC,EAAE;MAC7BD,MAAM,CAACE,IAAI,CAACD,SAAS,CAAC;IAC1B;IACA;IACA,MAAMF,MAAM,GAAGF,SAAS,CAACM,GAAG,CAACF,SAAS,CAA0B;IAChE;IACA,MAAMf,QAAQ,GAAGa,MAAM,EAAEb,QAAQ;IACjC;IACA,IAAI,CAACA,QAAQ,IAAIc,MAAM,CAACP,QAAQ,CAACP,QAAQ,CAAC,EAAE;MACxC;IACJ;IACA;IACAe,SAAS,GAAGf,QAAQ;EACxB;EAEA,OAAO,CAAC,GAAG,IAAIkB,GAAG,CAAC,CAAC,GAAGJ,MAAM,EAAE,GAAGL,OAAO,CAAC,CAAC,CAAC;AAChD,CAAC","ignoreList":[]}
+{"version":3,"file":"components/FolderTree/List/utils.js","sources":["../../../../src/components/FolderTree/List/utils.ts"],"sourcesContent":["import { ROOT_FOLDER } from \"~/constants.js\";\nimport type { NodeDto } from \"@webiny/admin-ui\";\nimport type { FolderDto } from \"~/domain/folder/FolderDto.js\";\n\n/**\n * Transform an array of folders returned by folders cache into an array of elements for the tree component.\n *\n * @param folders list of folders returned by folders cache.\n * @param focusedNodeId id of the current folder selected/focused.\n * @param hiddenFolderIds list ids of the folder you don't want to show within the list.\n * @return array of elements to render the tree component.\n */\nexport const createTreeData = (\n    folders: FolderDto[] = [],\n    focusedNodeId?: string,\n    hiddenFolderIds: string[] = []\n): NodeDto<FolderDto>[] => {\n    return folders\n        .map(item => {\n            const { id, parentId, title } = item;\n\n            return {\n                id,\n                // toLowerCase() fixes a bug introduced by 5.36.0: accidentally we stored \"ROOT\" as parentId, instead of null\n                parentId: parentId?.toLowerCase() || ROOT_FOLDER,\n                label: title,\n                droppable: true,\n                active: focusedNodeId === id\n            };\n        })\n        .filter(item => !hiddenFolderIds.includes(item.id));\n};\n\n/**\n * Return an array of ids of open folders, based on the current focused folder id, its parent folders and the folders\n * opened by user interaction.\n *\n * @param folders list of folders returned by folders cache.\n * @param openIds list of open folders ids.\n * @param focusedId id of the current folder selected/focused.\n * @return array of ids of open folders.\n */\nexport const createInitialOpenList = (\n    folders: FolderDto[] = [],\n    openIds: string[] = [],\n    focusedId?: string\n): string[] => {\n    //  There is always a root folder, opened by default\n    if (!focusedId) {\n        return openIds;\n    }\n\n    // Create a map for quick folder lookup by id\n    const folderMap = new Map(folders.map(folder => [folder.id, folder]));\n    // Store the chain of folder ids from the focused folder up to the root\n    const result: string[] = [];\n\n    let currentId: string | undefined = focusedId;\n\n    // Traverse up the folder tree, collecting parent ids\n    while (currentId) {\n        // Add the current folder id if not already in the result\n        if (!result.includes(currentId)) {\n            result.push(currentId);\n        }\n        // Get the folder object for the current id\n        const folder = folderMap.get(currentId) as FolderDto | undefined;\n        // Get the parent id of the current folder\n        const parentId = folder?.parentId;\n        // Stop if there is no parent or we've already added this parent\n        if (!parentId || result.includes(parentId)) {\n            break;\n        }\n        // Move up to the parent folder\n        currentId = parentId;\n    }\n\n    return [...new Set([...result, ...openIds])];\n};\n"],"names":["createTreeData","folders","focusedNodeId","hiddenFolderIds","item","id","parentId","title","ROOT_FOLDER","createInitialOpenList","openIds","focusedId","folderMap","Map","folder","result","currentId","Set"],"mappings":";AAYO,MAAMA,iBAAiB,CAC1BC,UAAuB,EAAE,EACzBC,eACAC,kBAA4B,EAAE,GAEvBF,QACF,GAAG,CAACG,CAAAA;QACD,MAAM,EAAEC,EAAE,EAAEC,QAAQ,EAAEC,KAAK,EAAE,GAAGH;QAEhC,OAAO;YACHC;YAEA,UAAUC,UAAU,iBAAiBE;YACrC,OAAOD;YACP,WAAW;YACX,QAAQL,kBAAkBG;QAC9B;IACJ,GACC,MAAM,CAACD,CAAAA,OAAQ,CAACD,gBAAgB,QAAQ,CAACC,KAAK,EAAE;AAYlD,MAAMK,wBAAwB,CACjCR,UAAuB,EAAE,EACzBS,UAAoB,EAAE,EACtBC;IAGA,IAAI,CAACA,WACD,OAAOD;IAIX,MAAME,YAAY,IAAIC,IAAIZ,QAAQ,GAAG,CAACa,CAAAA,SAAU;YAACA,OAAO,EAAE;YAAEA;SAAO;IAEnE,MAAMC,SAAmB,EAAE;IAE3B,IAAIC,YAAgCL;IAGpC,MAAOK,UAAW;QAEd,IAAI,CAACD,OAAO,QAAQ,CAACC,YACjBD,OAAO,IAAI,CAACC;QAGhB,MAAMF,SAASF,UAAU,GAAG,CAACI;QAE7B,MAAMV,WAAWQ,QAAQ;QAEzB,IAAI,CAACR,YAAYS,OAAO,QAAQ,CAACT,WAC7B;QAGJU,YAAYV;IAChB;IAEA,OAAO;WAAI,IAAIW,IAAI;eAAIF;eAAWL;SAAQ;KAAE;AAChD"}

package/components/FolderTree/Loader/Loader.js

@@ -1,22 +1,19 @@
-import React from "react";
+import react from "react";
 import { Skeleton } from "@webiny/admin-ui";
-export const Loader = ({
-  count = 4
-}) => {
-  const lines = Array.from({
-    length: count
-  });
-  return /*#__PURE__*/React.createElement("div", {
-    className: "my-md p-xs"
-  }, lines.map((_, index) => {
-    return /*#__PURE__*/React.createElement("div", {
-      key: `folder-skeleton-${index}`,
-      className: "mb-xs px-sm py-xs-plus"
-    }, /*#__PURE__*/React.createElement(Skeleton, {
-      type: "text",
-      size: "md"
-    }));
-  }));
+const Loader = ({ count = 4 })=>{
+    const lines = Array.from({
+        length: count
+    });
+    return /*#__PURE__*/ react.createElement("div", {
+        className: "my-md p-xs"
+    }, lines.map((_, index)=>/*#__PURE__*/ react.createElement("div", {
+            key: `folder-skeleton-${index}`,
+            className: "mb-xs px-sm py-xs-plus"
+        }, /*#__PURE__*/ react.createElement(Skeleton, {
+            type: "text",
+            size: "md"
+        }))));
 };
+export { Loader };
 
 //# sourceMappingURL=Loader.js.map

package/components/FolderTree/Loader/Loader.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Skeleton","Loader","count","lines","Array","from","length","createElement","className","map","_","index","key","type","size"],"sources":["Loader.tsx"],"sourcesContent":["import React from \"react\";\nimport { Skeleton } from \"@webiny/admin-ui\";\n\ninterface LoaderProps {\n    count?: number;\n}\n\nexport const Loader = ({ count = 4 }: LoaderProps) => {\n    const lines = Array.from({ length: count });\n\n    return (\n        <div className={\"my-md p-xs\"}>\n            {lines.map((_, index) => {\n                return (\n                    <div key={`folder-skeleton-${index}`} className={\"mb-xs px-sm py-xs-plus\"}>\n                        <Skeleton type={\"text\"} size={\"md\"} />\n                    </div>\n                );\n            })}\n        </div>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,QAAQ,QAAQ,kBAAkB;AAM3C,OAAO,MAAMC,MAAM,GAAGA,CAAC;EAAEC,KAAK,GAAG;AAAe,CAAC,KAAK;EAClD,MAAMC,KAAK,GAAGC,KAAK,CAACC,IAAI,CAAC;IAAEC,MAAM,EAAEJ;EAAM,CAAC,CAAC;EAE3C,oBACIH,KAAA,CAAAQ,aAAA;IAAKC,SAAS,EAAE;EAAa,GACxBL,KAAK,CAACM,GAAG,CAAC,CAACC,CAAC,EAAEC,KAAK,KAAK;IACrB,oBACIZ,KAAA,CAAAQ,aAAA;MAAKK,GAAG,EAAE,mBAAmBD,KAAK,EAAG;MAACH,SAAS,EAAE;IAAyB,gBACtET,KAAA,CAAAQ,aAAA,CAACP,QAAQ;MAACa,IAAI,EAAE,MAAO;MAACC,IAAI,EAAE;IAAK,CAAE,CACpC,CAAC;EAEd,CAAC,CACA,CAAC;AAEd,CAAC","ignoreList":[]}
+{"version":3,"file":"components/FolderTree/Loader/Loader.js","sources":["../../../../src/components/FolderTree/Loader/Loader.tsx"],"sourcesContent":["import React from \"react\";\nimport { Skeleton } from \"@webiny/admin-ui\";\n\ninterface LoaderProps {\n    count?: number;\n}\n\nexport const Loader = ({ count = 4 }: LoaderProps) => {\n    const lines = Array.from({ length: count });\n\n    return (\n        <div className={\"my-md p-xs\"}>\n            {lines.map((_, index) => {\n                return (\n                    <div key={`folder-skeleton-${index}`} className={\"mb-xs px-sm py-xs-plus\"}>\n                        <Skeleton type={\"text\"} size={\"md\"} />\n                    </div>\n                );\n            })}\n        </div>\n    );\n};\n"],"names":["Loader","count","lines","Array","_","index","Skeleton"],"mappings":";;AAOO,MAAMA,SAAS,CAAC,EAAEC,QAAQ,CAAC,EAAe;IAC7C,MAAMC,QAAQC,MAAM,IAAI,CAAC;QAAE,QAAQF;IAAM;IAEzC,OAAO,WAAP,GACI,oBAAC;QAAI,WAAW;OACXC,MAAM,GAAG,CAAC,CAACE,GAAGC,QACJ,WAAP,GACI,oBAAC;YAAI,KAAK,CAAC,gBAAgB,EAAEA,OAAO;YAAE,WAAW;yBAC7C,oBAACC,UAAQA;YAAC,MAAM;YAAQ,MAAM;;AAMtD"}

package/components/FolderTree/Loader/index.js

@@ -1,3 +1 @@
 export * from "./Loader.js";
-
-//# sourceMappingURL=index.js.map

package/components/FolderTree/MenuActions/MenuActions.js

@@ -1,32 +1,24 @@
-import React from "react";
+import react from "react";
 import { OptionsMenu } from "@webiny/app-admin";
-import { cn, IconButton } from "@webiny/admin-ui";
-import { ReactComponent as MoreVerticalIcon } from "@webiny/icons/more_vert.svg";
+import { IconButton, cn } from "@webiny/admin-ui";
+import { ReactComponent } from "@webiny/icons/more_vert.svg";
 import { useFolder } from "../../../hooks/index.js";
-export const MenuActions = ({
-  folderActions
-}) => {
-  const {
-    folder
-  } = useFolder();
-
-  // If the user cannot manage folder structure, no need to show the menu.
-  if (!folder.canManageStructure) {
-    return null;
-  }
-  return /*#__PURE__*/React.createElement("div", {
-    // Let's stop click event propagation, otherwise opening the OptionsMenu event will propagate up to the main Tree Item
-    onClick: e => e.stopPropagation(),
-    className: cn("invisible group-hover:visible", "size-md cursor-pointer", "absolute top-1/2  right-sm -translate-y-1/2")
-  }, /*#__PURE__*/React.createElement(OptionsMenu, {
-    trigger: /*#__PURE__*/React.createElement(IconButton, {
-      icon: /*#__PURE__*/React.createElement(MoreVerticalIcon, null),
-      size: "xs",
-      variant: "ghost"
-    }),
-    actions: folderActions,
-    "data-testid": "folder.tree.menu-action"
-  }));
+const MenuActions = ({ folderActions })=>{
+    const { folder } = useFolder();
+    if (!folder.canManageStructure) return null;
+    return /*#__PURE__*/ react.createElement("div", {
+        onClick: (e)=>e.stopPropagation(),
+        className: cn("invisible group-hover:visible", "size-md cursor-pointer", "absolute top-1/2  right-sm -translate-y-1/2")
+    }, /*#__PURE__*/ react.createElement(OptionsMenu, {
+        trigger: /*#__PURE__*/ react.createElement(IconButton, {
+            icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+            size: "xs",
+            variant: "ghost"
+        }),
+        actions: folderActions,
+        "data-testid": "folder.tree.menu-action"
+    }));
 };
+export { MenuActions };
 
 //# sourceMappingURL=MenuActions.js.map

package/components/FolderTree/MenuActions/MenuActions.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","OptionsMenu","cn","IconButton","ReactComponent","MoreVerticalIcon","useFolder","MenuActions","folderActions","folder","canManageStructure","createElement","onClick","e","stopPropagation","className","trigger","icon","size","variant","actions"],"sources":["MenuActions.tsx"],"sourcesContent":["import React from \"react\";\nimport { OptionsMenu } from \"@webiny/app-admin\";\nimport { cn, IconButton } from \"@webiny/admin-ui\";\nimport { ReactComponent as MoreVerticalIcon } from \"@webiny/icons/more_vert.svg\";\nimport type { FolderActionConfig } from \"~/config/index.js\";\nimport { useFolder } from \"~/hooks/index.js\";\n\ninterface MenuActionsProps {\n    folderActions: FolderActionConfig[];\n}\n\nexport const MenuActions = ({ folderActions }: MenuActionsProps) => {\n    const { folder } = useFolder();\n\n    // If the user cannot manage folder structure, no need to show the menu.\n    if (!folder.canManageStructure) {\n        return null;\n    }\n\n    return (\n        <div\n            // Let's stop click event propagation, otherwise opening the OptionsMenu event will propagate up to the main Tree Item\n            onClick={e => e.stopPropagation()}\n            className={cn(\n                \"invisible group-hover:visible\",\n                \"size-md cursor-pointer\",\n                \"absolute top-1/2  right-sm -translate-y-1/2\"\n            )}\n        >\n            <OptionsMenu\n                trigger={<IconButton icon={<MoreVerticalIcon />} size={\"xs\"} variant={\"ghost\"} />}\n                actions={folderActions}\n                data-testid={\"folder.tree.menu-action\"}\n            />\n        </div>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,WAAW,QAAQ,mBAAmB;AAC/C,SAASC,EAAE,EAAEC,UAAU,QAAQ,kBAAkB;AACjD,SAASC,cAAc,IAAIC,gBAAgB,QAAQ,6BAA6B;AAEhF,SAASC,SAAS;AAMlB,OAAO,MAAMC,WAAW,GAAGA,CAAC;EAAEC;AAAgC,CAAC,KAAK;EAChE,MAAM;IAAEC;EAAO,CAAC,GAAGH,SAAS,CAAC,CAAC;;EAE9B;EACA,IAAI,CAACG,MAAM,CAACC,kBAAkB,EAAE;IAC5B,OAAO,IAAI;EACf;EAEA,oBACIV,KAAA,CAAAW,aAAA;IACI;IACAC,OAAO,EAAEC,CAAC,IAAIA,CAAC,CAACC,eAAe,CAAC,CAAE;IAClCC,SAAS,EAAEb,EAAE,CACT,+BAA+B,EAC/B,wBAAwB,EACxB,6CACJ;EAAE,gBAEFF,KAAA,CAAAW,aAAA,CAACV,WAAW;IACRe,OAAO,eAAEhB,KAAA,CAAAW,aAAA,CAACR,UAAU;MAACc,IAAI,eAAEjB,KAAA,CAAAW,aAAA,CAACN,gBAAgB,MAAE,CAAE;MAACa,IAAI,EAAE,IAAK;MAACC,OAAO,EAAE;IAAQ,CAAE,CAAE;IAClFC,OAAO,EAAEZ,aAAc;IACvB,eAAa;EAA0B,CAC1C,CACA,CAAC;AAEd,CAAC","ignoreList":[]}
+{"version":3,"file":"components/FolderTree/MenuActions/MenuActions.js","sources":["../../../../src/components/FolderTree/MenuActions/MenuActions.tsx"],"sourcesContent":["import React from \"react\";\nimport { OptionsMenu } from \"@webiny/app-admin\";\nimport { cn, IconButton } from \"@webiny/admin-ui\";\nimport { ReactComponent as MoreVerticalIcon } from \"@webiny/icons/more_vert.svg\";\nimport type { FolderActionConfig } from \"~/config/index.js\";\nimport { useFolder } from \"~/hooks/index.js\";\n\ninterface MenuActionsProps {\n    folderActions: FolderActionConfig[];\n}\n\nexport const MenuActions = ({ folderActions }: MenuActionsProps) => {\n    const { folder } = useFolder();\n\n    // If the user cannot manage folder structure, no need to show the menu.\n    if (!folder.canManageStructure) {\n        return null;\n    }\n\n    return (\n        <div\n            // Let's stop click event propagation, otherwise opening the OptionsMenu event will propagate up to the main Tree Item\n            onClick={e => e.stopPropagation()}\n            className={cn(\n                \"invisible group-hover:visible\",\n                \"size-md cursor-pointer\",\n                \"absolute top-1/2  right-sm -translate-y-1/2\"\n            )}\n        >\n            <OptionsMenu\n                trigger={<IconButton icon={<MoreVerticalIcon />} size={\"xs\"} variant={\"ghost\"} />}\n                actions={folderActions}\n                data-testid={\"folder.tree.menu-action\"}\n            />\n        </div>\n    );\n};\n"],"names":["MenuActions","folderActions","folder","useFolder","e","cn","OptionsMenu","IconButton","MoreVerticalIcon"],"mappings":";;;;;AAWO,MAAMA,cAAc,CAAC,EAAEC,aAAa,EAAoB;IAC3D,MAAM,EAAEC,MAAM,EAAE,GAAGC;IAGnB,IAAI,CAACD,OAAO,kBAAkB,EAC1B,OAAO;IAGX,OAAO,WAAP,GACI,oBAAC;QAEG,SAASE,CAAAA,IAAKA,EAAE,eAAe;QAC/B,WAAWC,GACP,iCACA,0BACA;qBAGJ,oBAACC,aAAWA;QACR,uBAAS,oBAACC,YAAUA;YAAC,oBAAM,oBAACC,gBAAgBA;YAAK,MAAM;YAAM,SAAS;;QACtE,SAASP;QACT,eAAa;;AAI7B"}

package/components/FolderTree/MenuActions/index.js

@@ -1,3 +1 @@
 export * from "./MenuActions.js";
-
-//# sourceMappingURL=index.js.map