{"version":3,"sources":["webpack:///./Scripts/Actions/ProductConfigurator.action.js","webpack:///./Scripts/Components/ProductConfiguratorContainer.js"],"names":["rootRoute","getSendObject","options","userText","items","map","item","selectedData","title","variantData","find","y","selected","push","articleNo","message","receiveVariantData","type","PRODUCT_CONFIGURATOR_RECEIVE","payload","responseSetVariantData","response","dispatch","loadCart","PRODUCT_CONFIGURATOR_SEND","returnMessage","responseUpdatingVariantData","PRODUCT_CONFIGURATOR_UPDATE","configMessage","setError","error","PRODUCT_CONFIGURATOR_ERROR","useDispatch","mounted","setMounted","useState","localVariantData","setLocalVariantData","buyButtonEnabled","setBuyButtonEnabled","setUserText","useSelector","state","productConfigurator","useEffect","async","get","then","json","result","catch","ex","catchError","getVariantData","setup","length","sendOptions","post","className","Fragment","index","key","index2","onClick","index1","tempVariantData","i","setValue","value","translate","name","onChange","e","target","dangerouslySetInnerHTML","__html","setVariantData","disabled"],"mappings":"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","file":"328.7dac247933ba6c0ab5b0.js","sourcesContent":["import { ViewMode } from '../constants';\nimport { get, post, put, remove as httpRemove } from '../Services/http';\nimport { catchError } from './Error.action';\nimport { load as loadCart } from './Cart.action';\nimport {\n  PRODUCT_CONFIGURATOR_RECEIVE,\n  PRODUCT_CONFIGURATOR_SEND,\n  PRODUCT_CONFIGURATOR_UPDATE,\n  PRODUCT_CONFIGURATOR_ERROR,\n} from '../constants';\n\nconst rootRoute = '/api/configurationOptions';\n\nexport const getVariantData = (articleNo) => (dispatch) => {\n  return get(rootRoute + '/getOptions?articleNo=' + articleNo)\n    .then((response) => response.json())\n    .then((result) => {\n      dispatch(receiveVariantData(result));\n    })\n    .catch((ex) => dispatch(catchError(ex, (error) => setError(error))));\n};\n\nexport const updatingSelectedData = (options) => (dispatch) => {\n  const sendOptions = getSendObject(options, '');\n  return post(rootRoute + '/updateOptions', sendOptions)\n    .then((response) => response.json())\n    .then((result) => {\n      dispatch(responseUpdatingVariantData(result));\n    })\n    .catch((ex) =>\n      dispatch(\n        catchError(ex, (error) => {\n          setError(error);\n        })\n      )\n    );\n};\n\nexport const setVariantData = (options, userText) => (dispatch) => {\n  const sendOptions = getSendObject(options, userText);\n  return post(rootRoute + '/sendOptions', sendOptions)\n    .then((response) => response.json())\n    .then((result) => {\n      dispatch(responseSetVariantData(result));\n    })\n    .catch((ex) =>\n      dispatch(\n        catchError(ex, (error) => {\n          setError(error);\n        })\n      )\n    );\n};\n\nconst getSendObject = (options, userText) => {\n  const items = [];\n  options.items.map((item) => {\n    const selectedData = {\n      title: item.title,\n      selectedData: item.variantData.find((y) => y.selected === true),\n    };\n    items.push(selectedData);\n  });\n  return {\n    articleNo: options.articleNo,\n    items,\n    message: userText,\n  };\n};\n\nconst receiveVariantData = (variantData) => ({\n  type: PRODUCT_CONFIGURATOR_RECEIVE,\n  payload: {\n    variantData,\n  },\n});\nexport const responseSetVariantData = (response) => (dispatch) => {\n  dispatch(loadCart());\n  dispatch({\n    type: PRODUCT_CONFIGURATOR_SEND,\n    payload: {\n      returnMessage: response.message,\n    },\n  });\n};\n\nexport const responseUpdatingVariantData = (response) => (dispatch) => {\n  dispatch({\n    type: PRODUCT_CONFIGURATOR_UPDATE,\n    payload: {\n      configMessage: response.message,\n    },\n  });\n};\n\nexport const setError = (error) => ({\n  type: PRODUCT_CONFIGURATOR_ERROR,\n  payload: {\n    error,\n  },\n});\n","import React, {\n  Fragment,\n  useEffect,\n  useState,\n  useRef,\n  useCallback,\n} from 'react';\nimport { useSelector, useDispatch } from 'react-redux';\nimport { translate } from '../Services/translation';\nimport {\n  getVariantData,\n  updatingSelectedData,\n  setVariantData,\n} from '../Actions/ProductConfigurator.action';\n\nconst ProductConfiguratorContainer = ({ articleNo }) => {\n  const dispatch = useDispatch();\n  const [mounted, setMounted] = useState(false);\n  const [localVariantData, setLocalVariantData] = useState({});\n  const [buyButtonEnabled, setBuyButtonEnabled] = useState(true);\n  const [userText, setUserText] = useState('');\n\n  const { variantData, returnMessage, configMessage } = useSelector(\n    (state) => state.productConfigurator\n  );\n\n  useEffect(() => {\n    async function setup() {\n      dispatch(getVariantData(articleNo));\n    }\n    setup();\n  }, []);\n\n  useEffect(() => {\n    if (variantData?.items?.length > 0) {\n      setLocalVariantData(variantData);\n      setMounted(true);\n    }\n  }, [variantData]);\n\n  useEffect(() => {\n    if (localVariantData?.items?.length > 0) {\n      dispatch(updatingSelectedData(localVariantData));\n    }\n  }, [localVariantData]);\n\n  const sendData = () => {\n    dispatch(setVariantData(localVariantData, userText));\n  };\n\n  const setValue = (index1, index2) => {\n    const tempVariantData = { ...localVariantData };\n    tempVariantData.items[index1].variantData.map((item, i) => {\n      if (i === index2) {\n        item.selected = true;\n      } else {\n        item.selected = false;\n      }\n    });\n    setLocalVariantData(tempVariantData);\n  };\n\n  if (!mounted) {\n    return null;\n  }\n  return (\n    <div className=\"row small-up-1 product-configurator\">\n      {localVariantData?.items?.length > 0 && (\n        <Fragment>\n          {localVariantData.items.map((item, index) => (\n            <div\n              key={`items_${index}`}\n              className=\"columns product-configurator__items\"\n            >\n              <h2 className=\"product-detail__item-title\">{item.title}</h2>\n              {item.variantData?.length > 0 && (\n                <ul>\n                  {item.variantData.map((variantData, index2) => (\n                    <li\n                      key={`item_${index2}`}\n                      className=\"product-detail__selector-item\"\n                    >\n                      <div\n                        onClick={() => setValue(index, index2)}\n                        className={`product-detail__selector-link ${\n                          variantData.selected\n                            ? 'product-detail__selector-link--active'\n                            : ''\n                        }`}\n                      >\n                        {variantData.value}\n                      </div>\n                    </li>\n                  ))}\n                </ul>\n              )}\n            </div>\n          ))}\n        </Fragment>\n      )}\n      <Fragment>\n        <div className=\"product-detail__item-title\">\n          {translate('product.configurator.message')}\n        </div>\n        <textarea\n          name=\"postContent\"\n          onChange={(e) => setUserText(e.target.value)}\n        />\n      </Fragment>\n      {returnMessage && returnMessage.length > 0 && (\n        <div\n          className=\"product-configurator__return-message\"\n          dangerouslySetInnerHTML={{ __html: returnMessage }}\n        />\n      )}\n      {configMessage && configMessage.length > 0 && (\n        <div\n          className=\"product-configurator__config-message\"\n          dangerouslySetInnerHTML={{ __html: configMessage }}\n        />\n      )}\n      <button\n        className=\"button buy-button product-detail__buy-button\"\n        onClick={sendData}\n        disabled={!variantData.buyButtonEnabled}\n      >\n        {translate('product.buy')}\n      </button>\n    </div>\n  );\n};\n\nexport default ProductConfiguratorContainer;\n"],"sourceRoot":""}