@mattisvensson/strapi-plugin-webatlas 0.9.6 → 0.10.0

package/dist/_chunks/{index-DwaKIwAz.mjs → index-B07UVUOa.mjs}

@@ -3,10 +3,10 @@ import { useRef, useEffect, useState, useCallback, createContext, useMemo, creat
 import { jsx, jsxs, Fragment as Fragment$1 } from "react/jsx-runtime";
 import { Link, List, Information } from "@strapi/icons";
 import { useFetchClient, unstable_useContentManagerContext, useRBAC } from "@strapi/strapi/admin";
-import { Box, Typography, Flex, Divider, Field, Checkbox } from "@strapi/design-system";
+import { Box, Typography, Flex, Checkbox, Field, SingleSelect, SingleSelectOption, Divider } from "@strapi/design-system";
+import { useIntl } from "react-intl";
 import * as ReactDOM from "react-dom";
 import ReactDOM__default, { flushSync } from "react-dom";
-import { useIntl } from "react-intl";
 const __variableDynamicImportRuntimeHelper = (glob, path, segs) => {
   const v = glob[path];
   if (v) {
@@ -34,6 +34,7 @@ function transformToUrl(input) {
   input = input.replace(/\/+/g, "/");
   input = input.startsWith("/") ? input.slice(1) : input;
   input = input.endsWith("/") ? input.slice(0, -1) : input;
+  input = input.replace(/\//g, "-");
   for (const char in specialCharMap) {
     const regex = new RegExp(char, "g");
     input = input.replace(regex, specialCharMap[char]);
@@ -44,7 +45,7 @@ function transformToUrl(input) {
   input = input.replace(/-+/g, "-");
   return input;
 }
-const version = "0.9.5";
+const version = "0.9.6";
 const keywords = [];
 const type = "commonjs";
 const exports = {
@@ -111,7 +112,7 @@ const peerDependencies = {
   "styled-components": "^6.0.0"
 };
 const description = "A strapi plugin to manage URL routes and navigations.";
-const strapi = {
+const strapi$1 = {
   name: "webatlas",
   displayName: "Webatlas",
   description: "A strapi plugin to manage URL routes and navigations.",
@@ -151,7 +152,7 @@ const pluginPkg = {
   devDependencies,
   peerDependencies,
   description,
-  strapi,
+  strapi: strapi$1,
   name,
   license,
   repository,
@@ -180,7 +181,7 @@ function useApi() {
       const { data } = await get("/content-manager/content-types");
       return data.data;
     } catch (error) {
-      console.warn("Cannot fetch all content types:", error);
+      strapi.log.error("Cannot fetch all content types:", error);
       return [];
     }
   };
@@ -195,7 +196,7 @@ function useApi() {
       const configuredUIDs = new Set(configuredTypes.map((ct) => ct.uid));
       return allContentTypes.filter((ct) => configuredUIDs.has(ct.uid));
     } catch (err) {
-      console.error("Error fetching configured content types:", err);
+      strapi.log.error("Error fetching configured content types:", err);
       return [];
     }
   };
@@ -219,7 +220,7 @@ function useApi() {
               contentType
             };
           } catch (err) {
-            console.warn(`Cannot access entities for ${contentType.uid}:`, err);
+            strapi.log.error(`Cannot access entities for ${contentType.uid}:`, err);
             return null;
           }
         })
@@ -227,7 +228,7 @@ function useApi() {
       entities = entityResults.map((result) => result.status === "fulfilled" ? result.value : null).filter(Boolean);
       return entities;
     } catch (err) {
-      console.error("Error fetching entities:", err);
+      strapi.log.error("Error fetching entities:", err);
       throw err;
     }
   };
@@ -235,16 +236,16 @@ function useApi() {
     const { data } = await get(`/${PLUGIN_ID}/route/related?documentId=${relatedDocumentId}`);
     return data;
   };
-  const getRoutes = async () => {
+  const getRoute = async (documentId) => {
+    const { data } = await get(`/${PLUGIN_ID}/route/${documentId}`);
+    return data;
+  };
+  const getAllRoutes = async () => {
     const { data } = await get(`/${PLUGIN_ID}/route`);
     return data;
   };
-  const updateRoute = async (body, documentId) => {
-    const { data } = await put(`/${PLUGIN_ID}/route?documentId=${documentId}`, {
-      data: {
-        ...body
-      }
-    });
+  const getProhibitedRouteIds = async (documentId) => {
+    const { data } = await get(`/${PLUGIN_ID}/route/prohibitedIds/${documentId ? `${documentId}` : ""}`);
     return data;
   };
   const getNavigation = async ({ documentId, variant } = {}) => {
@@ -282,8 +283,9 @@ function useApi() {
     fetchConfiguredContentTypes,
     fetchAllEntities,
     getRelatedRoute,
-    getRoutes,
-    updateRoute,
+    getRoute,
+    getAllRoutes,
+    getProhibitedRouteIds,
     getNavigation,
     createNavigation,
     deleteNavigation,
@@ -353,6 +355,113 @@ function usePluginConfig() {
   }
   return { config, loading, fetchError, setConfig };
 }
+function debounce(func, wait) {
+  let timeout;
+  return function executedFunction(...args) {
+    const later = () => {
+      clearTimeout(timeout);
+      func(...args);
+    };
+    clearTimeout(timeout);
+    timeout = setTimeout(later, wait);
+  };
+}
+async function duplicateCheck({
+  fetchFunction,
+  path,
+  routeDocumentId,
+  withoutTransform = false
+}) {
+  if (!path) throw new Error("URL is required");
+  try {
+    const pathToCheck = withoutTransform ? path : transformToUrl(path);
+    const { data } = await fetchFunction(`/${PLUGIN_ID}/checkUniquePath?path=${pathToCheck}${routeDocumentId ? `&targetRouteDocumentId=${routeDocumentId}` : ""}`);
+    if (!data.uniquePath) {
+      throw new Error("Network response was not ok");
+    }
+    return data.uniquePath;
+  } catch (err) {
+    throw new Error("Failed to check URL uniqueness: " + err.message);
+  }
+}
+const getTranslation = (id) => `${PLUGIN_ID}.${id}`;
+function PathInfo({ validationState, replacement }) {
+  const [color, setColor] = useState(null);
+  const [text, setText] = useState(null);
+  const { formatMessage } = useIntl();
+  useEffect(() => {
+    if (validationState === "initial") return;
+    if (validationState === "checking") {
+      setColor("neutral800");
+      setText(formatMessage({
+        id: getTranslation("components.pathInfo.checking"),
+        defaultMessage: "Checking if path is available..."
+      }));
+    } else if (validationState === "done") {
+      setColor(replacement ? "danger500" : "success500");
+      setText(replacement ? `${formatMessage({
+        id: getTranslation("components.pathInfo.notAvailable"),
+        defaultMessage: "Path is not available. Replaced with"
+      })} "${replacement}".` : formatMessage({
+        id: getTranslation("components.pathInfo.available"),
+        defaultMessage: "Path is available."
+      }));
+    }
+  }, [validationState, replacement, formatMessage]);
+  return /* @__PURE__ */ jsx(Box, { paddingTop: 1, children: /* @__PURE__ */ jsx(Typography, { textColor: color, children: text }) });
+}
+function OverrideCheckbox({ isOverride, setIsOverride, disabledCondition }) {
+  const { formatMessage } = useIntl();
+  return /* @__PURE__ */ jsx(
+    Flex,
+    {
+      gap: 2,
+      paddingTop: 2,
+      children: /* @__PURE__ */ jsx(
+        Checkbox,
+        {
+          id: "path-override-checkbox",
+          checked: isOverride,
+          onCheckedChange: () => setIsOverride(!isOverride),
+          disabled: disabledCondition,
+          children: /* @__PURE__ */ jsx(Typography, { textColor: "neutral600", children: formatMessage({
+            id: getTranslation("components.CMEditViewAside.path.overrideCheckbox"),
+            defaultMessage: "Override automatic path generation"
+          }) })
+        }
+      )
+    }
+  );
+}
+function NewPathInfo() {
+  const { formatMessage } = useIntl();
+  return /* @__PURE__ */ jsx(Typography, { textColor: "neutral600", children: formatMessage({
+    id: getTranslation("components.CMEditViewAside.path.newPathInfo"),
+    defaultMessage: "A new path will be created upon saving this entry."
+  }) });
+}
+function UidPathDisplay({ path }) {
+  const { formatMessage } = useIntl();
+  return /* @__PURE__ */ jsxs(
+    Field.Root,
+    {
+      hint: formatMessage({
+        id: getTranslation("components.CMEditViewAside.path.uidPath.hint"),
+        defaultMessage: "Permanent UID path, cannot be changed"
+      }),
+      children: [
+        /* @__PURE__ */ jsx(
+          Field.Input,
+          {
+            value: path,
+            disabled: true
+          }
+        ),
+        /* @__PURE__ */ jsx(Field.Hint, {})
+      ]
+    }
+  );
+}
 function _extends() {
   return _extends = Object.assign ? Object.assign.bind() : function(n) {
     for (var e = 1; e < arguments.length; e++) {
@@ -3652,70 +3761,132 @@ function Tooltip({ description: description2 }) {
     ) }) })
   ] }) });
 }
-function debounce(func, wait) {
-  let timeout;
-  return function executedFunction(...args) {
-    const later = () => {
-      clearTimeout(timeout);
-      func(...args);
-    };
-    clearTimeout(timeout);
-    timeout = setTimeout(later, wait);
-  };
-}
-async function duplicateCheck(get, url, routeDocumentId) {
-  if (!url) throw new Error("URL is required");
-  try {
-    const { data } = await get(`/${PLUGIN_ID}/checkUniquePath?path=${transformToUrl(url)}${routeDocumentId ? `&targetRouteDocumentId=${routeDocumentId}` : ""}`);
-    if (!data.uniquePath) {
-      throw new Error("Network response was not ok");
+function PathInput({ path, dispatchPath, isOverride, config }) {
+  const { formatMessage } = useIntl();
+  const displayedPath = isOverride && path.overridePath !== void 0 ? path.overridePath : path.value ?? "";
+  const inputBorder = path.replacement === null ? "" : path.replacement ? "1px solid #ee5e52" : "1px solid #5cb176";
+  return /* @__PURE__ */ jsxs(
+    Field.Root,
+    {
+      hint: config.default ? formatMessage({
+        id: getTranslation("components.CMEditViewAside.path.input.start"),
+        defaultMessage: "Edit the"
+      }) + ' "' + config.default + '" ' + formatMessage({
+        id: getTranslation("components.CMEditViewAside.path.input.end"),
+        defaultMessage: "field to generate a path"
+      }) : formatMessage({
+        id: getTranslation("components.CMEditViewAside.path.input.noSourceField"),
+        defaultMessage: "Use the override option to set a custom path"
+      }),
+      children: [
+        /* @__PURE__ */ jsxs(Field.Label, { children: [
+          formatMessage({
+            id: getTranslation("components.CMEditViewAside.path.input.label"),
+            defaultMessage: "Path"
+          }),
+          /* @__PURE__ */ jsx(Tooltip, { description: formatMessage({
+            id: getTranslation("components.CMEditViewAside.path.input.tooltip"),
+            defaultMessage: "The following characters are valid: A-Z, a-z, 0-9, /, -, _, $, ., +, !, *, ', (, )"
+          }) })
+        ] }),
+        /* @__PURE__ */ jsx(
+          Field.Input,
+          {
+            id: "path-input",
+            value: displayedPath,
+            onChange: (e) => dispatchPath({ type: "SET_OVERRIDEPATH", payload: e.target.value }),
+            disabled: !isOverride,
+            onBlur: (e) => {
+              if (e.target.value === path.prevValue) return;
+              dispatchPath({ type: "DEFAULT", payload: e.target.value });
+            },
+            style: { outline: inputBorder }
+          }
+        ),
+        /* @__PURE__ */ jsx(Field.Hint, {})
+      ]
     }
-    return data.uniquePath;
-  } catch (err) {
-    console.error("Error in duplicateCheck:", err);
-    throw new Error("Failed to check URL uniqueness");
-  }
+  );
 }
-const getTranslation = (id) => `${PLUGIN_ID}.${id}`;
-function PathInfo({ validationState, replacement, setUrlStatus }) {
-  const [color, setColor] = useState(null);
-  const [text, setText] = useState(null);
+function RouteStructure({ routes, selectedParent, setSelectedParent, canonicalPath, prohibitedRouteIds }) {
   const { formatMessage } = useIntl();
-  useEffect(() => {
-    if (validationState === "initial") return;
-    if (validationState === "checking") {
-      setColor("neutral800");
-      setText(formatMessage({
-        id: getTranslation("components.pathInfo.checking"),
-        defaultMessage: "Checking if path is available..."
-      }));
-    } else if (validationState === "done") {
-      setColor(replacement ? "danger500" : "success500");
-      setText(replacement ? `${formatMessage({
-        id: getTranslation("components.pathInfo.notAvailable"),
-        defaultMessage: "Path is not available. Replaced with"
-      })} "${replacement}".` : formatMessage({
-        id: getTranslation("components.pathInfo.available"),
-        defaultMessage: "Path is available."
-      }));
-      if (setUrlStatus) setUrlStatus(replacement ? "invalid" : "valid");
-    }
-  }, [validationState, replacement, formatMessage, setUrlStatus]);
-  return /* @__PURE__ */ jsx(Box, { paddingTop: 2, children: /* @__PURE__ */ jsx(Typography, { textColor: color, children: text }) });
+  const sortedRoutes = useMemo(() => {
+    return [...routes].sort((a, b) => a.title.localeCompare(b.title));
+  }, [routes]);
+  const handleSelectParent = (value) => {
+    const parentRoute = routes.find((route) => route.documentId === value) || null;
+    setSelectedParent(parentRoute);
+  };
+  return /* @__PURE__ */ jsxs(Box, { paddingBottom: 2, children: [
+    /* @__PURE__ */ jsxs(Field.Root, { children: [
+      /* @__PURE__ */ jsx(Field.Label, { children: formatMessage({
+        id: getTranslation("components.CMEditViewAside.path.input.parentSelect.label"),
+        defaultMessage: "Place under"
+      }) }),
+      /* @__PURE__ */ jsxs(
+        SingleSelect,
+        {
+          value: selectedParent?.documentId || "",
+          onValueChange: handleSelectParent,
+          children: [
+            /* @__PURE__ */ jsx(SingleSelectOption, { value: "", children: formatMessage({
+              id: getTranslation("components.CMEditViewAside.path.input.parentSelect.rootPath"),
+              defaultMessage: "None (root path)"
+            }) }),
+            sortedRoutes.filter((route) => !prohibitedRouteIds?.includes(route.documentId) || route.documentId === selectedParent?.documentId).map(
+              (route) => /* @__PURE__ */ jsx(
+                SingleSelectOption,
+                {
+                  value: route.documentId,
+                  children: route.title
+                },
+                route.documentId
+              )
+            )
+          ]
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs(Field.Root, { marginTop: 4, children: [
+      /* @__PURE__ */ jsxs(Field.Label, { children: [
+        formatMessage({
+          id: getTranslation("components.CMEditViewAside.canonicalPath.input.label"),
+          defaultMessage: "Canonical Path"
+        }),
+        /* @__PURE__ */ jsx(Tooltip, { description: formatMessage({
+          id: getTranslation("components.CMEditViewAside.canonicalPath.input.tooltip"),
+          defaultMessage: "The path determined by your content's natural hierarchy, independent of where it appears in navigation menus."
+        }) })
+      ] }),
+      /* @__PURE__ */ jsx(
+        Field.Input,
+        {
+          id: "canonicalPath-input",
+          value: canonicalPath,
+          disabled: true
+        }
+      ),
+      /* @__PURE__ */ jsx(Field.Hint, {})
+    ] })
+  ] });
+}
+function getCanonicalPath(selectedParent, sourceFieldValue) {
+  const parentPath = selectedParent ? selectedParent.canonicalPath + "/" : "";
+  return `${parentPath}${transformToUrl(sourceFieldValue)}`;
 }
 function reducer(state, action) {
   switch (action.type) {
     case "DEFAULT":
       return {
         ...state,
-        value: transformToUrl(action.payload),
+        value: action.payload,
         prevValue: state.value,
         needsUrlCheck: true
       };
     case "NO_URL_CHECK":
       return {
         ...state,
-        value: transformToUrl(action.payload),
+        value: action.payload,
         prevValue: state.value,
         needsUrlCheck: false
       };
@@ -3728,16 +3899,22 @@ function reducer(state, action) {
       };
     case "RESET_URL_CHECK_FLAG":
       return { ...state, needsUrlCheck: false };
+    case "SET_REPLACEMENT":
+      return { ...state, replacement: action.payload };
     case "SET_UIDPATH":
-      return { ...state, uIdPath: action.payload };
+      return { ...state, uidPath: action.payload };
+    case "SET_CANONICALPATH":
+      return { ...state, canonicalPath: action.payload };
+    case "SET_OVERRIDEPATH":
+      return { ...state, overridePath: action.payload };
     default:
       throw new Error();
   }
 }
-const Path = ({ config }) => {
+const Panel = ({ config }) => {
   const { form, model } = unstable_useContentManagerContext();
   const { initialValues, values, onChange } = form;
-  const { getRelatedRoute } = useApi();
+  const { getRelatedRoute, getAllRoutes, getProhibitedRouteIds } = useApi();
   const { formatMessage } = useIntl();
   const { get } = useFetchClient();
   const { allowedActions: {
@@ -3757,26 +3934,39 @@ const Path = ({ config }) => {
       conditions: []
     }
   ]);
-  const [routeId, setRouteId] = useState();
+  const [route, setRoute] = useState(null);
+  const [routes, setRoutes] = useState([]);
+  const [prohibitedRouteIds, setProhibitedRouteIds] = useState([]);
+  const [selectedParent, setSelectedParent] = useState(null);
   const [isOverride, setIsOverride] = useState(false);
   const [validationState, setValidationState] = useState("initial");
-  const [replacement, setReplacement] = useState("");
   const [initialLoadComplete, setInitialLoadComplete] = useState(false);
-  const [urlIsValid, setUrlIsValid] = useState(null);
   const [path, dispatchPath] = useReducer(reducer, {
     needsUrlCheck: false,
     value: "",
     prevValue: "",
-    uIdPath: ""
+    replacement: null,
+    uidPath: "",
+    canonicalPath: "",
+    overridePath: ""
   });
   const hasUserChangedField = useRef(false);
   const initialPath = useRef("");
-  const prevValueRef = useRef(null);
-  const debouncedCheckUrl = useCallback(debounce(checkUrl, 250), []);
+  const prevSourceValueRef = useRef(null);
+  const sourceFieldValue = useMemo(() => {
+    const key = config?.default;
+    if (!key) return "";
+    const currentValue = values[key];
+    if (!currentValue) return "";
+    return currentValue;
+  }, [values, config]);
+  const debouncedCheckPath = useCallback(debounce(checkPath, 250), []);
+  const debouncedCheckCanonicalPath = useCallback(debounce(checkCanonicalPath, 250), []);
   useEffect(() => {
-    onChange("webatlas_path", path.value);
+    if (isOverride) onChange("webatlas_path", path.overridePath);
     onChange("webatlas_override", isOverride);
-  }, [path.value, isOverride]);
+    onChange("webatlas_parent", selectedParent?.documentId || null);
+  }, [path.value, path.overridePath, isOverride, selectedParent]);
   const debouncedValueEffect = useMemo(() => debounce((currentValues) => {
     const key = config?.default;
     if (!key) return;
@@ -3785,38 +3975,37 @@ const Path = ({ config }) => {
       dispatchPath({ type: "NO_URL_CHECK", payload: "" });
       return;
     }
-    if (initialLoadComplete && (hasUserChangedField.current || !routeId) && prevValueRef.current !== currentValue && !isOverride) {
-      const path2 = config.pattern ? `${config.pattern}/${currentValue}` : `${currentValue}`;
+    if (initialLoadComplete && (hasUserChangedField.current || !route) && prevSourceValueRef.current !== currentValue && !isOverride) {
+      const path2 = getCanonicalPath(selectedParent, currentValue);
       if (currentValue === initialValues[key]) {
         dispatchPath({ type: "NO_URL_CHECK", payload: path2 });
       } else {
         dispatchPath({ type: "DEFAULT", payload: path2 });
       }
-      prevValueRef.current = currentValue;
+      prevSourceValueRef.current = currentValue;
     }
-  }, 500), [config?.default, config?.pattern, initialValues, isOverride, initialLoadComplete, routeId]);
+  }, 500), [config?.default, initialValues, isOverride, initialLoadComplete, route, selectedParent]);
   useEffect(() => {
     const key = config?.default;
     if (!key) return;
     const currentValue = values[key];
     const initialValue = initialValues[key];
-    if (currentValue && !isOverride) {
-      const path2 = config.pattern ? `${config.pattern}/${currentValue}` : `${currentValue}`;
-      onChange("webatlas_path", transformToUrl(path2));
+    if (currentValue !== initialValue && currentValue && !isOverride) {
+      onChange("webatlas_path", transformToUrl(currentValue));
     }
     if (!initialLoadComplete) return;
     if (currentValue !== initialValue) {
       hasUserChangedField.current = true;
     }
     debouncedValueEffect(values);
-  }, [values, debouncedValueEffect, initialLoadComplete]);
+  }, [values, debouncedValueEffect, initialLoadComplete, selectedParent]);
   useEffect(() => {
     if (path.needsUrlCheck && path.value) {
-      if (path.uIdPath === path.value || initialPath.current === path.value) return;
-      debouncedCheckUrl(path.value);
+      if (path.uidPath === path.value || initialPath.current === path.value) return;
+      debouncedCheckPath(path.value, route?.documentId || null);
       dispatchPath({ type: "RESET_URL_CHECK_FLAG" });
     }
-  }, [path.needsUrlCheck]);
+  }, [path.needsUrlCheck, path.value, path.uidPath, route]);
   useEffect(() => {
     async function getTypes() {
       if (!initialValues.documentId) {
@@ -3824,42 +4013,84 @@ const Path = ({ config }) => {
         return;
       }
       try {
-        const route = await getRelatedRoute(initialValues.documentId);
-        if (!route) return;
-        initialPath.current = initialValues.webatlas_path || route.uidPath;
-        setRouteId(route.id);
-        setIsOverride(route.isOverride || false);
-        dispatchPath({ type: "NO_TRANSFORM_AND_CHECK", payload: route.path || "" });
-        dispatchPath({ type: "SET_UIDPATH", payload: route.uidPath || "" });
+        const route2 = await getRelatedRoute(initialValues.documentId);
+        if (!route2) return;
+        initialPath.current = initialValues.webatlas_path || route2.uidPath;
+        setRoute(route2);
+        setIsOverride(route2.isOverride || false);
+        if (route2.isOverride) {
+          dispatchPath({ type: "SET_OVERRIDEPATH", payload: route2.path || "" });
+        } else {
+          dispatchPath({ type: "NO_TRANSFORM_AND_CHECK", payload: route2.path || "" });
+        }
+        dispatchPath({ type: "SET_UIDPATH", payload: route2.uidPath || "" });
         const key = config?.default;
         if (key) {
-          prevValueRef.current = values[key];
+          prevSourceValueRef.current = values[key];
         }
       } catch (err) {
-        setRouteId(null);
-        console.log(err);
+        setRoute(null);
+        strapi.log.error(err);
       }
       setInitialLoadComplete(true);
     }
     getTypes();
   }, [config]);
+  useEffect(() => {
+    if (initialValues.webatlas_parent && routes.length > 0 && !selectedParent) {
+      const parentRoute = routes.find((route2) => route2.documentId === initialValues.webatlas_parent);
+      if (parentRoute) {
+        setSelectedParent(parentRoute);
+        const canonicalPath = getCanonicalPath(parentRoute, sourceFieldValue);
+        dispatchPath({ type: "DEFAULT", payload: canonicalPath });
+      }
+    }
+  }, [initialValues, routes]);
   useEffect(() => {
     if (initialValues.webatlas_path) dispatchPath({ type: "NO_URL_CHECK", payload: initialValues.webatlas_path });
     if (initialValues.webatlas_override) setIsOverride(initialValues.webatlas_override);
+    async function fetchAllRoutes() {
+      const allRoutes = await getAllRoutes();
+      setRoutes(allRoutes);
+    }
+    fetchAllRoutes();
   }, []);
-  async function checkUrl(url) {
-    if (!url) return;
+  useEffect(() => {
+    async function fetchProhibitedRouteIds() {
+      const prohibitedIds = await getProhibitedRouteIds(route?.documentId);
+      setProhibitedRouteIds(prohibitedIds);
+    }
+    fetchProhibitedRouteIds();
+  }, [route]);
+  useEffect(() => {
+    if (!sourceFieldValue) return;
+    const canonicalPath = getCanonicalPath(selectedParent, sourceFieldValue);
+    !isOverride && dispatchPath({ type: "DEFAULT", payload: canonicalPath });
+    dispatchPath({ type: "SET_CANONICALPATH", payload: canonicalPath });
+    debouncedCheckCanonicalPath(canonicalPath, route?.documentId || null);
+    dispatchPath({ type: "RESET_URL_CHECK_FLAG" });
+  }, [selectedParent, sourceFieldValue, route, isOverride]);
+  async function checkCanonicalPath(path2, documentId) {
+    if (!path2) return;
+    try {
+      const result = await duplicateCheck({ fetchFunction: get, path: path2, routeDocumentId: documentId, withoutTransform: true });
+      dispatchPath({ type: "SET_CANONICALPATH", payload: result });
+    } catch (err) {
+      strapi.log.error(err);
+    }
+  }
+  async function checkPath(path2, route2) {
+    if (!path2) return;
     setValidationState("checking");
-    setReplacement("");
+    dispatchPath({ type: "SET_REPLACEMENT", payload: "" });
     try {
-      const data = await duplicateCheck(get, url);
-      if (!data || data === url) return;
+      const data = await duplicateCheck({ fetchFunction: get, path: path2, routeDocumentId: route2, withoutTransform: true });
+      if (!data || data === path2) return;
       dispatchPath({ type: "NO_URL_CHECK", payload: data });
-      setReplacement(data);
+      dispatchPath({ type: "SET_REPLACEMENT", payload: data });
     } catch (err) {
-      console.log(err);
+      strapi.log.error(err);
     } finally {
-      setUrlIsValid(null);
       setValidationState("done");
     }
   }
@@ -3878,101 +4109,52 @@ const Path = ({ config }) => {
         {
           direction: "column",
           alignItems: "stretch",
-          gap: 4,
+          gap: 1,
           children: [
+            !route && /* @__PURE__ */ jsxs(Fragment$1, { children: [
+              /* @__PURE__ */ jsx(NewPathInfo, {}),
+              /* @__PURE__ */ jsx(Divider, { marginTop: 2, marginBottom: 2 })
+            ] }),
+            /* @__PURE__ */ jsx(
+              RouteStructure,
+              {
+                canonicalPath: path.canonicalPath,
+                routes,
+                selectedParent,
+                setSelectedParent,
+                prohibitedRouteIds
+              }
+            ),
+            /* @__PURE__ */ jsx(Divider, { marginTop: 2, marginBottom: 2 }),
             /* @__PURE__ */ jsxs(Box, { children: [
-              !routeId && /* @__PURE__ */ jsxs(Fragment$1, { children: [
-                /* @__PURE__ */ jsx(Typography, { textColor: "neutral600", marginBottom: 2, children: formatMessage({
-                  id: getTranslation("components.CMEditViewAside.path.newPathInfo"),
-                  defaultMessage: "A new path will be created upon saving this entry."
-                }) }),
-                /* @__PURE__ */ jsx(Box, { paddingBottom: 2, paddingTop: 2, children: /* @__PURE__ */ jsx(Divider, {}) })
-              ] }),
-              /* @__PURE__ */ jsxs(
-                Field.Root,
+              /* @__PURE__ */ jsx(
+                PathInput,
                 {
-                  hint: config.default ? formatMessage({
-                    id: getTranslation("components.CMEditViewAside.path.input.start"),
-                    defaultMessage: "Edit the"
-                  }) + ' "' + config.default + '" ' + formatMessage({
-                    id: getTranslation("components.CMEditViewAside.path.input.end"),
-                    defaultMessage: "field to generate a path"
-                  }) : formatMessage({
-                    id: getTranslation("components.CMEditViewAside.path.input.noSourceField"),
-                    defaultMessage: "Use the override option to set a custom path"
-                  }),
-                  children: [
-                    /* @__PURE__ */ jsxs(Field.Label, { children: [
-                      formatMessage({
-                        id: getTranslation("components.CMEditViewAside.path.input.label"),
-                        defaultMessage: "Path"
-                      }),
-                      /* @__PURE__ */ jsx(Tooltip, { description: formatMessage({
-                        id: getTranslation("components.CMEditViewAside.path.input.tooltip"),
-                        defaultMessage: "The following characters are valid: A-Z, a-z, 0-9, /, -, _, $, ., +, !, *, ', (, )"
-                      }) })
-                    ] }),
-                    /* @__PURE__ */ jsx(
-                      Field.Input,
-                      {
-                        id: "path-input",
-                        value: path.value,
-                        onChange: (e) => dispatchPath({ type: "NO_TRANSFORM_AND_CHECK", payload: e.target.value }),
-                        disabled: !isOverride,
-                        onBlur: (e) => {
-                          if (e.target.value === path.prevValue) return;
-                          dispatchPath({ type: "DEFAULT", payload: e.target.value });
-                        },
-                        style: { outline: urlIsValid !== null ? urlIsValid === "valid" ? "1px solid #5cb176" : "1px solid #ee5e52" : void 0 }
-                      }
-                    ),
-                    /* @__PURE__ */ jsx(Field.Hint, {})
-                  ]
+                  path,
+                  dispatchPath,
+                  isOverride,
+                  config
                 }
               ),
-              /* @__PURE__ */ jsx(PathInfo, { validationState, replacement, setUrlStatus: setUrlIsValid }),
-              /* @__PURE__ */ jsx(
-                Flex,
+              validationState !== "initial" && /* @__PURE__ */ jsx(
+                PathInfo,
                 {
-                  gap: 2,
-                  paddingTop: 2,
-                  children: /* @__PURE__ */ jsx(
-                    Checkbox,
-                    {
-                      id: "path-override-checkbox",
-                      checked: isOverride,
-                      onCheckedChange: () => setIsOverride((prev) => !prev),
-                      disabled: !routeId && !canCreate || routeId && !canUpdate,
-                      children: /* @__PURE__ */ jsx(Typography, { textColor: "neutral600", children: formatMessage({
-                        id: getTranslation("components.CMEditViewAside.path.overrideCheckbox"),
-                        defaultMessage: "Override automatic path generation"
-                      }) })
-                    }
-                  )
+                  validationState,
+                  replacement: path.replacement
                 }
               )
             ] }),
-            path.uIdPath && /* @__PURE__ */ jsxs(Fragment$1, { children: [
-              /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(Divider, {}) }),
-              /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsxs(
-                Field.Root,
-                {
-                  hint: formatMessage({
-                    id: getTranslation("components.CMEditViewAside.path.uidPath.hint"),
-                    defaultMessage: "Permanent UID path, cannot be changed"
-                  }),
-                  children: [
-                    /* @__PURE__ */ jsx(
-                      Field.Input,
-                      {
-                        value: path.uIdPath,
-                        disabled: true
-                      }
-                    ),
-                    /* @__PURE__ */ jsx(Field.Hint, {})
-                  ]
-                }
-              ) })
+            /* @__PURE__ */ jsx(
+              OverrideCheckbox,
+              {
+                isOverride,
+                setIsOverride,
+                disabledCondition: !canCreate && !canUpdate
+              }
+            ),
+            path.uidPath && /* @__PURE__ */ jsxs(Fragment$1, { children: [
+              /* @__PURE__ */ jsx(Divider, { marginTop: 2, marginBottom: 2 }),
+              /* @__PURE__ */ jsx(UidPathDisplay, { path: path.uidPath })
             ] })
           ]
         }
@@ -3987,14 +4169,7 @@ const pluginPermissions = {
   "settings.general": [{ action: `plugin::${PLUGIN_ID}.settings.general`, subject: null }],
   "settings.navigation": [{ action: `plugin::${PLUGIN_ID}.settings.navigation`, subject: null }]
 };
-const CMEditViewAside = ({
-  // activeTab,
-  // collectionType,
-  // document,
-  documentId,
-  // meta,
-  model
-}) => {
+const CMEditViewAside = ({ documentId, model }) => {
   const { contentTypes } = useAllContentTypes();
   const { config } = usePluginConfig();
   const { formatMessage } = useIntl();
@@ -4054,7 +4229,7 @@ const CMEditViewAside = ({
   });
   if (!canAside || !isAllowedContentType || !isActiveContentType || !contentTypeConfig) return null;
   if (!config) {
-    console.error("CMEditViewAside: Plugin is not configured.");
+    strapi.log.error("CMEditViewAside: Plugin is not configured.");
     return null;
   }
   if (isLoading) return {
@@ -4066,37 +4241,31 @@ const CMEditViewAside = ({
   };
   return {
     title: panelTitle,
-    content: /* @__PURE__ */ jsx(Path, { config: contentTypeConfig })
+    content: /* @__PURE__ */ jsx(Panel, { config: contentTypeConfig })
   };
 };
 const index = {
   register(app) {
     app.addMenuLink({
-      to: `/plugins/${PLUGIN_ID}/paths`,
+      to: `plugins/${PLUGIN_ID}/paths`,
       icon: PathIcon,
       intlLabel: {
         id: `${PLUGIN_ID}.link.paths`,
         defaultMessage: "Paths"
       },
-      Component: async () => {
-        const component = await import("./index-BRKi-K-v.mjs");
-        return { default: component.default };
-      },
+      Component: () => import("./index-BvcX9hcc.mjs"),
       permissions: [
         pluginPermissions["page.routes"][0]
       ]
     });
     app.addMenuLink({
-      to: `/plugins/${PLUGIN_ID}/navigation`,
+      to: `plugins/${PLUGIN_ID}/navigation`,
       icon: NavigationIcon,
       intlLabel: {
         id: `${PLUGIN_ID}.link.navigation`,
         defaultMessage: "Navigation"
       },
-      Component: async () => {
-        const component = await import("./index-BWzalvVi.mjs");
-        return { default: component.default };
-      },
+      Component: () => import("./index-CNKWb8pn.mjs"),
       permissions: [
         pluginPermissions["page.navigation"][0]
       ]
@@ -4115,13 +4284,8 @@ const index = {
           defaultMessage: "General"
         },
         id: `${PLUGIN_ID}-general`,
-        to: `/settings/${PLUGIN_ID}/general`,
-        Component: async () => {
-          return await import(
-            /* webpackChunkName: "webatlas-settings-general-page" */
-            "./index-5OG4i6qO.mjs"
-          );
-        },
+        to: `${PLUGIN_ID}/general`,
+        Component: () => import("./index-CIM-JzLK.mjs"),
         permissions: [
           pluginPermissions["settings.general"][0]
         ]
@@ -4135,13 +4299,8 @@ const index = {
           defaultMessage: "Navigation"
         },
         id: `${PLUGIN_ID}-navigation`,
-        to: `/settings/${PLUGIN_ID}/navigation`,
-        Component: async () => {
-          return await import(
-            /* webpackChunkName: "webatlas-settings-navigation-page" */
-            "./index-3pYLMhui.mjs"
-          );
-        },
+        to: `${PLUGIN_ID}/navigation`,
+        Component: () => import("./index-BmyxSosC.mjs"),
         permissions: [
           pluginPermissions["settings.navigation"][0]
         ]
@@ -4161,7 +4320,7 @@ const index = {
     return Promise.all(
       locales.map(async (locale) => {
         try {
-          const { default: data } = await __variableDynamicImportRuntimeHelper(/* @__PURE__ */ Object.assign({ "./translations/de.json": () => import("./de-C-uxto84.mjs"), "./translations/en.json": () => import("./en-B1CHnIH7.mjs") }), `./translations/${locale}.json`, 3);
+          const { default: data } = await __variableDynamicImportRuntimeHelper(/* @__PURE__ */ Object.assign({ "./translations/de.json": () => import("./de-B5pRvs13.mjs"), "./translations/en.json": () => import("./en-BE-zzIv8.mjs") }), `./translations/${locale}.json`, 3);
           return { data, locale };
         } catch {
           return { data: {}, locale };
@@ -4183,6 +4342,5 @@ export {
   PLUGIN_VERSION as h,
   index as i,
   pluginPermissions as p,
-  transformToUrl as t,
   useApi as u
 };