@creopse/react 0.0.8 → 0.0.9

package/dist/hooks/index.cjs

@@ -0,0 +1,438 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const index = require("../index-CJtxQKA-.cjs");
+const React = require("react");
+const react = require("@inertiajs/react");
+const useProps = () => {
+  const manager = React.useContext(index.PropsContext);
+  if (!manager) {
+    throw new Error("[@creopse/react] CreopseProvider not found in tree");
+  }
+  const [props, setProps] = React.useState(manager.getState().props);
+  React.useEffect(() => {
+    const unsubscribe = manager.subscribe((newProps) => {
+      setProps(newProps);
+    });
+    return unsubscribe;
+  }, [manager]);
+  return props;
+};
+const useContent = () => {
+  const { request } = index.useApi();
+  const { fileUrl } = index.useHelper();
+  const page = react.usePage();
+  const resolveSections = React.useContext(index.ResolveSectionsContext);
+  const getProps = React.useCallback(
+    () => page.props,
+    [page.props]
+  );
+  const pageData = React.useMemo(
+    () => page.props.pageData,
+    [page.props.pageData]
+  );
+  const newsArticle = React.useMemo(
+    () => page.props.article,
+    [page.props.article]
+  );
+  const newsCategory = React.useMemo(
+    () => page.props.category,
+    [page.props.category]
+  );
+  const newsTag = React.useMemo(
+    () => page.props.tag,
+    [page.props.tag]
+  );
+  const contentModelItem = React.useMemo(
+    () => page.props.contentModelItem,
+    [page.props.contentModelItem]
+  );
+  const getSectionData = React.useCallback(
+    (key) => {
+      if (!key) return null;
+      const keyParts = key.split("__");
+      const slug = keyParts.length ? keyParts[0] : "";
+      const linkId = keyParts.length > 1 ? keyParts[1] : "";
+      return page.props.pageData?.sections?.find(
+        (section) => section.slug === slug && section.pivot?.linkId === linkId
+      )?.pivot?.data || null;
+    },
+    [page.props.pageData?.sections]
+  );
+  const getSectionRootData = React.useCallback(
+    (key) => getSectionData(key)?.index,
+    [getSectionData]
+  );
+  const getSectionSettings = React.useCallback(
+    (key) => {
+      if (!key) return null;
+      const keyParts = key.split("__");
+      const slug = keyParts.length ? keyParts[0] : "";
+      const linkId = keyParts.length > 1 ? keyParts[1] : "";
+      return page.props.pageData?.sections?.find(
+        (section) => section.slug === slug && section.pivot?.linkId === linkId
+      )?.pivot?.settings || null;
+    },
+    [page.props.pageData?.sections]
+  );
+  const getSectionSettingsGroup = React.useCallback(
+    (key, group) => {
+      const settings = getSectionSettings(key);
+      return settings?.[group];
+    },
+    [getSectionSettings]
+  );
+  const getSectionSetting = React.useCallback(
+    (key, group, name) => {
+      const settings = getSectionSettingsGroup(key, group);
+      return settings?.[name];
+    },
+    [getSectionSettingsGroup]
+  );
+  const getSectionsInOrder = React.useCallback(() => {
+    const sections = pageData?.sections;
+    const sectionsOrder = pageData?.sectionsOrder;
+    const sectionsOrdered = [];
+    if (Array.isArray(sections) && Array.isArray(sectionsOrder)) {
+      for (const section of sectionsOrder) {
+        if (section) {
+          const item = sections.find(
+            (value) => `${value.slug}__${value.pivot?.linkId}` === section
+          );
+          if (item) {
+            sectionsOrdered.push(item);
+          }
+        }
+      }
+    }
+    return sectionsOrdered.length ? sectionsOrdered : sections || [];
+  }, [pageData?.sections, pageData?.sectionsOrder]);
+  const getFinalPageSections = React.useCallback(() => {
+    const sections = getSectionsInOrder();
+    const sectionsDisabled = pageData?.sectionsDisabled;
+    return sections.filter((section) => {
+      return !sectionsDisabled?.includes(
+        `${section.slug}__${section.pivot?.linkId}`
+      );
+    });
+  }, [getSectionsInOrder, pageData?.sectionsDisabled]);
+  const getAnySectionData = React.useCallback(
+    async (sectionSlug, pageSlug, linkId = "default") => {
+      const task = await request({
+        url: `section-data/${sectionSlug}/source/${pageSlug}/link/${linkId}`
+      });
+      if (task.success && task.result) {
+        return task.result.data;
+      }
+      return null;
+    },
+    [request]
+  );
+  const getComponents = React.useCallback(() => {
+    const components = {};
+    if (!resolveSections) {
+      throw new Error("[@creopse/react] resolveSections is required");
+    }
+    const files = resolveSections();
+    for (const [key, value] of Object.entries(files)) {
+      const componentName = key.replace(/^\.\/(.*)\.\w+$/, "$1");
+      const parts = componentName.split("/");
+      const name = parts[parts.length - 1]?.split(".")[0];
+      components[name] = value.default;
+    }
+    return components;
+  }, [resolveSections]);
+  const getContentModel = React.useCallback(
+    (name) => {
+      return page.props?.contentModels?.find(
+        (contentModel) => contentModel.name === name
+      );
+    },
+    [page.props?.contentModels]
+  );
+  const formatContentModelItemData = React.useCallback(
+    (item) => {
+      const { index: _, ...rest } = item.contentModelData;
+      return {
+        ...item,
+        data: {
+          ...item.contentModelData?.index,
+          ...rest
+        }
+      };
+    },
+    []
+  );
+  const getContentModelItems = React.useCallback(
+    async (name, filterByIsActive = true) => {
+      const task = await request({
+        url: `content-model/items?contentModelName=${name}${filterByIsActive ? "&isActive=true" : ""}`
+      });
+      if (task.success && task.result) {
+        return (task.result.data || []).map(
+          (item) => formatContentModelItemData(item)
+        );
+      }
+      return [];
+    },
+    [request, formatContentModelItemData]
+  );
+  const getPaginatedContentModelItems = React.useCallback(
+    async (name, pageSize, filterByIsActive = true) => {
+      const task = await request({
+        url: `content-model/items?pageSize=${pageSize}&contentModelName=${name}${filterByIsActive ? "&isActive=true" : ""}`
+      });
+      if (task.success && task.result) {
+        const items = (task.result.data?.items || []).map(
+          (item) => formatContentModelItemData(item)
+        );
+        const total = task.result.data?.meta?.total || 0;
+        const currentPage = task.result.data?.meta?.currentPage || 1;
+        return {
+          items,
+          total,
+          currentPage
+        };
+      }
+      return {
+        items: [],
+        total: 0,
+        currentPage: 1
+      };
+    },
+    [request, formatContentModelItemData]
+  );
+  const getMenu = React.useCallback(
+    (name, filterByIsActive = true) => {
+      const menu = page.props?.menus?.find((menu2) => menu2.name === name);
+      if (menu) {
+        menu.items = index.cloneDeep(
+          menu.items?.filter((item) => !filterByIsActive || item.isActive)?.sort((a, b) => a.position - b.position)
+        );
+      }
+      return menu;
+    },
+    [page.props?.menus]
+  );
+  const getMenuByLocation = React.useCallback(
+    (name, filterByIsActive = true) => {
+      const menu = page.props?.menus?.find(
+        (menu2) => menu2.location?.name === name
+      );
+      if (menu) {
+        menu.items = index.cloneDeep(
+          menu.items?.filter((item) => !filterByIsActive || item.isActive)?.sort((a, b) => a.position - b.position)
+        );
+      }
+      return menu;
+    },
+    [page.props?.menus]
+  );
+  const getMenuItems = React.useCallback(
+    (name, filterByIsVisible = true) => {
+      return getMenu(name)?.items?.filter((item) => !filterByIsVisible || item.isVisible)?.sort((a, b) => a.position - b.position);
+    },
+    [getMenu]
+  );
+  const getMenuItemById = React.useCallback(
+    (id) => {
+      const menuItems = [];
+      const menus = page.props?.menus || [];
+      menus.forEach((menu) => {
+        if (Array.isArray(menu.items)) menuItems.push(...menu.items);
+      });
+      return menuItems.find((item) => item.id === id);
+    },
+    [page.props?.menus]
+  );
+  const getMenuItemsByLocation = React.useCallback(
+    (name, filterByIsVisible = true) => {
+      return getMenuByLocation(name)?.items?.filter((item) => !filterByIsVisible || item.isVisible)?.sort((a, b) => a.position - b.position);
+    },
+    [getMenuByLocation]
+  );
+  const getMenuGroups = React.useCallback(
+    (name, byLocation = false, filterByIsVisible = true) => {
+      const groups = [];
+      const items = byLocation ? getMenuItemsByLocation(name, filterByIsVisible) : getMenuItems(name, filterByIsVisible);
+      if (items) {
+        for (const item of items) {
+          const groupAlreadyExists = groups.find(
+            (group) => group.id === item.menuItemGroupId
+          );
+          if (!groupAlreadyExists) {
+            const group = page.props?.menuItemGroups?.find(
+              (group2) => group2.id === item.menuItemGroupId
+            );
+            if (group) groups.push(group);
+          }
+        }
+      }
+      return groups;
+    },
+    [getMenuItems, getMenuItemsByLocation, page.props?.menuItemGroups]
+  );
+  const getMenuItemsByGroup = React.useCallback(
+    (name, groupId, byLocation = false, filterByIsVisible = true) => {
+      const items = byLocation ? getMenuItemsByLocation(name, filterByIsVisible) : getMenuItems(name, filterByIsVisible);
+      return items?.filter((item) => item.menuItemGroupId === groupId);
+    },
+    [getMenuItems, getMenuItemsByLocation]
+  );
+  const getMenuGroupedItems = React.useCallback(
+    (name, byLocation = false, filterByIsVisible = true) => {
+      const groups = getMenuGroups(name, byLocation);
+      return groups.map((group) => ({
+        group,
+        items: getMenuItemsByGroup(
+          name,
+          group.id || 0,
+          byLocation,
+          filterByIsVisible
+        )
+      }));
+    },
+    [getMenuGroups, getMenuItemsByGroup]
+  );
+  const getMenuUngroupedItems = React.useCallback(
+    (name, byLocation = false, filterByIsVisible = true) => {
+      const items = byLocation ? getMenuItemsByLocation(name, filterByIsVisible) : getMenuItems(name, filterByIsVisible);
+      return items?.filter((item) => !item.menuItemGroupId);
+    },
+    [getMenuItems, getMenuItemsByLocation]
+  );
+  const getAppInformationValue = React.useCallback(
+    (key, type = "string") => {
+      const appInformation = page.props.appInformation;
+      const setting = appInformation.find((s) => s.key === key);
+      let value = "";
+      switch (type) {
+        case "number":
+          value = setting && parseInt(setting.value) && !isNaN(parseInt(setting.value)) ? parseInt(setting.value) : 0;
+          break;
+        case "boolean":
+          value = setting && !isNaN(parseInt(setting.value)) && parseInt(setting.value) > 0;
+          break;
+        case "object":
+          value = setting && setting.value ? JSON.parse(setting.value) : {};
+          break;
+        case "array":
+          value = setting && setting.value ? JSON.parse(setting.value) : [];
+          break;
+        default:
+          value = setting && setting.value ? setting.value : "";
+          break;
+      }
+      return value;
+    },
+    [page.props.appInformation]
+  );
+  const appPrimaryColor = React.useMemo(() => {
+    const primaryColor = getAppInformationValue(
+      "primaryColor"
+    );
+    return primaryColor || "#005B97";
+  }, [getAppInformationValue]);
+  const appSecondaryColor = React.useMemo(() => {
+    const secondaryColor = getAppInformationValue(
+      "secondaryColor"
+    );
+    return secondaryColor || "#1E9CD7";
+  }, [getAppInformationValue]);
+  const appAccentColor = React.useMemo(() => {
+    const accentColor = getAppInformationValue("accentColor");
+    return accentColor || "#FF6501";
+  }, [getAppInformationValue]);
+  const icon = React.useMemo(() => {
+    const icon2 = getAppInformationValue("icon");
+    return fileUrl(icon2) || "";
+  }, [getAppInformationValue, fileUrl]);
+  const logo = React.useMemo(() => {
+    const logo2 = getAppInformationValue("logo");
+    return fileUrl(logo2) || "";
+  }, [getAppInformationValue, fileUrl]);
+  return {
+    logo,
+    icon,
+    page,
+    pageData,
+    newsArticle,
+    newsCategory,
+    newsTag,
+    contentModelItem,
+    getProps,
+    getMenu,
+    getMenuByLocation,
+    getMenuItems,
+    getMenuItemById,
+    getMenuItemsByLocation,
+    getMenuGroups,
+    getMenuItemsByGroup,
+    getMenuGroupedItems,
+    getMenuUngroupedItems,
+    getSectionData,
+    getSectionSettings,
+    getSectionSettingsGroup,
+    getSectionSetting,
+    getAnySectionData,
+    getSectionsInOrder,
+    getFinalPageSections,
+    getSectionRootData,
+    getComponents,
+    getContentModel,
+    getContentModelItems,
+    getPaginatedContentModelItems,
+    getAppInformationValue,
+    appAccentColor,
+    appPrimaryColor,
+    appSecondaryColor
+  };
+};
+const useNewsletter = () => {
+  const { request } = index.useApi();
+  const [isLoading, setIsLoading] = React.useState(false);
+  const subscribe = React.useCallback(
+    async (type, contact, successCallback, errorCallback) => {
+      setIsLoading(true);
+      const task = await request({
+        url: `newsletter/${type}s`,
+        method: "post",
+        data: type === "email" ? { email: contact } : { phone: contact }
+      });
+      if (task.failure && task.error) {
+        if (errorCallback) errorCallback(task.error?.response?.data);
+      } else {
+        if (successCallback) successCallback();
+      }
+      setIsLoading(false);
+    },
+    [request]
+  );
+  const subscribeEmail = React.useCallback(
+    async (email, successCallback, errorCallback) => {
+      await subscribe("email", email, successCallback, errorCallback);
+    },
+    [subscribe]
+  );
+  const subscribePhone = React.useCallback(
+    async (phone, successCallback, errorCallback) => {
+      await subscribe(
+        "phone",
+        phone.replace(/\s+/g, ""),
+        successCallback,
+        errorCallback
+      );
+    },
+    [subscribe]
+  );
+  return {
+    subscribePhone,
+    subscribeEmail,
+    isLoading
+  };
+};
+exports.useApi = index.useApi;
+exports.useConfig = index.useConfig;
+exports.useHelper = index.useHelper;
+exports.useContent = useContent;
+exports.useNewsletter = useNewsletter;
+exports.useProps = useProps;