{"version":3,"sources":["../src/components/XPage/index.tsx"],"names":["_","isEqual","React","Stack","XStack","XGrid","XCarousel","XCategoryFilter","XProductDetails","XFooter","XHeader","XPage","initPage","path","initFooter","initHeader","initCommon","children","initiated","setInitiated","xPage","setXPage","useXPage","xHeader","setXHeader","useXCommonChildren","xFooter","setXFooter","xPath","setXPath","useXPath","EDITABLE_PATHS","headers","c","footers","content","child","i","_a","DynamicXElement","XPage_default","compareProps","prevProps","nextProps","index","position","xElement","setXElement","useXElement","setParent","useXElementUpdater","old","elementsIndexes","newEl","CONTAINERS_NAME"],"mappings":"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","sourcesContent":["import _, { isEqual } from \"lodash\";\nimport * as React from \"react\";\nimport { Stack } from \"@mui/material\";\nimport { CONTAINERS_NAME } from \"../../utils/constants/common/componentName\";\nimport { useXPage } from \"../../hooks/useXPage\";\nimport {\n  TUseXElement,\n  useXElement,\n  useXElementUpdater,\n} from \"../../hooks/useXElement\";\nimport { useXPath } from \"../../hooks/useXPath\";\nimport { useXCommonChildren } from \"../../hooks/useXCommon\";\nimport { XPageProps } from \"../../utils/interfaces/core/XPage\";\nimport { EDITABLE_PATHS } from \"../../utils/constants/common/urlPaths\";\nimport { TComponentType } from \"../../utils/types/common/components.types\";\n\nconst XStack = React.lazy(() => import(\"../containers/XStack\"));\nconst XGrid = React.lazy(() => import(\"../containers/XGrid\"));\nconst XCarousel = React.lazy(() => import(\"../containers/XCarousel\"));\nconst XCategoryFilter = React.lazy(\n  () => import(\"../containers/XCategoryFilter\")\n);\nconst XProductDetails = React.lazy(\n  () => import(\"../containers/XProductDetails\")\n);\nconst XFooter = React.lazy(() => import(\"../common/XFooter\"));\nconst XHeader = React.lazy(() => import(\"../common/XHeader\"));\n\nconst XPage: React.FC<XPageProps> = ({\n  initPage,\n  path = \"/\",\n  initFooter = {},\n  initHeader = {},\n  initCommon = [],\n\n  children,\n}) => {\n  const [initiated, setInitiated] = React.useState(false);\n\n  const { xPage, setXPage } = useXPage();\n\n  const { xChildren: xHeader, setXChildren: setXHeader } =\n    useXCommonChildren(\"HEADER\");\n\n  const { xChildren: xFooter, setXChildren: setXFooter } =\n    useXCommonChildren(\"FOOTER\");\n\n  const { xPath, setXPath } = useXPath();\n\n  React.useEffect(() => {\n    // if the data has loaded we dont do not update anymore\n    if (initiated) return;\n\n    // SET THE CURRENT PATH\n    if (path && !xPath) setXPath(path);\n\n    // SET THE INITIAL DATA FOR THE CURRENT PAGE\n    if (initPage) {\n      EDITABLE_PATHS.forEach((path) => {\n        if (initPage[path]) {\n          setXPage({ path, elements: initPage[path] as TComponentType[] });\n        }\n      });\n    }\n\n    // if (initPage && xPath) {\n    //   if (!!initPage[xPath]) {\n    //     if ((initPage[xPath] as any[]).length > 0) {\n    //       if (!xPage || (xPage as any).length === 0) {\n    //         setXPage(initPage[xPath] ?? []);\n    //       }\n    //     }\n    //   }\n    // }\n\n    // SET THE GENERAL HEADER DATA\n\n    if (initCommon && initCommon.length > 0) {\n      if (!xHeader || xHeader.length === 0) {\n        const headers = initCommon.filter((c) => {\n          if (!c.config) return false;\n\n          return c.config.index.startsWith(\"HEADER\");\n        });\n\n        if (headers.length > 0) setXHeader(headers);\n      }\n\n      if (!xFooter || xFooter.length === 0) {\n        const footers = initCommon.filter((c) => {\n          if (!c.config) return false;\n\n          return c.config.index.startsWith(\"FOOTER\");\n        });\n\n        if (footers.length > 0) setXFooter(footers);\n      }\n    }\n    // if (initCommon && (!xHeader || xHeader.length === 0)) {\n    //   setXHeader(\n    //     initCommon.filter((c) => {\n    //       if (!c.config) return false;\n\n    //       return c.config.index.startsWith(\"HEADER\");\n    //     })\n    //   );\n    // }\n\n    // SET THE GENERAL FOOTER DATA\n    if (initCommon && (!xFooter || xFooter.length === 0)) {\n      setXFooter(\n        initCommon.filter((c) => {\n          if (!c.config) return false;\n\n          return c.config.index.startsWith(\"FOOTER\");\n        })\n      );\n    }\n\n    setInitiated(true);\n  }, [path, initPage, xPath, initCommon, initiated]);\n\n  const content = (\n    <React.Fragment>\n      {\n        // check page data\n        // (xPage.length === 0\n        //   ? [\n        //       {\n        //         name: \"XCategoryFilter\",\n        //         config: { index: \"ICI\" },\n        //         dataFetching: { limit: 4 },\n        //         props: {\n        //           all: {\n        //             containerMode: \"CENTER\",\n        //             columns: 4,\n        //             gap: \"15px\",\n        //             padding: { Top: \"15px\", bottom: \"15px\" },\n        //           },\n        //         },\n        //       },\n        //     ]\n        //   : // SHOW PAGE\n        //     (xPage as TComponentType[])\n        // )\n\n        [...xPage].map((child, i) => {\n          return (\n            <DynamicXElement\n              key={i}\n              child={child}\n              index={child.config?.index ?? \"\"}\n              position={i}\n            />\n          );\n        })\n      }\n      {/* {XGUI && (\n        <React.Suspense fallback={<p>loading editor...</p>}>\n          <XGUI />\n        </React.Suspense>\n      )} */}\n    </React.Fragment>\n  );\n\n  return (\n    <Stack\n      id=\"XPage\"\n      sx={{\n        width: \"100%\",\n        position: \"relative\",\n        display: \"block\",\n        // minHeight: \"100vh\",\n\n        // '& [data-x-selected=\"true\"]': {\n        //   outline: `2px solid ${SECONDARY_COLOR}`,\n        //   outlineOffset: `5px`,\n        //   zIndex: 100,\n        // },\n        '& [data-x-hovered=\"true\"]:not([data-x-selected=\"true\"])': {\n          outline: `3px solid #333`,\n          outlineOffset: `5px`,\n          zIndex: 100,\n        },\n      }}\n    >\n      <React.Suspense fallback={<p>loading header...</p>}>\n        <XHeader initData={initHeader} />\n      </React.Suspense>\n      <React.Suspense fallback={<p>loading content...</p>}>\n        {children ?? content}\n      </React.Suspense>\n      <React.Suspense fallback={<p>loading footer...</p>}>\n        <XFooter initData={initFooter} />\n      </React.Suspense>\n    </Stack>\n  );\n};\n\nexport default XPage;\n\nconst compareProps = (prevProps: any, nextProps: any) => {\n  return isEqual(prevProps, nextProps);\n};\n\nconst DynamicXElement: React.FC<{\n  child: any;\n  index: string;\n  position: number;\n}> = React.memo(({ child, index, position }) => {\n  const { xElement, setXElement } = useXElement<any>(index);\n\n  // WE ARE GETTING THE CURRENT ELEMENT FROM THE ATOM FAMILY\n  const setParent = useXElementUpdater<TUseXElement<any>>(\n    child.config.childOf ?? \"NO_PARENT\"\n  );\n\n  React.useEffect(() => {\n    setParent((old) => {\n      const elementsIndexes = old.elementsIndexes\n        ? [...old.elementsIndexes, index]\n        : [index];\n\n      return { ...old, elementsIndexes: _.uniq(elementsIndexes) };\n    });\n\n    const newEl: any = {\n      name: child.name,\n\n      index: child.index ?? index,\n\n      hierachy: child.hierachy ?? \"XPage-\" + child.name,\n\n      value: child.value ?? child.props ?? { all: {} },\n\n      elementsIndexes: xElement\n        ? xElement.elementsIndexes ?? []\n        : child.elementsIndexes ?? [],\n\n      hasChildren: child.hasChildren ?? CONTAINERS_NAME.includes(child.name),\n    };\n\n    if (child.childOf || child.config.childOf) {\n      newEl.childOf = child.childOf ?? child.config.childOf;\n    }\n\n    if (child.dataFetching) newEl.dataFetching = child.dataFetching;\n\n    setXElement(newEl);\n  }, [index, position]);\n\n  if (child.config.childOf) return null;\n\n  switch (child.name) {\n    case \"XStack\":\n      return (\n        <React.Suspense fallback={<p>loading XStack...</p>}>\n          <XStack {...child} />\n        </React.Suspense>\n      );\n\n    case \"XGrid\":\n      return (\n        <React.Suspense fallback={<p>loading XGrid...</p>}>\n          <XGrid {...child} />\n        </React.Suspense>\n      );\n    case \"XCategoryFilter\":\n      return (\n        <React.Suspense fallback={<p>loading XCategoryFilter...</p>}>\n          <XCategoryFilter {...child} />\n        </React.Suspense>\n      );\n\n    case \"XProductDetails\":\n      return (\n        <React.Suspense fallback={<p>loading XProductDetails...</p>}>\n          <XProductDetails {...child} />\n        </React.Suspense>\n      );\n\n    case \"XCarousel\":\n      return (\n        <React.Suspense fallback={<p>loading XCarousel...</p>}>\n          <XCarousel {...child} />\n        </React.Suspense>\n      );\n\n    default:\n      return null;\n  }\n}, compareProps);\n"]}