@littlebox/strapi-suite 1.0.33 → 1.0.35

package/README.md

@@ -200,6 +200,53 @@ GET /api/littlebox-strapi-suite/modules/pages?slug=<SLUG>
 ```
 **Note**: The default language won't show up in the URL slug if the `SHOW LANGUAGE SLUG` setting is turned off in the slug module settings (see screenshot above).
 
+Using the slug module settings (as shown in the screenshot above), you can choose which content will be set as the homepage. Then, just call the API to get the data:
+```
+GET /api/littlebox-strapi-suite/modules/pages/home?properties=attributes
+```
+The return will be the content in the default language and the respective localizations:
+```
+{
+    "document": {
+        "id": 53,
+        "documentId": "un6hqh6smm657hwf0n06xm72",
+        "title": "Home PT",
+        "slug": "",
+        "createdAt": "2025-04-14T19:38:34.673Z",
+        "updatedAt": "2025-04-14T22:19:21.242Z",
+        "publishedAt": "2025-04-14T22:19:21.270Z",
+        "locale": "pt",
+        "localizations": [
+            {
+                "id": 59,
+                "documentId": "un6hqh6smm657hwf0n06xm72",
+                "title": "Home EN",
+                "slug": "en",
+                "createdAt": "2025-04-14T22:19:29.371Z",
+                "updatedAt": "2025-04-14T23:45:50.177Z",
+                "publishedAt": "2025-04-14T23:45:50.210Z",
+                "locale": "en"
+            },
+            {
+                "id": 61,
+                "documentId": "un6hqh6smm657hwf0n06xm72",
+                "title": "Home EU",
+                "slug": "en-eu",
+                "createdAt": "2025-04-15T10:49:50.490Z",
+                "updatedAt": "2025-04-15T10:49:51.244Z",
+                "publishedAt": "2025-04-15T10:49:51.263Z",
+                "locale": "en-EU"
+            }
+        ]
+    },
+    "attributes": {
+        "template": "default",
+        "priority": "0.5",
+        "frequency": "weekly"
+    }
+}
+```
+
 &nbsp;
 &nbsp;
 &nbsp;
@@ -266,56 +313,130 @@ GET /api/littlebox-strapi-suite/modules/pages?properties=attributes
 ```
 [
     {
-        "id": "wnzxub0s3ghckznjdkshgcw7",
-        "model": "api::page.page",
-        "slug": "news",
-        "locale": "en",
-        "attributes": {
-            "template": "default",
-            "priority": "1.0",
-            "frequency": "weekly"
-        }
-    },
-    {
-        "id": "wnzxub0s3ghckznjdkshgcw7",
-        "model": "api::page.page",
-        "slug": "noticias",
+        "id": 69,
+        "documentId": "un6hqh6smm657hwf0n06xm72",
+        "slug": "",
         "locale": "pt",
+        "updatedAt": "2025-04-14T22:19:21.283Z",
         "attributes": {
             "template": "default",
-            "priority": "1.0",
+            "priority": "0.5",
             "frequency": "weekly"
-        }
+        },
+        "localizations": [
+            {
+                "id": 74,
+                "documentId": "un6hqh6smm657hwf0n06xm72",
+                "slug": "en",
+                "locale": "en",
+                "updatedAt": "2025-04-14T23:45:50.237Z",
+                "attributes": {
+                    "template": "default",
+                    "priority": "0.5",
+                    "frequency": "weekly"
+                }
+            },
+            {
+                "id": 76,
+                "documentId": "un6hqh6smm657hwf0n06xm72",
+                "slug": "en-eu",
+                "locale": "en-EU",
+                "updatedAt": "2025-04-15T10:49:51.275Z",
+                "attributes": {
+                    "template": "default",
+                    "priority": "0.5",
+                    "frequency": "weekly"
+                }
+            }
+        ]
     },
     {
-        "id": "i111r5p3pa73r6tm71b7lh86",
-        "model": "api::page.page",
-        "slug": "news/littlebox-suite-helped-me-build-websites-faster",
-        "locale": "en",
+        "id": 59,
+        "documentId": "wgobkq9xr8bxtdwz4bcjx69y",
+        "slug": "noticias/littlebox-suite-ajudou-me-a-construir-sites-mais-rapido",
+        "locale": "pt",
+        "updatedAt": "2025-04-13T23:58:16.975Z",
         "attributes": {
             "template": "default",
-            "priority": "1.0",
-            "frequency": "yearly",
+            "priority": "0.5",
+            "frequency": "weekly",
             "parent": {
-                "id": "wnzxub0s3ghckznjdkshgcw7",
+                "id": "p49dnxpwf5lcvd56dym1895d",
                 "model": "api::page.page"
             }
-        }
+        },
+        "localizations": [
+            {
+                "id": 54,
+                "documentId": "wgobkq9xr8bxtdwz4bcjx69y",
+                "slug": "en/news/littlebox-suite-helped-me-build-websites-faster",
+                "locale": "en",
+                "updatedAt": "2025-04-13T23:11:36.047Z",
+                "attributes": {
+                    "template": "default",
+                    "priority": "0.5",
+                    "frequency": "weekly",
+                    "parent": {
+                        "id": "p49dnxpwf5lcvd56dym1895d",
+                        "model": "api::page.page"
+                    }
+                }
+            },
+            {
+                "id": 65,
+                "documentId": "wgobkq9xr8bxtdwz4bcjx69y",
+                "slug": "en-eu/news/littlebox-suite-helped-me-build-websites-faster",
+                "locale": "en-EU",
+                "updatedAt": "2025-04-14T01:15:31.193Z",
+                "attributes": {
+                    "template": "default",
+                    "priority": "0.9",
+                    "frequency": "weekly",
+                    "parent": {
+                        "id": "p49dnxpwf5lcvd56dym1895d",
+                        "model": "api::page.page"
+                    }
+                }
+            }
+        ]
     },
     {
-        "id": "i111r5p3pa73r6tm71b7lh86",
-        "model": "api::page.page",
-        "slug": "pt/noticias/littlebox-suite-ajudou-me-a-construir-sites-mais-rapido",
+        "id": 68,
+        "documentId": "p49dnxpwf5lcvd56dym1895d",
+        "slug": "noticias",
         "locale": "pt",
+        "updatedAt": "2025-04-14T20:10:06.388Z",
         "attributes": {
             "template": "default",
-            "priority": "1.0",
-            "frequency": "yearly",
-            "parent": {
-                "id": "wnzxub0s3ghckznjdkshgcw7",
-                "model": "api::page.page"
+            "priority": "0.5",
+            "frequency": "weekly"
+        },
+        "localizations": [
+            {
+                "id": 52,
+                "documentId": "p49dnxpwf5lcvd56dym1895d",
+                "slug": "en/news",
+                "locale": "en",
+                "updatedAt": "2025-04-13T23:11:21.477Z",
+                "attributes": {
+                    "template": "default",
+                    "priority": "0.5",
+                    "frequency": "weekly"
+                }
+            },
+            {
+                "id": 63,
+                "documentId": "p49dnxpwf5lcvd56dym1895d",
+                "slug": "en-eu/news",
+                "locale": "en-EU",
+                "updatedAt": "2025-04-14T01:15:01.792Z",
+                "attributes": {
+                    "template": "default",
+                    "priority": "0.9",
+                    "frequency": "daily"
+                }
             }
-        }
+        ]
     }
 ]
 ```

package/dist/_chunks/{App-CXitaGLI.mjs → App-2SwRpCFC.mjs}

@@ -1,13 +1,13 @@
 import { jsxs, jsx, Fragment } from "react/jsx-runtime";
 import { useNavigate, useParams, Routes, Route } from "react-router-dom";
 import React__default, { useState, useEffect, createContext, useContext, Fragment as Fragment$1, useRef } from "react";
-import { Box, Loader, Main, Typography, Button, Flex, Breadcrumbs, Crumb, CrumbLink, CardBody, CardContent, CardTitle, CardBadge, CardSubtitle, Card as Card$1, Dialog, IconButton, Toggle, SearchForm, Searchbar, SingleSelect, SingleSelectOption, Table, Thead, Tr, Th, Checkbox, VisuallyHidden, Tbody, Td, EmptyStateLayout, TextInput, Field, Tooltip } from "@strapi/design-system";
-import { R as Registry, F as FetchSettings, g as getTranslation, c as config, a as FetchSlugs, f as fetchTemplates } from "./index-BBTYu57z.mjs";
+import { Box, Loader, Main, Typography, Button, Flex, Breadcrumbs, Crumb, CrumbLink, CardBody, CardContent, CardTitle, CardBadge, CardSubtitle, Card as Card$1, Dialog, IconButton, Toggle, SingleSelect, SingleSelectOption, SearchForm, Searchbar, Table, Thead, Tr, Th, Checkbox, VisuallyHidden, Tbody, Td, EmptyStateLayout, TextInput, Field, Tooltip } from "@strapi/design-system";
+import { R as Registry, F as FetchSettings, g as getTranslation, c as config, S as SLUG_LANGUAGE_STRATEGY, a as SLUG_CONTENT_STRATEGY, b as FetchSlugs, f as fetchTemplates } from "./index-DmkEUACh.mjs";
 import { ArrowLeft, ExternalLink, WarningCircle, Cross, BulletList, Pencil, Trash, Plus, Duplicate, Drag, Check } from "@strapi/icons";
 import { useIntl } from "react-intl";
 import styled, { useTheme } from "styled-components";
 import { EmptyDocuments } from "@strapi/icons/symbols";
-import { F as FetchLocales, c as convertToSlug } from "./convertToSlug-CRnBMJHB.mjs";
+import { F as FetchLocales, c as convertToSlug } from "./convertToSlug-q9_W-VMA.mjs";
 import { DndContext, DragOverlay, pointerWithin, rectIntersection } from "@dnd-kit/core";
 import { useSortable, SortableContext, verticalListSortingStrategy, arrayMove } from "@dnd-kit/sortable";
 import { restrictToVerticalAxis, restrictToParentElement } from "@dnd-kit/modifiers";
@@ -925,27 +925,60 @@ const ConfirmModal = ({ open, title, text, confirm, cancel }) => {
     ] }) }) })
   ] }) }) });
 };
-const SlugSettingsModal = ({ open, close }) => {
+const BoxInput$7 = styled(Box)`
+  & > div {
+    width: 100%;
+  }
+`;
+const SlugSettingsModal = ({ open, close, defaultLocale }) => {
   const [module, setModule] = useState(config.uuid.modules.slug);
   const [hidden, setHidden] = useState(true);
-  const [checked, setChecked] = useState(true);
+  const [showDefaultLanguage, setShowDefaultLanguage] = useState(true);
+  const [selectedContent, setSelectedContent] = useState();
+  const [selectedStrategy, setSelectedStrategy] = useState(SLUG_LANGUAGE_STRATEGY);
+  const [pages, setPages] = useState([]);
+  const [saveInProgress, setSaveInProgress] = useState(false);
   const { formatMessage } = useIntl();
   const settings = useSettings();
-  async function handleChange(event) {
-    setChecked(event.target.checked);
-    const updateSetting = new UpdateSetting();
-    await updateSetting.execute({
-      property: "showDefaultLanguage",
-      module,
-      value: event.target.checked
-    });
+  function updateSetting(property, value) {
+    const updateSetting2 = new UpdateSetting();
+    updateSetting2.execute({ property, module, value });
+  }
+  function handleChangeSelectedContent(value) {
+    const page = pages.find((page2) => page2.id == value);
+    setSelectedContent(page);
+  }
+  function save() {
+    updateSetting("showDefaultLanguage", showDefaultLanguage);
+    updateSetting("homepageContentId", selectedContent?.contentId);
+    updateSetting("homepageContentModel", selectedContent?.contentModel);
+    updateSetting("homepageSlugStrategy", selectedStrategy);
+    close();
+  }
+  async function fetchSlugs() {
+    const fetchSlugs2 = new FetchSlugs();
+    const outputFetchSlugs = await fetchSlugs2.execute({ locale: defaultLocale.code });
+    setPages(outputFetchSlugs);
   }
+  useEffect(() => {
+    if (defaultLocale) {
+      fetchSlugs();
+    }
+  }, [defaultLocale]);
   useEffect(() => {
     setHidden(!open);
   }, [open]);
   useEffect(() => {
-    setChecked(settings.provide("slug").showDefaultLanguage);
-  });
+    const currentShowDefaultLanguage = settings.provide("slug").showDefaultLanguage;
+    const currentHomepageSlugStrategy = settings.provide("slug").homepageSlugStrategy;
+    setShowDefaultLanguage(currentShowDefaultLanguage);
+    setSelectedStrategy(currentHomepageSlugStrategy);
+  }, []);
+  useEffect(() => {
+    const currentHomePage = settings.provide("slug").homepageContentId;
+    const page = pages.find((page2) => page2.contentId == currentHomePage);
+    setSelectedContent(page);
+  }, [pages]);
   return /* @__PURE__ */ jsx(Fragment, { children: !hidden && /* @__PURE__ */ jsx(Dialog.Root, { defaultOpen: true, children: /* @__PURE__ */ jsxs(Dialog.Content, { children: [
     /* @__PURE__ */ jsx(Dialog.Header, { style: { textAlign: "left" }, children: /* @__PURE__ */ jsxs(Flex, { style: { width: "100%", justifyContent: "space-between" }, children: [
       /* @__PURE__ */ jsx(Typography, { variant: "omega", children: formatMessage({
@@ -955,20 +988,140 @@ const SlugSettingsModal = ({ open, close }) => {
       /* @__PURE__ */ jsx(IconButton, { variant: "tertiary", onClick: close, label: "Close", borderWidth: 0, children: /* @__PURE__ */ jsx(Cross, {}) })
     ] }) }),
     /* @__PURE__ */ jsx(Dialog.Body, { children: /* @__PURE__ */ jsxs(Box, { style: { display: "flex", flexDirection: "column", width: "100%" }, children: [
-      /* @__PURE__ */ jsx("span", { style: { paddingBottom: "5px" }, children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", children: formatMessage({
+      /* @__PURE__ */ jsx(Typography, { variant: "sigma", style: { paddingBottom: "5px" }, children: formatMessage({
         id: getTranslation(
           `module.${module}.modal.settings.input.default-language.title`
         ),
         defaultMessage: "Show language slug"
-      }) }) }),
-      /* @__PURE__ */ jsx("span", { style: { paddingBottom: "15px", color: "#a5a5ba", display: "flex" }, children: /* @__PURE__ */ jsx(Typography, { variant: "pi", children: formatMessage({
+      }) }),
+      /* @__PURE__ */ jsx(
+        Typography,
+        {
+          variant: "pi",
+          style: { paddingBottom: "5px", color: "#a5a5ba", display: "flex" },
+          children: formatMessage({
+            id: getTranslation(
+              `module.${module}.modal.settings.input.default-language.description`
+            ),
+            defaultMessage: "Show language slug for default language in site url"
+          })
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Toggle,
+        {
+          onLabel: "True",
+          offLabel: "False",
+          checked: showDefaultLanguage,
+          onChange: (e) => setShowDefaultLanguage(e.target.checked)
+        }
+      ),
+      /* @__PURE__ */ jsx(Typography, { variant: "sigma", style: { paddingBottom: "5px", paddingTop: "24px" }, children: formatMessage({
+        id: getTranslation(`module.${module}.modal.settings.input.homepage.title`),
+        defaultMessage: "Home page"
+      }) }),
+      /* @__PURE__ */ jsx(
+        Typography,
+        {
+          variant: "pi",
+          style: { paddingBottom: "5px", color: "#a5a5ba", display: "flex" },
+          children: formatMessage({
+            id: getTranslation(
+              `module.${module}.modal.settings.input.homepage.description`
+            ),
+            defaultMessage: "The content that will be rendered as the homepage"
+          })
+        }
+      ),
+      /* @__PURE__ */ jsx(BoxInput$7, { style: { flex: 1, display: "flex", width: "100%" }, children: /* @__PURE__ */ jsx(
+        SingleSelect,
+        {
+          onChange: (value) => handleChangeSelectedContent(value),
+          value: selectedContent?.id,
+          children: pages.map((page, index) => /* @__PURE__ */ jsx(SingleSelectOption, { value: page.id, children: page.contentTitle }, index))
+        }
+      ) }),
+      /* @__PURE__ */ jsx(Typography, { variant: "sigma", style: { paddingBottom: "5px", paddingTop: "24px" }, children: formatMessage({
         id: getTranslation(
-          `module.${module}.modal.settings.input.default-language.description`
+          `module.${module}.modal.settings.input.homepage-strategy.title`
         ),
-        defaultMessage: "Show language slug for default language in site url"
-      }) }) }),
-      /* @__PURE__ */ jsx(Toggle, { onLabel: "True", offLabel: "False", checked, onChange: handleChange })
-    ] }) })
+        defaultMessage: "Home page slug strategy"
+      }) }),
+      /* @__PURE__ */ jsx(BoxInput$7, { style: { flex: 1, display: "flex", width: "100%" }, children: /* @__PURE__ */ jsxs(
+        SingleSelect,
+        {
+          onChange: (value) => setSelectedStrategy(value),
+          value: selectedStrategy,
+          children: [
+            /* @__PURE__ */ jsx(SingleSelectOption, { value: SLUG_LANGUAGE_STRATEGY, children: "Language" }),
+            /* @__PURE__ */ jsx(SingleSelectOption, { value: SLUG_CONTENT_STRATEGY, children: "Content" })
+          ]
+        }
+      ) }),
+      /* @__PURE__ */ jsxs(
+        Card$1,
+        {
+          shadow: false,
+          style: {
+            marginTop: "10px",
+            padding: "10px",
+            display: "flex",
+            alignItems: "center"
+          },
+          children: [
+            /* @__PURE__ */ jsx(
+              "svg",
+              {
+                xmlns: "http://www.w3.org/2000/svg",
+                width: "24",
+                fill: "none",
+                viewBox: "0 0 24 24",
+                children: /* @__PURE__ */ jsx(
+                  "path",
+                  {
+                    fill: "#7b79ff",
+                    d: "M12 0C5.383 0 0 5.383 0 12s5.383 12 12 12 12-5.383 12-12S18.617 0 12 0Zm1.154 18.456h-2.308V16.15h2.308v2.307Zm-.23-3.687h-1.847l-.346-9.23h2.538l-.346 9.23Z"
+                  }
+                )
+              }
+            ),
+            selectedStrategy === SLUG_LANGUAGE_STRATEGY && /* @__PURE__ */ jsx(
+              Typography,
+              {
+                variant: "pi",
+                style: { color: "#a5a5ba", display: "flex", marginLeft: "10px" },
+                children: formatMessage({
+                  id: getTranslation(
+                    `module.${module}.modal.settings.input.homepage-strategy.description.language`
+                  ),
+                  defaultMessage: "Use the language slug and ignore the content slug set as the homepage"
+                })
+              }
+            ),
+            selectedStrategy === SLUG_CONTENT_STRATEGY && /* @__PURE__ */ jsx(
+              Typography,
+              {
+                variant: "pi",
+                style: { color: "#a5a5ba", display: "flex", marginLeft: "10px" },
+                children: formatMessage({
+                  id: getTranslation(
+                    `module.${module}.modal.settings.input.homepage-strategy.description.content`
+                  ),
+                  defaultMessage: "Use the slug of the content set as the homepage"
+                })
+              }
+            )
+          ]
+        }
+      )
+    ] }) }),
+    /* @__PURE__ */ jsxs(Dialog.Footer, { style: { justifyContent: "end" }, children: [
+      saveInProgress && /* @__PURE__ */ jsx(Loader, { small: true }),
+      /* @__PURE__ */ jsx(Button, { style: { marginRight: "5px" }, onClick: save, disabled: saveInProgress, children: formatMessage({
+        id: getTranslation(`module.${module}.modal.settings.button.save`),
+        defaultMessage: "Save"
+      }) })
+    ] })
   ] }) }) });
 };
 const SlugSettingsPage = () => {
@@ -977,11 +1130,13 @@ const SlugSettingsPage = () => {
   const [filteredRecords, setFilteredRecords] = useState([]);
   const [i18nLocales, setI18nLocales] = useState([]);
   const [currentI18nLocale, setCurrentI18nLocale] = useState();
+  const [defaultLocale, setDefaultLocale] = useState();
   const [fetchInProgress, setFetchInProgress] = useState(true);
   const [showConfirmModal, setShowConfirmModal] = useState(false);
   const [showSettingsModal, setShowSettingsModal] = useState(false);
   const [selectedRecords, setSelectedRecords] = useState([]);
   const [searchTerm, setSearchTerm] = useState("");
+  const [currentHomePage, setCurrentHomePage] = useState();
   const { formatMessage } = useIntl();
   const settings = useSettings();
   async function toggleState(value) {
@@ -1002,7 +1157,9 @@ const SlugSettingsPage = () => {
   async function fetchLocales() {
     const fetchLocales2 = new FetchLocales();
     const fetchLocalesOutput = await fetchLocales2.execute();
+    const defaultLocale2 = fetchLocalesOutput.find((locale) => locale.isDefault);
     setI18nLocales(fetchLocalesOutput);
+    setDefaultLocale(defaultLocale2);
   }
   async function fetchRecords() {
     setFetchInProgress(true);
@@ -1046,6 +1203,10 @@ const SlugSettingsPage = () => {
     const parent = records.find((record) => record.contentId === parentId);
     return parent?.contentTitle;
   }
+  function getCurrentHomePage() {
+    const currentHomePage2 = settings.provide("slug").homepageContentId;
+    setCurrentHomePage(currentHomePage2);
+  }
   useEffect(() => {
     const timer = setTimeout(() => {
       if (records.length > 0) {
@@ -1066,6 +1227,9 @@ const SlugSettingsPage = () => {
       fetchRecords();
     }
   }, [currentI18nLocale]);
+  useEffect(() => {
+    getCurrentHomePage();
+  }, [settings]);
   useEffect(() => {
     fetchLocales();
   }, []);
@@ -1185,7 +1349,25 @@ const SlugSettingsPage = () => {
               /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Typography, { textColor: "neutral800", children: entry.id }) }),
               /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Typography, { textColor: "neutral800", children: entry.locale }) }),
               /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Typography, { textColor: "neutral800", children: entry.slug }) }),
-              /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Typography, { textColor: "neutral800", children: entry.contentTitle }) }),
+              /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsxs(Box, { style: { display: "flex", alignItems: "center" }, children: [
+                entry.contentId === currentHomePage && /* @__PURE__ */ jsx(
+                  Box,
+                  {
+                    style: {
+                      display: "flex",
+                      alignItems: "center",
+                      justifyContent: "center",
+                      backgroundColor: "#7b79ff",
+                      color: "#fff",
+                      borderRadius: "4px",
+                      padding: "3px 8px",
+                      marginRight: "10px"
+                    },
+                    children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", children: "Homepage" })
+                  }
+                ),
+                /* @__PURE__ */ jsx(Typography, { textColor: "neutral800", children: entry.contentTitle })
+              ] }) }),
               /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsxs(Typography, { textColor: "neutral800", children: [
                 !entry.parentContentId && /* @__PURE__ */ jsx(Fragment, { children: "--" }),
                 entry.parentContentId && /* @__PURE__ */ jsx(
@@ -1283,7 +1465,14 @@ const SlugSettingsPage = () => {
             }
           }
         ),
-        /* @__PURE__ */ jsx(SlugSettingsModal, { open: showSettingsModal, close: () => setShowSettingsModal(false) })
+        /* @__PURE__ */ jsx(
+          SlugSettingsModal,
+          {
+            defaultLocale,
+            open: showSettingsModal,
+            close: () => setShowSettingsModal(false)
+          }
+        )
       ]
     }
   );
@@ -2682,8 +2871,6 @@ function MenuEditItem(props) {
     setContents(outputFetchSlugs);
   }
   function dispatchOnChangeEvent(form2) {
-    console.log("dispatchOnChangeEvent:");
-    console.log(form2);
     if (!form2 || form2 && isEmpty(form2.title) || form2 && isEmpty(form2.target) || form2 && isEmpty(form2.url) && isEmpty(form2.contentId)) {
       props.onCheckEvent(false);
     } else {