@mattisvensson/strapi-plugin-webatlas 0.3.1 → 0.4.2

package/dist/_chunks/{index-CKoxbSC0.js → index-CSYue_D0.js}

@@ -41,7 +41,7 @@ const __variableDynamicImportRuntimeHelper = (glob, path, segs) => {
     );
   });
 };
-const version = "0.3.0";
+const version = "0.4.1";
 const keywords = [];
 const type = "commonjs";
 const exports$1 = {
@@ -215,14 +215,6 @@ function useApi() {
     const { data } = await get(`/webatlas/route/related?documentId=${relatedDocumentId}`);
     return data;
   };
-  const createExternalRoute = async (body) => {
-    const { data } = await post("/webatlas/route/external", {
-      data: {
-        ...body
-      }
-    });
-    return data;
-  };
   const getRoutes = async () => {
     const { data } = await get("/webatlas/route");
     return data;
@@ -235,30 +227,17 @@ function useApi() {
     });
     return data;
   };
-  const createNavItem = async (body) => {
-    const { data } = await post("/webatlas/navitem", {
-      data: {
-        ...body
-      }
-    });
-    return data;
-  };
-  const updateNavItem = async (documentId, body) => {
-    const { data } = await put(`/webatlas/navitem?documentId=${documentId}`, {
-      data: {
-        ...body
-      }
-    });
-    return data;
-  };
-  const deleteNavItem = async (documentId) => {
-    const { data } = await del(`/webatlas/navitem?documentId=${documentId}`);
-    return data;
-  };
   const getStructuredNavigation = async (documentId, variant = "nested") => {
     const { data } = await get(`/webatlas/navigation?documentId=${documentId}&variant=${variant}`);
     return data;
   };
+  const getNavigation = async ({ documentId, variant } = {}) => {
+    const query = [];
+    if (documentId) query.push(`documentId=${documentId}`);
+    if (variant) query.push(`variant=${variant}`);
+    const { data } = await get(`/webatlas/navigation${query.length > 0 ? `?${query.join("&")}` : ""}`);
+    return data;
+  };
   const deleteNavigation = async (documentId) => {
     const { data } = await del(`/webatlas/navigation?documentId=${documentId}`);
     return data;
@@ -269,19 +248,24 @@ function useApi() {
     });
     return data;
   };
+  const updateNavigationItemStructure = async (documentId, navigationItems) => {
+    const { data } = await put(`/webatlas/navigation/items`, {
+      navigationId: documentId,
+      navigationItems
+    });
+    return data;
+  };
   return {
     fetchAllContentTypes,
     fetchAllEntities,
     getRelatedRoute,
-    createExternalRoute,
     getRoutes,
     updateRoute,
-    createNavItem,
-    updateNavItem,
-    deleteNavItem,
     getStructuredNavigation,
+    getNavigation,
     deleteNavigation,
-    updateNavigation
+    updateNavigation,
+    updateNavigationItemStructure
   };
 }
 const useAllContentTypes = () => {
@@ -306,31 +290,32 @@ const useAllContentTypes = () => {
 };
 function usePluginConfig() {
   const { put, get } = admin.useFetchClient();
-  const [data, setData] = React.useState(null);
-  const [loading, setLoading] = React.useState(false);
-  const [error, setError] = React.useState(null);
+  const [config, setConfigData] = React.useState(null);
+  const [loading, setLoading] = React.useState(true);
+  const [fetchError, setFetchError] = React.useState(null);
   React.useEffect(() => {
     const fetchData = async () => {
       setLoading(true);
+      setFetchError(null);
       try {
         const { data: { data: contentTypesArray } } = await get("/content-manager/content-types");
-        let { data: config } = await get("/webatlas/config");
-        if (!config || !config.selectedContentTypes) {
-          throw new Error(`HTTP error! Couldn't fetch plugin config`);
+        let { data: config2 } = await get("/webatlas/config");
+        if (!config2 || !config2.selectedContentTypes) {
+          throw new Error(`Couldn't fetch plugin config`);
         }
         const allowedContentTypes = contentTypesArray.filter(
           (type2) => type2.pluginOptions?.webatlas?.active === true
         );
         const contentTypeUids = new Set(allowedContentTypes.map((type2) => type2.uid));
-        const activeContentTypes = config.selectedContentTypes.filter((type2) => contentTypeUids.has(type2.uid));
-        if (JSON.stringify(activeContentTypes) !== JSON.stringify(config.selectedContentTypes)) {
-          config = { ...config, selectedContentTypes: activeContentTypes };
-          setConfig(config);
+        const activeContentTypes = config2.selectedContentTypes.filter((type2) => contentTypeUids.has(type2.uid));
+        if (JSON.stringify(activeContentTypes) !== JSON.stringify(config2.selectedContentTypes)) {
+          config2 = { ...config2, selectedContentTypes: activeContentTypes };
+          await setConfig(config2);
         }
-        setData(config);
-        setLoading(false);
-      } catch (error2) {
-        setError(error2.message);
+        setConfigData(config2);
+      } catch (error) {
+        setFetchError(error.message);
+      } finally {
         setLoading(false);
       }
     };
@@ -338,14 +323,12 @@ function usePluginConfig() {
   }, []);
   async function setConfig(body) {
     try {
-      await put("/webatlas/config", {
-        ...body
-      });
-    } catch (error2) {
-      setError(error2.message);
+      await put("/webatlas/config", { ...body });
+    } catch (error) {
+      throw error;
     }
   }
-  return { data, loading, error, setConfig };
+  return { config, loading, fetchError, setConfig };
 }
 function transformToUrl(input) {
   const specialCharMap = {
@@ -4006,7 +3989,7 @@ const Alias = ({ config }) => {
 const CMEditViewAside = () => {
   const { model } = admin.unstable_useContentManagerContext();
   const { contentTypes } = useAllContentTypes();
-  const { data: config } = usePluginConfig();
+  const { config } = usePluginConfig();
   const [contentTypeConfig, setContentTypeConfig] = React.useState(null);
   const [isAllowedContentType, setIsAllowedContentType] = React.useState(false);
   const [isActiveContentType, setIsActiveContentType] = React.useState(false);
@@ -4094,7 +4077,7 @@ const index = {
         defaultMessage: "Routes"
       },
       Component: async () => {
-        const component = await Promise.resolve().then(() => require("./index-DsTyLL2l.js"));
+        const component = await Promise.resolve().then(() => require("./index-CiY-8z8F.js"));
         return { default: component.default };
       },
       permissions: [
@@ -4113,7 +4096,7 @@ const index = {
         defaultMessage: "Navigation"
       },
       Component: async () => {
-        const component = await Promise.resolve().then(() => require("./index-BAqGJ3TM.js"));
+        const component = await Promise.resolve().then(() => require("./index-Clikpy91.js"));
         return { default: component.default };
       },
       permissions: [
@@ -4142,7 +4125,7 @@ const index = {
         Component: async () => {
           return await Promise.resolve().then(() => require(
             /* webpackChunkName: "webatlas-settings-page" */
-            "./index-C4ou6MTp.js"
+            "./index-IHvD3566.js"
           ));
         },
         permissions: [
@@ -4171,7 +4154,7 @@ const index = {
     return Promise.all(
       locales.map(async (locale) => {
         try {
-          const { default: data } = await __variableDynamicImportRuntimeHelper(/* @__PURE__ */ Object.assign({ "./translations/de.json": () => Promise.resolve().then(() => require("./de-4tL_cJTC.js")), "./translations/en.json": () => Promise.resolve().then(() => require("./en-Bg4z3fR7.js")) }), `./translations/${locale}.json`, 3);
+          const { default: data } = await __variableDynamicImportRuntimeHelper(/* @__PURE__ */ Object.assign({ "./translations/de.json": () => Promise.resolve().then(() => require("./de-RiCps8UH.js")), "./translations/en.json": () => Promise.resolve().then(() => require("./en-JLW5S3ZC.js")) }), `./translations/${locale}.json`, 3);
           return { data, locale };
         } catch {
           return { data: {}, locale };
@@ -4183,7 +4166,6 @@ const index = {
 exports.PLUGIN_NAME = PLUGIN_NAME;
 exports.Tooltip = Tooltip;
 exports.URLInfo = URLInfo;
-exports._extends = _extends;
 exports.debounce = debounce;
 exports.duplicateCheck = duplicateCheck;
 exports.getTranslation = getTranslation;

package/dist/_chunks/index-CVj7qbwh.mjs

@@ -0,0 +1,281 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useReducer, useState, useEffect } from "react";
+import { Button, Box, Accordion, Field, SingleSelect, SingleSelectOption, MultiSelect, MultiSelectOption } from "@strapi/design-system";
+import { Page, Layouts, useNotification } from "@strapi/strapi/admin";
+import { P as PLUGIN_NAME, g as getTranslation, T as Tooltip, b as usePluginConfig, c as useAllContentTypes, t as transformToUrl } from "./index-CtJ_9-RB.mjs";
+import { useIntl } from "react-intl";
+import "@strapi/icons/symbols";
+import { F as FullLoader } from "./FullLoader-CrPED_dY.mjs";
+function PageWrapper({
+  settingsState,
+  initialState,
+  save,
+  isSaving,
+  children
+}) {
+  const { formatMessage } = useIntl();
+  return /* @__PURE__ */ jsxs(Page.Main, { children: [
+    /* @__PURE__ */ jsx(
+      Layouts.Header,
+      {
+        title: PLUGIN_NAME,
+        subtitle: formatMessage({
+          id: getTranslation("settings.page.subtitle"),
+          defaultMessage: "Settings"
+        }),
+        primaryAction: settingsState && initialState && save && /* @__PURE__ */ jsx(
+          Button,
+          {
+            type: "submit",
+            onClick: () => save(),
+            loading: isSaving,
+            disabled: JSON.stringify(settingsState) === JSON.stringify(initialState) || settingsState.selectedContentTypes.find((cta) => !cta.default) !== void 0 || isSaving,
+            children: formatMessage({
+              id: getTranslation("save"),
+              defaultMessage: "Save"
+            })
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsx(Layouts.Content, { children: /* @__PURE__ */ jsx(
+      Box,
+      {
+        background: "neutral0",
+        borderColor: "neutral150",
+        hasRadius: true,
+        paddingBottom: 4,
+        paddingLeft: 4,
+        paddingRight: 4,
+        paddingTop: 6,
+        shadow: "tableShadow",
+        children
+      }
+    ) })
+  ] });
+}
+function ContentTypeAccordion({
+  contentType,
+  contentTypeSettings,
+  dispatch
+}) {
+  const { formatMessage } = useIntl();
+  if (!contentType) return null;
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      borderColor: !contentTypeSettings.default && "danger500",
+      children: /* @__PURE__ */ jsxs(Accordion.Item, { value: contentType.uid, size: "S", children: [
+        /* @__PURE__ */ jsx(Accordion.Header, { children: /* @__PURE__ */ jsx(Accordion.Trigger, { children: contentType?.info.displayName }) }),
+        /* @__PURE__ */ jsx(Accordion.Content, { children: /* @__PURE__ */ jsxs(Box, { padding: 3, children: [
+          /* @__PURE__ */ jsxs(
+            Field.Root,
+            {
+              name: "selectedContentTypes",
+              hint: formatMessage({
+                id: getTranslation("settings.page.defaultField.hint"),
+                defaultMessage: 'The selected field from the content type will be used to generate the URL alias. Use a field that is unique and descriptive, such as a "title" or "name".'
+              }),
+              error: !contentTypeSettings.default && formatMessage({
+                id: getTranslation("settings.page.defaultField.error"),
+                defaultMessage: "Please select a default field"
+              }),
+              required: true,
+              children: [
+                /* @__PURE__ */ jsx(Field.Label, { children: formatMessage({
+                  id: getTranslation("settings.page.defaultField"),
+                  defaultMessage: "Default URL Alias field"
+                }) }),
+                /* @__PURE__ */ jsx(
+                  SingleSelect,
+                  {
+                    name: `defaultField-${contentType.uid}`,
+                    onClear: () => dispatch({ type: "SET_DEFAULT_FIELD", payload: { ctUid: contentType.uid, field: "" } }),
+                    value: contentTypeSettings?.default || "",
+                    onChange: (value) => dispatch({ type: "SET_DEFAULT_FIELD", payload: { ctUid: contentType.uid, field: value } }),
+                    children: Object.entries(contentType.attributes).map(([key], index) => {
+                      if (key === "id" || key === "documentId" || key === "createdAt" || key === "updatedAt" || key === "createdBy" || key === "updatedBy" || key === "webatlas_path" || key === "webatlas_override") return null;
+                      return /* @__PURE__ */ jsx(SingleSelectOption, { value: key, children: key }, index);
+                    })
+                  }
+                ),
+                /* @__PURE__ */ jsx(Field.Hint, {})
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx(Box, { paddingTop: 4, children: /* @__PURE__ */ jsxs(
+            Field.Root,
+            {
+              name: "urlAliasPattern",
+              hint: formatMessage({
+                id: getTranslation("settings.page.urlAliasPattern.hint"),
+                defaultMessage: 'The pattern to prepend to the generated URL alias. For example, if you enter "blog" and the value of default field is "My First Post", the generated URL alias will be "blog/my-first-post". Leave empty for no prefix.'
+              }),
+              children: [
+                /* @__PURE__ */ jsxs(Field.Label, { children: [
+                  formatMessage({
+                    id: getTranslation("settings.page.urlAliasPattern"),
+                    defaultMessage: "URL Alias Pattern"
+                  }),
+                  /* @__PURE__ */ jsx(Tooltip, { description: formatMessage({
+                    id: getTranslation("settings.page.urlAliasPattern.tooltip"),
+                    defaultMessage: "Leading and trailing slashes will be removed. Spaces will be replaced with hyphens. Special characters will be encoded."
+                  }) })
+                ] }),
+                /* @__PURE__ */ jsx(
+                  Field.Input,
+                  {
+                    value: contentTypeSettings.pattern,
+                    onChange: (e) => dispatch({ type: "SET_PATTERN", payload: { ctUid: contentType.uid, pattern: e.target.value } }),
+                    disabled: !contentTypeSettings.default,
+                    type: "text",
+                    placeholder: formatMessage({
+                      id: getTranslation("settings.page.urlAliasPattern.placeholder"),
+                      defaultMessage: "e.g. blog"
+                    })
+                  }
+                ),
+                /* @__PURE__ */ jsx(Field.Hint, {})
+              ]
+            }
+          ) })
+        ] }) })
+      ] }, contentType.uid)
+    },
+    contentType.uid
+  );
+}
+function reducer(settingsState, action) {
+  let updatedContentTypes;
+  switch (action.type) {
+    case "SET_SELECTED_CONTENT_TYPES":
+      updatedContentTypes = action.payload.map((ct) => {
+        return settingsState.selectedContentTypes.find((cta) => cta.uid === ct.uid) || ct;
+      });
+      return { ...settingsState, selectedContentTypes: updatedContentTypes };
+    case "SET_DEFAULT_FIELD":
+      updatedContentTypes = settingsState.selectedContentTypes.map(
+        (ct) => ct.uid === action.payload.ctUid ? { ...ct, default: action.payload.field } : ct
+      );
+      return { ...settingsState, selectedContentTypes: updatedContentTypes };
+    case "SET_PATTERN":
+      updatedContentTypes = settingsState.selectedContentTypes.map(
+        (ct) => ct.uid === action.payload.ctUid ? { ...ct, pattern: transformToUrl(action.payload.pattern) } : ct
+      );
+      return { ...settingsState, selectedContentTypes: updatedContentTypes };
+    default:
+      throw new Error();
+  }
+}
+const Settings = () => {
+  const { config, setConfig, loading, fetchError } = usePluginConfig();
+  const [settingsState, dispatch] = useReducer(reducer, config || { selectedContentTypes: [] });
+  const { contentTypes: allContentTypesData } = useAllContentTypes();
+  const allContentTypes = allContentTypesData?.filter((ct) => ct.pluginOptions?.webatlas?.active === true);
+  const [initialState, setInitialState] = useState(config || { selectedContentTypes: [] });
+  const { toggleNotification } = useNotification();
+  const { formatMessage } = useIntl();
+  const [isSaving, setIsSaving] = useState(false);
+  useEffect(() => {
+    setInitialState(config || { selectedContentTypes: [] });
+  }, [config]);
+  useEffect(() => {
+    if (!config) return;
+    dispatch({ type: "SET_SELECTED_CONTENT_TYPES", payload: config.selectedContentTypes });
+  }, [config]);
+  useEffect(() => {
+    if (fetchError) {
+      toggleNotification({
+        type: "danger",
+        message: formatMessage({
+          id: getTranslation("notification.error"),
+          defaultMessage: "An error occurred"
+        }) + ": " + fetchError
+      });
+    }
+  }, [fetchError, toggleNotification, formatMessage]);
+  async function save() {
+    if (!settingsState || settingsState.selectedContentTypes.find((cta) => !cta.default) !== void 0) return;
+    setIsSaving(true);
+    try {
+      await setConfig(settingsState);
+      setInitialState(settingsState);
+      toggleNotification({
+        type: "success",
+        message: formatMessage({
+          id: getTranslation("notification.settings.saved"),
+          defaultMessage: "Settings saved successfully"
+        })
+      });
+      setIsSaving(false);
+    } catch (err) {
+      setIsSaving(false);
+      toggleNotification({
+        type: "danger",
+        message: formatMessage({
+          id: getTranslation("notification.error"),
+          defaultMessage: "An error occurred"
+        }) + ": " + err
+      });
+      console.error(err);
+    }
+  }
+  if (loading) {
+    return /* @__PURE__ */ jsx(PageWrapper, { children: /* @__PURE__ */ jsx(FullLoader, { height: 200 }) });
+  }
+  return /* @__PURE__ */ jsxs(PageWrapper, { settingsState, initialState, save, isSaving, children: [
+    /* @__PURE__ */ jsxs(
+      Field.Root,
+      {
+        name: "selectedContentTypes",
+        hint: formatMessage({
+          id: getTranslation("settings.page.enabledContentTypes.hint"),
+          defaultMessage: "Select the content types for which you want to enable URL aliases"
+        }),
+        children: [
+          /* @__PURE__ */ jsx(Field.Label, { children: formatMessage({
+            id: getTranslation("settings.page.enabledContentTypes"),
+            defaultMessage: "Enabled Content Types"
+          }) }),
+          /* @__PURE__ */ jsx(
+            MultiSelect,
+            {
+              placeholder: formatMessage({
+                id: getTranslation("settings.page.enabledContentTypes.placeholder"),
+                defaultMessage: "Select content types..."
+              }),
+              onClear: () => dispatch({ type: "SET_SELECTED_CONTENT_TYPES", payload: [] }),
+              value: [...settingsState.selectedContentTypes.map((ct) => ct.uid)],
+              onChange: (value) => dispatch({
+                type: "SET_SELECTED_CONTENT_TYPES",
+                payload: value.map((v) => ({
+                  uid: v,
+                  default: "",
+                  pattern: ""
+                }))
+              }),
+              withTags: true,
+              children: allContentTypes && allContentTypes.map(
+                (item) => /* @__PURE__ */ jsx(MultiSelectOption, { value: item.uid, children: item.info.displayName }, item.uid)
+              )
+            }
+          ),
+          /* @__PURE__ */ jsx(Field.Hint, {})
+        ]
+      }
+    ),
+    settingsState.selectedContentTypes && settingsState.selectedContentTypes.length > 0 && /* @__PURE__ */ jsx(Box, { paddingTop: 4, children: /* @__PURE__ */ jsxs(Field.Root, { name: "selectedContentTypesAccordion", children: [
+      /* @__PURE__ */ jsx(Field.Label, { children: formatMessage({
+        id: getTranslation("settings.page.contentTypeSettings"),
+        defaultMessage: "Content Type settings"
+      }) }),
+      /* @__PURE__ */ jsx(Accordion.Root, { children: settingsState.selectedContentTypes?.map((contentTypeSettings) => {
+        const ct = allContentTypes?.find((item) => item.uid === contentTypeSettings.uid);
+        return /* @__PURE__ */ jsx(ContentTypeAccordion, { contentType: ct, contentTypeSettings, dispatch }, contentTypeSettings.uid);
+      }) })
+    ] }) })
+  ] });
+};
+export {
+  Settings as default
+};

package/dist/_chunks/index-CiY-8z8F.js

@@ -0,0 +1,126 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const designSystem = require("@strapi/design-system");
+const index = require("./index-CSYue_D0.js");
+const admin = require("@strapi/strapi/admin");
+const FullLoader = require("./FullLoader-Cmsf8xS6.js");
+const EmptyBox = require("./EmptyBox-T8t29l25.js");
+const reactIntl = require("react-intl");
+const icons = require("@strapi/icons");
+function getRouteType(route) {
+  if (route.wrapper) {
+    return "wrapper";
+  } else if (!route.internal) {
+    return "external";
+  } else {
+    return "internal";
+  }
+}
+function TableHeader() {
+  const { formatMessage } = reactIntl.useIntl();
+  return /* @__PURE__ */ jsxRuntime.jsx(designSystem.Thead, { children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Tr, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Th, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "sigma", children: "ID" }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Th, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "sigma", children: formatMessage({
+      id: index.getTranslation("title"),
+      defaultMessage: "Title"
+    }) }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Th, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "sigma", children: formatMessage({
+      id: index.getTranslation("route"),
+      defaultMessage: "Route"
+    }) }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Th, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "sigma", children: formatMessage({
+      id: index.getTranslation("routes.page.column.type"),
+      defaultMessage: "Type"
+    }) }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Th, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.VisuallyHidden, { children: formatMessage({
+      id: index.getTranslation("actions"),
+      defaultMessage: "Actions"
+    }) }) })
+  ] }) });
+}
+function TableRow({ route }) {
+  const { formatMessage } = reactIntl.useIntl();
+  return /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Tr, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Td, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { textColor: "neutral800", children: route.id }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Td, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { textColor: "neutral800", children: route.title }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Td, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { textColor: "neutral800", children: route.fullPath }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Td, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { textColor: "neutral800", children: formatMessage({
+      id: index.getTranslation(`route.type.${getRouteType(route)}`),
+      defaultMessage: "-"
+    }) }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Td, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Flex, { gap: 2, justifyContent: "end", children: route.internal && /* @__PURE__ */ jsxRuntime.jsx(
+      designSystem.LinkButton,
+      {
+        variant: "secondary",
+        startIcon: /* @__PURE__ */ jsxRuntime.jsx(icons.Pencil, {}),
+        href: `/admin/content-manager/collection-types/${route.relatedContentType}/${route.relatedDocumentId}`,
+        children: formatMessage({
+          id: index.getTranslation("edit"),
+          defaultMessage: "Edit"
+        })
+      }
+    ) }) })
+  ] });
+}
+function PageWrapper({ children }) {
+  const { formatMessage } = reactIntl.useIntl();
+  return /* @__PURE__ */ jsxRuntime.jsxs(admin.Page.Main, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      admin.Layouts.Header,
+      {
+        title: formatMessage({
+          id: index.getTranslation("routes.page.title"),
+          defaultMessage: "Routes"
+        }),
+        subtitle: formatMessage({
+          id: index.getTranslation("routes.page.subtitle"),
+          defaultMessage: "Overview of all existing routes"
+        })
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(admin.Layouts.Content, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { children }) })
+  ] });
+}
+const Routes = () => {
+  const { getRoutes } = index.useApi();
+  const { formatMessage } = reactIntl.useIntl();
+  const { toggleNotification } = admin.useNotification();
+  const [routes, setRoutes] = React.useState([]);
+  const [loading, setLoading] = React.useState(true);
+  React.useEffect(() => {
+    async function fetchRoutes() {
+      try {
+        const data = await getRoutes();
+        setRoutes(data);
+      } catch (err) {
+        console.error("Failed to fetch routes:", err);
+        toggleNotification({
+          type: "danger",
+          message: formatMessage({
+            id: index.getTranslation("notification.routes.fetchFailed"),
+            defaultMessage: "Failed to fetch routes"
+          })
+        });
+      } finally {
+        setLoading(false);
+      }
+    }
+    fetchRoutes();
+  }, []);
+  if (loading) {
+    return /* @__PURE__ */ jsxRuntime.jsx(PageWrapper, { children: /* @__PURE__ */ jsxRuntime.jsx(FullLoader.FullLoader, {}) });
+  }
+  if (routes.length === 0) {
+    return /* @__PURE__ */ jsxRuntime.jsx(PageWrapper, { children: /* @__PURE__ */ jsxRuntime.jsx(FullLoader.Center, { height: 400, children: /* @__PURE__ */ jsxRuntime.jsx(EmptyBox.EmptyBox, { msg: formatMessage({
+      id: index.getTranslation("routes.page.emptyRoutes"),
+      defaultMessage: "No routes found"
+    }) }) }) });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(PageWrapper, { children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Table, { colCount: 4, rowCount: routes.length, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(TableHeader, {}),
+    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Tbody, { children: routes.map((route) => /* @__PURE__ */ jsxRuntime.jsx(TableRow, { route }, route.id)) })
+  ] }) });
+};
+exports.default = Routes;