@mattisvensson/strapi-plugin-webatlas 0.2.6 → 0.3.0

package/dist/_chunks/{index-D4IHmUrH.js → index-B0XE_zRP.js}

@@ -6,7 +6,8 @@ const designSystem = require("@strapi/design-system");
 const admin = require("@strapi/strapi/admin");
 const React = require("react");
 const ReactDOM = require("react-dom");
-const index = require("./index-DrlYDm6a.js");
+const index = require("./index-B85fJxGa.js");
+const reactIntl = require("react-intl");
 const EmptyBox = require("./EmptyBox-DT6D5gcf.js");
 const _baseConvert = require("./_baseConvert-B84_vf8X.js");
 const core = require("@dnd-kit/core");
@@ -53,6 +54,7 @@ function Delete({ variant, item, fetchNavigations }) {
   const itemName = React.useRef(variant === "NavDelete" ? item.name : item.route.title);
   const closeModalState = React.useRef(variant === "NavDelete" ? "NavOverview" : "");
   const { setModalType } = React.useContext(ModalContext);
+  const { formatMessage } = reactIntl.useIntl();
   const handleDelete = async () => {
     try {
       if (variant === "NavDelete") await deleteNavigation(item.documentId);
@@ -65,20 +67,44 @@ function Delete({ variant, item, fetchNavigations }) {
   };
   return /* @__PURE__ */ jsxRuntime.jsx(designSystem.Dialog.Root, { defaultOpen: true, onClose: () => setModalType(closeModalState.current), children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Dialog.Content, { children: [
     /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Dialog.Header, { children: [
-      'Delete "',
+      formatMessage({
+        id: index.getTranslation("delete"),
+        defaultMessage: "Delete"
+      }),
+      ': "',
       itemName.current,
       '"?'
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Dialog.Body, { children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Typography, { textAlign: "center", children: [
-      "Are you sure you want to delete the navigation ",
-      variant === "ItemDelete" && "item",
-      ' "',
-      /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontWeight: "bold" }, children: itemName.current }),
-      '"? This can not be undone.'
-    ] }) }),
+    /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Dialog.Body, { children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Typography, { textAlign: "center", children: [
+        formatMessage({
+          id: index.getTranslation("modal.delete.message.start"),
+          defaultMessage: "You are about to delete the following"
+        }),
+        " ",
+        variant === "ItemDelete" ? formatMessage({
+          id: index.getTranslation("modal.delete.message.navItem"),
+          defaultMessage: "navigation item"
+        }) : formatMessage({
+          id: index.getTranslation("modal.delete.message.navigation"),
+          defaultMessage: "navigation"
+        })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { textAlign: "center", fontWeight: "bold", style: { marginTop: 8, marginBottom: 8, fontSize: 20 }, children: itemName.current }),
+      /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { textAlign: "center", children: formatMessage({
+        id: index.getTranslation("modal.delete.message.end"),
+        defaultMessage: "This can not be undone. Are you sure?"
+      }) })
+    ] }),
     /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Dialog.Footer, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(designSystem.Dialog.Cancel, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { onClick: () => setModalType(closeModalState.current), variant: "tertiary", children: "No, keep" }) }),
-      /* @__PURE__ */ jsxRuntime.jsx(designSystem.Dialog.Action, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { variant: "danger-light", onClick: () => handleDelete(), startIcon: /* @__PURE__ */ jsxRuntime.jsx(icons.Trash, {}), children: "Yes, delete" }) })
+      /* @__PURE__ */ jsxRuntime.jsx(designSystem.Dialog.Cancel, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { onClick: () => setModalType(closeModalState.current), variant: "tertiary", children: formatMessage({
+        id: index.getTranslation("modal.delete.cancelText"),
+        defaultMessage: "No, keep"
+      }) }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(designSystem.Dialog.Action, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { variant: "danger-light", onClick: () => handleDelete(), startIcon: /* @__PURE__ */ jsxRuntime.jsx(icons.Trash, {}), children: formatMessage({
+        id: index.getTranslation("modal.delete.confirmText"),
+        defaultMessage: "Yes, delete"
+      }) }) })
     ] })
   ] }) });
 }
@@ -94,9 +120,11 @@ function NavModal({
   loading,
   modalToOpen,
   footer,
-  currentModalType = null
+  currentModalType = null,
+  currentModalMode = "create"
 }) {
   const { setModalType } = React.useContext(ModalContext);
+  const { formatMessage } = reactIntl.useIntl();
   return /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Modal.Root, { open: true, onOpenChange: () => setModalType(""), children: [
     triggerText && /* @__PURE__ */ jsxRuntime.jsx(designSystem.Modal.Trigger, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { variant: triggerVariant, children: triggerText }) }),
     /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Modal.Content, { children: [
@@ -113,16 +141,25 @@ function NavModal({
             /* @__PURE__ */ jsxRuntime.jsx(designSystem.Modal.Footer, { children: footer ? footer : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
               /* @__PURE__ */ jsxRuntime.jsx(designSystem.Modal.Close, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { variant: "tertiary", type: "button", children: closeText }) }),
               /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { gap: 2, children: [
-                currentModalType && /* @__PURE__ */ jsxRuntime.jsxs(
+                currentModalType && currentModalMode === "create" && /* @__PURE__ */ jsxRuntime.jsxs(
                   designSystem.SingleSelect,
                   {
                     onChange: (value) => setModalType(value),
                     placeholder: "Choose item type",
                     value: currentModalType || "",
                     children: [
-                      /* @__PURE__ */ jsxRuntime.jsx(designSystem.SingleSelectOption, { value: "ItemCreate", children: "Internal item" }),
-                      /* @__PURE__ */ jsxRuntime.jsx(designSystem.SingleSelectOption, { value: "WrapperCreate", children: "Wrapper item" }),
-                      /* @__PURE__ */ jsxRuntime.jsx(designSystem.SingleSelectOption, { value: "ExternalCreate", children: "External item" })
+                      /* @__PURE__ */ jsxRuntime.jsx(designSystem.SingleSelectOption, { value: "ItemCreate", children: formatMessage({
+                        id: index.getTranslation("modal.navModal.internalItem"),
+                        defaultMessage: "Internal item"
+                      }) }),
+                      /* @__PURE__ */ jsxRuntime.jsx(designSystem.SingleSelectOption, { value: "WrapperCreate", children: formatMessage({
+                        id: index.getTranslation("modal.navModal.wrapperItem"),
+                        defaultMessage: "Wrapper item"
+                      }) }),
+                      /* @__PURE__ */ jsxRuntime.jsx(designSystem.SingleSelectOption, { value: "ExternalCreate", children: formatMessage({
+                        id: index.getTranslation("modal.navModal.externalItem"),
+                        defaultMessage: "External item"
+                      }) })
                     ]
                   }
                 ),
@@ -142,6 +179,7 @@ function NavCreate() {
   const [name, setName] = React.useState("");
   const [isActive, setIsActive] = React.useState(true);
   const [loading, setLoading] = React.useState(false);
+  const { formatMessage } = reactIntl.useIntl();
   const createNavigation = async () => {
     setLoading(true);
     try {
@@ -157,14 +195,17 @@ function NavCreate() {
   return /* @__PURE__ */ jsxRuntime.jsx(
     NavModal,
     {
-      confirmText: "Create",
-      closeText: "Cancel",
-      titleText: "Create new navigation",
-      loadingText: "Creating",
+      confirmText: formatMessage({ id: index.getTranslation("modal.navCreate.confirmText"), defaultMessage: "Create" }),
+      closeText: formatMessage({ id: index.getTranslation("modal.navCreate.closeText"), defaultMessage: "Cancel" }),
+      titleText: formatMessage({ id: index.getTranslation("modal.navCreate.titleText"), defaultMessage: "Create new navigation" }),
+      loadingText: formatMessage({ id: index.getTranslation("modal.navCreate.loadingText"), defaultMessage: "Creating" }),
       onConfirm: createNavigation,
       loading,
       children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Root, { gap: 4, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 12, s: 12, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { width: "100%", children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Field.Root, { children: [
-        /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: "Name" }),
+        /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: formatMessage({
+          id: index.getTranslation("modal.nameField.label"),
+          defaultMessage: "Name"
+        }) }),
         /* @__PURE__ */ jsxRuntime.jsx(
           designSystem.Field.Input,
           {
@@ -183,6 +224,7 @@ function NavEdit({ item, fetchNavigations }) {
   const [visible, setVisible] = React.useState(item.visible);
   const [loading, setLoading] = React.useState(false);
   const { updateNavigation } = index.useApi();
+  const { formatMessage } = reactIntl.useIntl();
   const updateNav = async () => {
     setLoading(true);
     try {
@@ -198,20 +240,29 @@ function NavEdit({ item, fetchNavigations }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     NavModal,
     {
-      confirmText: "Create",
-      closeText: "Cancel",
-      titleText: `Edit navigation: ${item.name}`,
-      loadingText: "Creating",
+      confirmText: formatMessage({ id: index.getTranslation("modal.navEdit.confirmText"), defaultMessage: "Create" }),
+      closeText: formatMessage({ id: index.getTranslation("modal.navEdit.closeText"), defaultMessage: "Cancel" }),
+      titleText: formatMessage({ id: index.getTranslation("modal.navEdit.titleText"), defaultMessage: "Edit navigation:" }) + " " + item.name,
+      loadingText: formatMessage({ id: index.getTranslation("modal.navEdit.loadingText"), defaultMessage: "Updating" }),
       onConfirm: updateNav,
       loading,
       modalToOpen: "NavOverview",
       footer: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-        /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { onClick: () => setModalType("NavOverview"), variant: "tertiary", children: "Cancel" }),
-        /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { children: "Update" })
+        /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { onClick: () => setModalType("NavOverview"), variant: "tertiary", children: formatMessage({
+          id: index.getTranslation("modal.navEdit.closeText"),
+          defaultMessage: "Cancel"
+        }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { children: formatMessage({
+          id: index.getTranslation("modal.navEdit.confirmText"),
+          defaultMessage: "Update"
+        }) })
       ] }),
       children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Grid.Root, { gap: 4, children: [
         /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { s: 12, m: 6, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { width: "100%", children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Field.Root, { children: [
-          /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: "Name" }),
+          /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: formatMessage({
+            id: index.getTranslation("modal.nameField.label"),
+            defaultMessage: "Name"
+          }) }),
           /* @__PURE__ */ jsxRuntime.jsx(
             designSystem.Field.Input,
             {
@@ -222,8 +273,25 @@ function NavEdit({ item, fetchNavigations }) {
           )
         ] }) }) }),
         /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { s: 12, m: 6, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { width: "100%", children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Field.Root, { children: [
-          /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: "Active" }),
-          /* @__PURE__ */ jsxRuntime.jsx(designSystem.Toggle, { onLabel: "Yes", offLabel: "No", checked: visible, onChange: () => setVisible((prev) => !prev) })
+          /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: formatMessage({
+            id: index.getTranslation("modal.activeField.label"),
+            defaultMessage: "Active"
+          }) }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            designSystem.Toggle,
+            {
+              onLabel: formatMessage({
+                id: index.getTranslation("modal.activeField.onLabel"),
+                defaultMessage: "Yes"
+              }),
+              offLabel: formatMessage({
+                id: index.getTranslation("modal.activeField.offLabel"),
+                defaultMessage: "No"
+              }),
+              checked: visible,
+              onChange: () => setVisible((prev) => !prev)
+            }
+          )
         ] }) }) })
       ] })
     }
@@ -232,6 +300,7 @@ function NavEdit({ item, fetchNavigations }) {
 function NavOverview({ navigations, setActionItem }) {
   const { setModalType } = React.useContext(ModalContext);
   const { selectedNavigation, setSelectedNavigation } = React.useContext(SelectedNavigationContext);
+  const { formatMessage } = reactIntl.useIntl();
   const handleSelect = (nav) => {
     setSelectedNavigation(nav);
     setModalType("");
@@ -247,21 +316,51 @@ function NavOverview({ navigations, setActionItem }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     NavModal,
     {
-      confirmText: "Create new",
-      closeText: "Cancel",
-      titleText: "Navigation overview",
-      loadingText: "Creating",
+      confirmText: formatMessage({
+        id: index.getTranslation("modal.navOverview.confirmText"),
+        defaultMessage: "New navigation"
+      }),
+      closeText: formatMessage({
+        id: index.getTranslation("modal.navOverview.closeText"),
+        defaultMessage: "Cancel"
+      }),
+      titleText: formatMessage({
+        id: index.getTranslation("modal.navOverview.titleText"),
+        defaultMessage: "Navigation overview"
+      }),
+      loadingText: formatMessage({
+        id: index.getTranslation("modal.navOverview.loadingText"),
+        defaultMessage: "Creating"
+      }),
       modalToOpen: "NavCreate",
-      children: navigations.length > 0 ? navigations.map((nav, index2) => /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Box, { children: [
+      children: navigations.length > 0 ? navigations.map((nav, index$1) => /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Box, { children: [
         /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { justifyContent: "space-between", children: [
           /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { textColor: "neutral800", children: nav.name }),
           /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { gap: 2, children: [
-            /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { startIcon: /* @__PURE__ */ jsxRuntime.jsx(icons.Trash, {}), variant: "danger-light", onClick: () => handleDelete(nav), children: "Delete" }),
-            /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { startIcon: /* @__PURE__ */ jsxRuntime.jsx(icons.Pencil, {}), variant: "secondary", onClick: () => handleEdit(nav), children: "Edit" }),
-            /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { startIcon: /* @__PURE__ */ jsxRuntime.jsx(icons.Check, {}), variant: "primary", onClick: () => handleSelect(nav), disabled: selectedNavigation ? selectedNavigation.slug === nav.slug : false, children: "Select" })
+            /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { startIcon: /* @__PURE__ */ jsxRuntime.jsx(icons.Trash, {}), variant: "danger-light", onClick: () => handleDelete(nav), children: formatMessage({
+              id: index.getTranslation("delete"),
+              defaultMessage: "Delete"
+            }) }),
+            /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { startIcon: /* @__PURE__ */ jsxRuntime.jsx(icons.Pencil, {}), variant: "secondary", onClick: () => handleEdit(nav), children: formatMessage({
+              id: index.getTranslation("edit"),
+              defaultMessage: "Edit"
+            }) }),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              designSystem.Button,
+              {
+                startIcon: /* @__PURE__ */ jsxRuntime.jsx(icons.Check, {}),
+                variant: "primary",
+                onClick: () => handleSelect(nav),
+                disabled: selectedNavigation ? selectedNavigation.slug === nav.slug : false,
+                children: formatMessage({
+                  id: index.getTranslation("select"),
+                  defaultMessage: "Select"
+                })
+              }
+            )
           ] })
         ] }, `box-${nav.slug}`),
-        navigations.length - 1 !== index2 && /* @__PURE__ */ jsxRuntime.jsx(
+        navigations.length - 1 !== index$1 && /* @__PURE__ */ jsxRuntime.jsx(
           designSystem.Box,
           {
             paddingTop: 2,
@@ -269,7 +368,10 @@ function NavOverview({ navigations, setActionItem }) {
             children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Divider, {})
           }
         )
-      ] }, nav.id)) : /* @__PURE__ */ jsxRuntime.jsx(EmptyBox.Center, { height: 100, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { textColor: "neutral800", children: "No navigations available." }) })
+      ] }, nav.id)) : /* @__PURE__ */ jsxRuntime.jsx(EmptyBox.Center, { height: 100, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { textColor: "neutral800", children: formatMessage({
+        id: index.getTranslation("navigation.page.emptyNavigation"),
+        defaultMessage: "You have no navigations yet..."
+      }) }) })
     }
   );
 }
@@ -3525,6 +3627,7 @@ function ExternalItemComponent({
   selectedNavigation,
   parentDocumentId
 }) {
+  const { formatMessage } = reactIntl.useIntl();
   React.useEffect(() => {
     if (variant !== "ExternalEdit" || !item) return;
     dispatchItemState({ type: "SET_TITLE", payload: item.route.title });
@@ -3560,20 +3663,27 @@ function ExternalItemComponent({
   return /* @__PURE__ */ jsxRuntime.jsx(
     NavModal,
     {
-      confirmText: variant === "ExternalCreate" ? "Add" : "Save",
-      closeText: "Cancel",
-      titleText: variant === "ExternalCreate" ? "Create new external item" : `Edit external route "${navItemState.title}"`,
-      loadingText: variant === "ExternalCreate" ? "Adding" : "Saving",
+      confirmText: variant === "ExternalCreate" ? formatMessage({ id: index.getTranslation("add"), defaultMessage: "Add" }) : formatMessage({ id: index.getTranslation("save"), defaultMessage: "Save" }),
+      closeText: formatMessage({ id: index.getTranslation("cancel"), defaultMessage: "Cancel" }),
+      titleText: variant === "ExternalCreate" ? formatMessage({ id: index.getTranslation("modal.externalItem.titleText.create"), defaultMessage: "Create new external item" }) : formatMessage({ id: index.getTranslation("modal.externalItem.titleText.edit"), defaultMessage: `Edit external route "${navItemState.title}"` }),
+      loadingText: variant === "ExternalCreate" ? formatMessage({ id: index.getTranslation("modal.externalItem.loadingText.create"), defaultMessage: "Adding" }) : formatMessage({ id: index.getTranslation("modal.externalItem.loadingText.edit"), defaultMessage: "Saving" }),
       onConfirm: addItem,
       modalToOpen: "",
       currentModalType: "ExternalCreate",
+      currentModalMode: variant === "ExternalCreate" ? "create" : "edit",
       children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Grid.Root, { gap: 8, children: [
         /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 6, s: 12, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { width: "100%", children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Field.Root, { children: [
-          /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: "Title" }),
+          /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: formatMessage({
+            id: index.getTranslation("modal.item.titleField.label"),
+            defaultMessage: "Title"
+          }) }),
           /* @__PURE__ */ jsxRuntime.jsx(
             designSystem.Field.Input,
             {
-              placeholder: "e.g. About us",
+              placeholder: formatMessage({
+                id: index.getTranslation("modal.item.titleField.placeholder"),
+                defaultMessage: "e.g. About us"
+              }),
               name: "title",
               value: navItemState.title || "",
               onChange: (e) => dispatchItemState({ type: "SET_TITLE", payload: e.target.value }),
@@ -3582,13 +3692,18 @@ function ExternalItemComponent({
           )
         ] }) }) }),
         /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 6, s: 12, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { width: "100%", children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Field.Root, { children: [
-          /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: "Path" }),
+          /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: formatMessage({
+            id: index.getTranslation("modal.item.routeField.label"),
+            defaultMessage: "Path"
+          }) }),
           /* @__PURE__ */ jsxRuntime.jsx(
             designSystem.Field.Input,
             {
               required: true,
-              placeholder: "https://example.com",
-              label: "Path",
+              placeholder: formatMessage({
+                id: index.getTranslation("modal.externalItem.routeField.placeholder"),
+                defaultMessage: "e.g. https://example.com"
+              }),
               name: "slug",
               value: path?.value || "",
               onChange: (e) => dispatchPath({ type: "NO_TRANSFORM_AND_CHECK", payload: e.target.value })
@@ -3626,6 +3741,7 @@ function ItemCreateComponent({
   parentId
 }) {
   const [loading, setLoading] = React.useState(false);
+  const { formatMessage } = reactIntl.useIntl();
   React.useEffect(() => {
     if (!entities) return;
     setAvailableEntities(entities);
@@ -3689,10 +3805,10 @@ function ItemCreateComponent({
   return /* @__PURE__ */ jsxRuntime.jsxs(
     NavModal,
     {
-      confirmText: "Add",
-      closeText: "Cancel",
-      titleText: "Add new navigation item",
-      loadingText: "Creating",
+      confirmText: formatMessage({ id: index.getTranslation("add"), defaultMessage: "Add" }),
+      closeText: formatMessage({ id: index.getTranslation("cancel"), defaultMessage: "Cancel" }),
+      titleText: formatMessage({ id: index.getTranslation("modal.internalItem.titleText.create"), defaultMessage: "Add new navigation item" }),
+      loadingText: formatMessage({ id: index.getTranslation("modal.internalItem.loadingText.create"), defaultMessage: "Creating" }),
       onConfirm: addItem,
       loading,
       modalToOpen: "",
@@ -3700,12 +3816,18 @@ function ItemCreateComponent({
       children: [
         /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Grid.Root, { gap: 4, children: [
           /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 6, s: 12, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { width: "100%", children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Field.Root, { children: [
-            /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: "Content Type" }),
+            /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: formatMessage({
+              id: index.getTranslation("modal.internalItem.contentType.label"),
+              defaultMessage: "Content Type"
+            }) }),
             /* @__PURE__ */ jsxRuntime.jsx(
               designSystem.SingleSelect,
               {
                 value: selectedContentType ? selectedContentType.label : "",
-                placeholder: "Select a content type",
+                placeholder: formatMessage({
+                  id: index.getTranslation("modal.internalItem.contentType.placeholder"),
+                  defaultMessage: "Select a content type"
+                }),
                 onChange: (value) => {
                   const [contentType] = availableEntities.filter((group) => group.label === value);
                   if (contentType) {
@@ -3719,12 +3841,18 @@ function ItemCreateComponent({
             )
           ] }) }) }),
           /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 6, s: 12, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { width: "100%", children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Field.Root, { children: [
-            /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: "Entity" }),
+            /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: formatMessage({
+              id: index.getTranslation("modal.internalItem.entity.label"),
+              defaultMessage: "Entity"
+            }) }),
             /* @__PURE__ */ jsxRuntime.jsx(
               designSystem.SingleSelect,
               {
                 value: selectedEntity ? selectedEntity.id : "",
-                placeholder: "Select a entity",
+                placeholder: formatMessage({
+                  id: index.getTranslation("modal.internalItem.entity.placeholder"),
+                  defaultMessage: "Select an entity"
+                }),
                 onChange: (value) => {
                   const flatEntities = availableEntities.flatMap((group) => group.entities);
                   const route = flatEntities.find((route2) => route2.id === Number(value));
@@ -3746,11 +3874,17 @@ function ItemCreateComponent({
           /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { paddingBottom: 6, paddingTop: 6, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Divider, {}) }),
           /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Grid.Root, { gap: 4, paddingBottom: 6, children: [
             /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 6, s: 12, alignItems: "baseline", children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { width: "100%", children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Field.Root, { children: [
-              /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: "Title" }),
+              /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: formatMessage({
+                id: index.getTranslation("modal.item.titleField.label"),
+                defaultMessage: "Title"
+              }) }),
               /* @__PURE__ */ jsxRuntime.jsx(
                 designSystem.Field.Input,
                 {
-                  placeholder: "e.g. About us",
+                  placeholder: formatMessage({
+                    id: index.getTranslation("modal.item.titleField.placeholder"),
+                    defaultMessage: "e.g. About us"
+                  }),
                   name: "title",
                   value: navItemState.title || "",
                   onChange: (e) => dispatchItemState({ type: "SET_TITLE", payload: e.target.value }),
@@ -3760,13 +3894,18 @@ function ItemCreateComponent({
             ] }) }) }),
             /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 6, s: 12, children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Box, { width: "100%", children: [
               /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Field.Root, { children: [
-                /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: "Path" }),
+                /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: formatMessage({
+                  id: index.getTranslation("modal.item.routeField.label"),
+                  defaultMessage: "Route"
+                }) }),
                 /* @__PURE__ */ jsxRuntime.jsx(
                   designSystem.Field.Input,
                   {
                     required: true,
-                    placeholder: "about/",
-                    label: "Path",
+                    placeholder: formatMessage({
+                      id: index.getTranslation("modal.item.routeField.placeholder"),
+                      defaultMessage: "e.g. about/"
+                    }),
                     name: "slug",
                     value: path?.value || "",
                     onChange: (e) => dispatchPath({ type: "NO_TRANSFORM_AND_CHECK", payload: e.target.value }),
@@ -9284,6 +9423,7 @@ function ItemEditComponent({
   debouncedCheckUrl,
   setModalType
 }) {
+  const { formatMessage } = reactIntl.useIntl();
   React.useEffect(() => {
     dispatchPath({ type: "NO_TRANSFORM_AND_CHECK", payload: item.route.fullPath });
     dispatchItemState({ type: "SET_TITLE", payload: item.route.title });
@@ -9342,17 +9482,21 @@ function ItemEditComponent({
   return /* @__PURE__ */ jsxRuntime.jsxs(
     NavModal,
     {
-      confirmText: "Save",
-      closeText: "Cancel",
-      titleText: `Edit ${selectedContentType.label} "${item.route.title}"`,
-      loadingText: "Saving",
+      confirmText: formatMessage({ id: index.getTranslation("save"), defaultMessage: "Save" }),
+      closeText: formatMessage({ id: index.getTranslation("cancel"), defaultMessage: "Cancel" }),
+      titleText: `${formatMessage({ id: index.getTranslation("edit"), defaultMessage: "Edit" })} ${selectedContentType.label} "${item.route.title}"`,
+      loadingText: formatMessage({ id: index.getTranslation("modal.internalItem.loadingText.edit"), defaultMessage: "Saving" }),
       onConfirm: updateItem,
       modalToOpen: "",
       currentModalType: "ItemCreate",
+      currentModalMode: "edit",
       children: [
         /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Grid.Root, { gap: 8, children: [
           /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 6, s: 12, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { width: "100%", children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Field.Root, { children: [
-            /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: "Content Type" }),
+            /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: formatMessage({
+              id: index.getTranslation("modal.internalItem.contentType.label"),
+              defaultMessage: "Content Type"
+            }) }),
             /* @__PURE__ */ jsxRuntime.jsx(
               designSystem.Field.Input,
               {
@@ -9362,7 +9506,10 @@ function ItemEditComponent({
             )
           ] }) }) }),
           /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 6, s: 12, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { width: "100%", children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Field.Root, { children: [
-            /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: "Entity" }),
+            /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: formatMessage({
+              id: index.getTranslation("modal.internalItem.entity.label"),
+              defaultMessage: "Entity"
+            }) }),
             /* @__PURE__ */ jsxRuntime.jsx(
               designSystem.Field.Input,
               {
@@ -9375,11 +9522,18 @@ function ItemEditComponent({
         /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { paddingBottom: 6, paddingTop: 6, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Divider, {}) }),
         /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Grid.Root, { gap: 8, paddingBottom: 6, children: [
           /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 6, s: 12, alignItems: "baseline", children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { width: "100%", children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Field.Root, { children: [
-            /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: "Title" }),
+            /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: formatMessage({
+              id: index.getTranslation("modal.item.titleField.label"),
+              defaultMessage: "Title"
+            }) }),
             /* @__PURE__ */ jsxRuntime.jsx(
               designSystem.Field.Input,
               {
-                placeholder: "e.g. About us",
+                placeholder: formatMessage({
+                  id: index.getTranslation("modal.item.titleField.placeholder"),
+                  defaultMessage: "e.g. About us"
+                }),
+                name: "title",
                 value: navItemState.title || "",
                 onChange: (e) => dispatchItemState({ type: "SET_TITLE", payload: e.target.value }),
                 required: true
@@ -9388,11 +9542,17 @@ function ItemEditComponent({
           ] }) }) }),
           /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 6, s: 12, children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Box, { width: "100%", children: [
             /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Field.Root, { children: [
-              /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: "Path" }),
+              /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: formatMessage({
+                id: index.getTranslation("modal.item.routeField.label"),
+                defaultMessage: "Route"
+              }) }),
               /* @__PURE__ */ jsxRuntime.jsx(
                 designSystem.Field.Input,
                 {
-                  placeholder: "about/",
+                  placeholder: formatMessage({
+                    id: index.getTranslation("modal.item.routeField.placeholder"),
+                    defaultMessage: "e.g. about/"
+                  }),
                   value: path.value || "",
                   onChange: (e) => handlePathChange(e.target.value),
                   onBlur: (e) => {
@@ -9424,6 +9584,7 @@ function WrapperItemComponent({
   selectedNavigation,
   parentDocumentId
 }) {
+  const { formatMessage } = reactIntl.useIntl();
   React.useEffect(() => {
     if (variant !== "WrapperEdit" || !item) return;
     dispatchItemState({ type: "SET_TITLE", payload: item.route.title });
@@ -9459,19 +9620,26 @@ function WrapperItemComponent({
   return /* @__PURE__ */ jsxRuntime.jsx(
     NavModal,
     {
-      confirmText: variant === "WrapperCreate" ? "Add" : "Save",
-      closeText: "Cancel",
-      titleText: variant === "WrapperCreate" ? "Create new wrapper item" : `Edit wrapper item "${navItemState.title}"`,
-      loadingText: variant === "WrapperCreate" ? "Adding" : "Saving",
+      confirmText: variant === "WrapperCreate" ? formatMessage({ id: index.getTranslation("add"), defaultMessage: "Add" }) : formatMessage({ id: index.getTranslation("save"), defaultMessage: "Save" }),
+      closeText: formatMessage({ id: index.getTranslation("cancel"), defaultMessage: "Cancel" }),
+      titleText: variant === "WrapperCreate" ? formatMessage({ id: index.getTranslation("modal.wrapperItem.titleText.create"), defaultMessage: "Create new wrapper item" }) : formatMessage({ id: index.getTranslation("modal.wrapperItem.titleText.edit"), defaultMessage: "Edit wrapper item:" }) + ` "${navItemState.title}"`,
+      loadingText: variant === "WrapperCreate" ? formatMessage({ id: index.getTranslation("modal.wrapperItem.loadingText.create"), defaultMessage: "Adding" }) : formatMessage({ id: index.getTranslation("modal.wrapperItem.loadingText.edit"), defaultMessage: "Saving" }),
       onConfirm: addItem,
       modalToOpen: "",
       currentModalType: "WrapperCreate",
+      currentModalMode: variant === "WrapperCreate" ? "create" : "edit",
       children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Root, { gap: 8, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 6, s: 12, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { width: "100%", children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Field.Root, { children: [
-        /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: "Title" }),
+        /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: formatMessage({
+          id: index.getTranslation("modal.wrapperItem.titleField.label"),
+          defaultMessage: "Title"
+        }) }),
         /* @__PURE__ */ jsxRuntime.jsx(
           designSystem.Field.Input,
           {
-            placeholder: "e.g. About us",
+            placeholder: formatMessage({
+              id: index.getTranslation("modal.wrapperItem.titleField.placeholder"),
+              defaultMessage: "e.g. About us"
+            }),
             name: "title",
             value: navItemState.title || "",
             onChange: (e) => dispatchItemState({ type: "SET_TITLE", payload: e.target.value }),
@@ -9486,13 +9654,20 @@ const WrapperItem = withModalSharedLogic(WrapperItemComponent);
 function Header({ navigations }) {
   const { setModalType } = React.useContext(ModalContext);
   const { selectedNavigation, setSelectedNavigation } = React.useContext(SelectedNavigationContext);
+  const { formatMessage } = reactIntl.useIntl();
   return /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { gap: 4, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { variant: "secondary", onClick: () => setModalType("NavOverview"), children: "Manage" }),
+    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { variant: "secondary", onClick: () => setModalType("NavOverview"), children: formatMessage({
+      id: index.getTranslation("manage"),
+      defaultMessage: "Manage"
+    }) }),
     /* @__PURE__ */ jsxRuntime.jsx(
       designSystem.SingleSelect,
       {
         value: selectedNavigation ? selectedNavigation.slug : "",
-        placeholder: "Select Navigation",
+        placeholder: formatMessage({
+          id: index.getTranslation("navigation.page.selectNavigation"),
+          defaultMessage: "Select Navigation"
+        }),
         onChange: (value) => {
           const navItem = navigations.find((nav) => nav.slug === value);
           if (navItem) {
@@ -9562,6 +9737,7 @@ const RouteItem = React.forwardRef(({ item, setParentId, setActionItem, ghost, d
   if (!item || !item.route) return null;
   const { setModalType } = React.useContext(ModalContext);
   const { get } = admin.useFetchClient();
+  const { formatMessage } = reactIntl.useIntl();
   const [itemStatus, setItemStatus] = React.useState({
     status: "published",
     variant: "primary",
@@ -9674,9 +9850,18 @@ const RouteItem = React.forwardRef(({ item, setParentId, setActionItem, ghost, d
             /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { direction: "row", gap: 4, children: [
               type === "internal" && /* @__PURE__ */ jsxRuntime.jsx(designSystem.Status, { variant: itemStatus.variant, size: "S", children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { fontWeight: "bold", textColor: itemStatus.textColor, children: itemStatus.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: "Edit" }),
-                /* @__PURE__ */ jsxRuntime.jsx(designSystem.MenuItem, { onClick: () => handleAddChildren(), children: "Add children" }),
-                /* @__PURE__ */ jsxRuntime.jsx(designSystem.MenuItem, { onClick: () => handleDelete(), children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { textColor: "danger600", children: "Delete" }) })
+                /* @__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"
+                }) }) })
               ] })
             ] })
           ] })
@@ -9731,6 +9916,7 @@ const Navigation = () => {
   const [activeId, setActiveId] = React.useState(null);
   const [overId, setOverId] = React.useState(null);
   const [offsetLeft, setOffsetLeft] = React.useState(0);
+  const { formatMessage } = reactIntl.useIntl();
   if (!navigations) return null;
   React.useEffect(() => {
     if (modalType === "NavOverview" || modalType === "") {
@@ -9843,21 +10029,33 @@ const Navigation = () => {
       /* @__PURE__ */ jsxRuntime.jsx(
         admin.Layouts.Header,
         {
-          title: "Navigation",
-          subtitle: "Manage your navigation settings here",
+          title: formatMessage({
+            id: index.getTranslation("navigation.page.title"),
+            defaultMessage: "Navigation"
+          }) + (selectedNavigation ? `: ${selectedNavigation.name}` : ""),
+          subtitle: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { textColor: "neutral500", children: selectedNavigation ? `ID: ${selectedNavigation.id} | DocumentID : ${selectedNavigation.documentId}` : formatMessage({
+            id: index.getTranslation("navigation.page.subtitle.noNavigationSelected"),
+            defaultMessage: "No navigation selected"
+          }) }),
           primaryAction: /* @__PURE__ */ jsxRuntime.jsx(Header, { navigations })
         }
       ),
       /* @__PURE__ */ jsxRuntime.jsxs(admin.Layouts.Content, { children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { gap: 4, paddingBottom: 6, justifyContent: "flex-end", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { variant: "secondary", startIcon: /* @__PURE__ */ jsxRuntime.jsx(icons.Plus, {}), onClick: () => setModalType("ItemCreate"), children: "New Item" }),
+        selectedNavigation && /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { gap: 4, paddingBottom: 6, justifyContent: "flex-end", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { variant: "secondary", startIcon: /* @__PURE__ */ jsxRuntime.jsx(icons.Plus, {}), onClick: () => setModalType("ItemCreate"), children: formatMessage({
+            id: index.getTranslation("navigation.page.newItemButton"),
+            defaultMessage: "New Item"
+          }) }),
           /* @__PURE__ */ jsxRuntime.jsx(
             designSystem.Button,
             {
               startIcon: /* @__PURE__ */ jsxRuntime.jsx(icons.Check, {}),
               onClick: () => saveOrder(),
               disabled: JSON.stringify(navigationItems) === JSON.stringify(initialNavigationItems),
-              children: "Save"
+              children: formatMessage({
+                id: index.getTranslation("save"),
+                defaultMessage: "Save"
+              })
             }
           )
         ] }),
@@ -9898,12 +10096,21 @@ const Navigation = () => {
           }
         ) }),
         navigations?.length === 0 && /* @__PURE__ */ jsxRuntime.jsxs(EmptyBox.Center, { height: 400, children: [
-          /* @__PURE__ */ jsxRuntime.jsx(EmptyBox.EmptyBox, { msg: "You have no navigations yet..." }),
-          /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { variant: "primary", onClick: () => setModalType("NavCreate"), children: "Create new Navigation" })
+          /* @__PURE__ */ jsxRuntime.jsx(EmptyBox.EmptyBox, { msg: formatMessage({
+            id: index.getTranslation("navigation.page.emptyNavigation"),
+            defaultMessage: "You have no navigations yet..."
+          }) }),
+          /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { variant: "primary", onClick: () => setModalType("NavCreate"), children: formatMessage({
+            id: index.getTranslation("navigation.page.createNewNavigation"),
+            defaultMessage: "Create new navigation"
+          }) })
         ] }),
         navigationItems?.length === 0 && /* @__PURE__ */ jsxRuntime.jsxs(EmptyBox.Center, { height: 400, children: [
           /* @__PURE__ */ jsxRuntime.jsx(EmptyBox.EmptyBox, { msg: "Your navigation is empty..." }),
-          /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { variant: "primary", onClick: () => setModalType("ItemCreate"), children: "Create new item" })
+          /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { variant: "primary", onClick: () => setModalType("ItemCreate"), children: formatMessage({
+            id: index.getTranslation("navigation.page.createNewItem"),
+            defaultMessage: "Create new item"
+          }) })
         ] })
       ] })
     ] }),