@mattisvensson/strapi-plugin-webatlas 0.5.0 → 0.6.0

package/dist/_chunks/{index-BxnHHgGC.js → index-DWcVnOi0.js}

@@ -7,7 +7,7 @@ const designSystem = require("@strapi/design-system");
 const React = require("react");
 const ReactDOM = require("react-dom");
 const reactIntl = require("react-intl");
-const index = require("./index-Ciae_OgQ.js");
+const index = require("./index-Bxhu-TNT.js");
 const admin = require("@strapi/strapi/admin");
 const FullLoader = require("./FullLoader-Cmsf8xS6.js");
 const EmptyBox = require("./EmptyBox-T8t29l25.js");
@@ -10570,11 +10570,10 @@ function getProjection(items, activeId, overId, dragOffset) {
   const activeItem = items[activeItemIndex];
   const newItems = sortable.arrayMove(items, activeItemIndex, overItemIndex);
   const previousItem = newItems[overItemIndex - 1];
-  const nextItem = newItems[overItemIndex + 1];
   const dragDepth = getDragDepth(dragOffset, indentationWidth);
   const projectedDepth = activeItem && typeof activeItem.depth === "number" ? activeItem.depth + dragDepth : 0;
-  const maxDepth = getMaxDepth({ previousItem });
-  const minDepth = getMinDepth({ nextItem });
+  let maxDepth = getMaxDepth({ previousItem });
+  let minDepth = 0;
   let depth = projectedDepth;
   if (projectedDepth >= maxDepth) {
     depth = maxDepth;
@@ -10589,12 +10588,6 @@ function getMaxDepth({ previousItem }) {
   }
   return 0;
 }
-function getMinDepth({ nextItem }) {
-  if (nextItem && typeof nextItem.depth === "number") {
-    return nextItem.depth;
-  }
-  return 0;
-}
 function getDragDepth(offset, indentationWidth2) {
   return Math.round(offset / indentationWidth2);
 }
@@ -10610,7 +10603,7 @@ function RouteIcon({ type, color = "neutral800" }) {
       return /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { width: "16px", height: "16px" });
   }
 }
-const RouteItem = React.forwardRef(({ item, setParentId, setActionItem, ghost, depth, style, wrapperRef, handleProps }, ref) => {
+const RouteItem = React.forwardRef(({ item, setParentId, setActionItem, setNavigationItems, ghost, depth, style, wrapperRef, handleProps }, ref) => {
   if (!item || !item.route) return null;
   const { setModalType } = React.useContext(ModalContext);
   const { formatMessage } = reactIntl.useIntl();
@@ -10662,6 +10655,17 @@ const RouteItem = React.forwardRef(({ item, setParentId, setActionItem, ghost, d
     setActionItem(item);
     setModalType("ItemDelete");
   };
+  const handleRestore = () => {
+    setNavigationItems(
+      (navItems) => navItems?.map((navItem) => {
+        if (navItem.documentId === item.documentId) {
+          delete navItem.update;
+          delete navItem.deleted;
+        }
+        return navItem;
+      })
+    );
+  };
   const elStyle = {
     marginLeft: depth !== void 0 ? depth * 48 : 0,
     opacity: ghost || item.deleted ? 0.5 : 1,
@@ -10718,18 +10722,24 @@ const RouteItem = React.forwardRef(({ item, setParentId, setActionItem, ghost, d
             ] }),
             /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { direction: "row", gap: 4, children: [
               type === "internal" && item.status && /* @__PURE__ */ jsxRuntime.jsx(designSystem.Status, { variant: itemStatusOptions[item.status].variant, size: "S", children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { fontWeight: "bold", children: itemStatusOptions[item.status].status }) }),
-              /* @__PURE__ */ jsxRuntime.jsxs(designSystem.SimpleMenu, { label: "Notifications", tag: designSystem.IconButton, icon: /* @__PURE__ */ jsxRuntime.jsx(icons.More, {}), children: [
-                /* @__PURE__ */ jsxRuntime.jsx(designSystem.MenuItem, { onClick: () => handleEdit(), children: formatMessage({
-                  id: index.getTranslation("edit"),
-                  defaultMessage: "Edit"
-                }) }),
-                /* @__PURE__ */ jsxRuntime.jsx(designSystem.MenuItem, { onClick: () => handleAddChildren(), children: formatMessage({
-                  id: index.getTranslation("navigation.page.navItem.addChildren"),
-                  defaultMessage: "Add children"
-                }) }),
-                /* @__PURE__ */ jsxRuntime.jsx(designSystem.MenuItem, { onClick: () => handleDelete(), children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { textColor: "danger600", children: formatMessage({
-                  id: index.getTranslation("delete"),
-                  defaultMessage: "Delete"
+              /* @__PURE__ */ jsxRuntime.jsxs(designSystem.SimpleMenu, { label: "Item actions", tag: designSystem.IconButton, icon: /* @__PURE__ */ jsxRuntime.jsx(icons.More, {}), children: [
+                !item.deleted && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(designSystem.MenuItem, { onClick: () => handleEdit(), children: formatMessage({
+                    id: index.getTranslation("edit"),
+                    defaultMessage: "Edit"
+                  }) }),
+                  /* @__PURE__ */ jsxRuntime.jsx(designSystem.MenuItem, { onClick: () => handleAddChildren(), children: formatMessage({
+                    id: index.getTranslation("navigation.page.navItem.addChildren"),
+                    defaultMessage: "Add children"
+                  }) }),
+                  /* @__PURE__ */ jsxRuntime.jsx(designSystem.MenuItem, { onClick: () => handleDelete(), children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { textColor: "danger600", children: formatMessage({
+                    id: index.getTranslation("delete"),
+                    defaultMessage: "Delete"
+                  }) }) })
+                ] }),
+                (item.deleted || item.update) && /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.MenuItem, { onClick: () => handleRestore(), children: formatMessage({
+                  id: index.getTranslation("restore"),
+                  defaultMessage: "Restore"
                 }) }) })
               ] })
             ] })
@@ -10739,7 +10749,7 @@ const RouteItem = React.forwardRef(({ item, setParentId, setActionItem, ghost, d
     }
   );
 });
-function SortableRouteItem({ item, depth, ...props }) {
+function SortableRouteItem({ item, depth, setNavigationItems, ...props }) {
   if (!item) return null;
   const {
     isDragging,
@@ -10758,6 +10768,7 @@ function SortableRouteItem({ item, depth, ...props }) {
     {
       ref: setDraggableNodeRef,
       wrapperRef: setDroppableNodeRef,
+      setNavigationItems,
       style,
       item,
       disableInteraction: isSorting,
@@ -10801,6 +10812,7 @@ function PageWrapper({ navigations, loading = false, children }) {
                 id: index.getTranslation("navigation.page.selectNavigation"),
                 defaultMessage: "Select Navigation"
               }),
+              selected: true,
               onChange: (value) => {
                 const navItem = navigations.find((nav) => nav.slug === value);
                 navItem && navigate(`/plugins/webatlas/navigation/${navItem.documentId}`);
@@ -11802,6 +11814,7 @@ const Navigation = () => {
   const { getNavigation, updateNavigationItemStructure } = index.useApi();
   const [isSavingNavigation, setIsSavingNavigation] = React.useState(false);
   const [loading, setLoading] = React.useState(true);
+  const cachedNavigations = React.useRef(null);
   const [projected, setProjected] = React.useState(null);
   const [activeItem, setActiveItem] = React.useState();
   const [activeId, setActiveId] = React.useState(null);
@@ -11845,11 +11858,10 @@ const Navigation = () => {
           }) + ": " + updatedNavigations[0]?.name
         });
         navigate(`/plugins/webatlas/navigation/${updatedNavigations[0]?.documentId}`);
+        return;
       }
-      setNavigations(updatedNavigations);
-      setSelectedNavigation(selectedNav);
-      setNavigationItems(selectedNav?.items || []);
-      initialNavigationItemsRef.current = cloneDeep$1(selectedNav?.items) || null;
+      cachedNavigations.current = updatedNavigations;
+      switchNavigation(selectedNav, updatedNavigations);
     } catch (error) {
       console.error("Error fetching navigations: ", error);
       toggleNotification({
@@ -11861,16 +11873,30 @@ const Navigation = () => {
       });
     }
   }
+  function switchNavigation(selectedNav, updatedNavigations) {
+    setNavigations(updatedNavigations);
+    setSelectedNavigation(selectedNav);
+    setNavigationItems(selectedNav.items || []);
+    initialNavigationItemsRef.current = cloneDeep$1(selectedNav.items) || null;
+  }
   React.useEffect(() => {
     async function fetchNavigations() {
       if (!navigationId) {
-        const navigations2 = await getNavigation({ documentId: navigationId, variant: "namesOnly" });
-        navigations2 && navigate(`/plugins/webatlas/navigation/${navigations2[0]?.documentId}`);
-      } else {
-        setLoading(true);
-        await loadNavigations();
+        const navs = await getNavigation({ variant: "namesOnly" });
+        if (navs && navs.length > 0) {
+          navigate(`/plugins/webatlas/navigation/${navs[0].documentId}`);
+        }
+        return;
+      }
+      if (cachedNavigations.current) {
+        const selectedNav = cachedNavigations.current.find((nav) => nav.documentId === navigationId);
+        selectedNav && switchNavigation(selectedNav, cachedNavigations.current);
         setLoading(false);
+        return;
       }
+      setLoading(true);
+      await loadNavigations();
+      setLoading(false);
     }
     fetchNavigations();
   }, [navigationId]);
@@ -11924,7 +11950,7 @@ const Navigation = () => {
         })
       });
     } finally {
-      loadNavigations();
+      await loadNavigations();
       setIsSavingNavigation(false);
     }
   }
@@ -11953,7 +11979,16 @@ const Navigation = () => {
       const activeTreeItem = navigationItems[activeIndex];
       navigationItems[activeIndex] = { ...activeTreeItem, depth };
       const sortedItems = sortable.arrayMove(navigationItems, activeIndex, overIndex);
-      setNavigationItems(sortedItems);
+      const fixedItems = [...sortedItems];
+      fixedItems[0].depth = 0;
+      for (let i = 1; i < fixedItems.length; i++) {
+        const prev = fixedItems[i - 1].depth ?? 0;
+        let curr = fixedItems[i].depth ?? 0;
+        if (curr < 0) curr = 0;
+        if (curr > prev + 1) curr = prev + 1;
+        fixedItems[i].depth = curr;
+      }
+      setNavigationItems(fixedItems);
     }
   }
   function resetState() {
@@ -12012,6 +12047,7 @@ const Navigation = () => {
                 item,
                 setParentId,
                 setActionItem,
+                setNavigationItems,
                 indentationWidth,
                 depth: item.id === activeId && projected ? projected.depth : item.depth
               },
@@ -12023,7 +12059,8 @@ const Navigation = () => {
                 {
                   item: activeItem,
                   setParentId,
-                  setActionItem
+                  setActionItem,
+                  setNavigationItems
                 }
               ) : null }),
               document.body
@@ -12160,4 +12197,4 @@ const App = () => {
   ] });
 };
 exports.default = App;
-//# sourceMappingURL=index-BxnHHgGC.js.map
+//# sourceMappingURL=index-DWcVnOi0.js.map