\n );\n};\n\nexport default StackedPricesLink;\n","import React, { useState, useRef, useEffect } from 'react';\n\nconst StateStyles = {\n LOADING: '--loading',\n SUCCESS: '--success',\n ERROR: '--error',\n};\n\n/**\n * Represents a HOC which wraps a BuyButton or ReorderButton and applies diffrent styles to it\n * depending on its click state.\n * @param {*} WrappedComponent The button component.\n * @param {*} onClick The async button's onClick event. It should return true if everything is OK, or false if there is any error.\n * @param {*} stylePrefix The style prefix to append state's modifiers. For\n * example, 'button' will result as 'button--loading'.\n *\n * Some available props that the HOC component supports:\n * autoReset : it is true by default. Not its value, but the behaviour is like that. Unless people set it as false, by default, button is always reset to neutral state after the request is completed.\n * resetTimeout: Number milisecond after the complete state, the style of button will be reset. If don't set, it is 2000\n * minimumLoadingTime: Mininum milisecond to display the loading state. If don't set, it is 1000\n */\nexport default function withReactiveStyleBuyButton(\n WrappedComponent,\n onClick,\n stylePrefix\n) {\n return (props) => {\n const [stateClass, setStateClass] = useState('');\n const startTime = useRef(0);\n\n useEffect(() => {\n return () => {\n setStateClass('');\n };\n }, []);\n\n function onNeutralState() {\n setStateClass('');\n startTime.current = 0;\n }\n\n function onLoadingState() {\n setStateClass(`${stylePrefix}${StateStyles.LOADING}`);\n startTime.current = Date.now();\n }\n\n const changeState = (complete) => {\n setStateClass(\n `${stylePrefix}${complete ? StateStyles.SUCCESS : StateStyles.ERROR}`\n );\n\n // if `autoReset` is true, which is default, the style will be changed\n // to neutral after a `resetTimeout` amount of time (2 seconds by default).\n props.autoReset !== false &&\n setTimeout(() => {\n onNeutralState();\n }, props.resetTimeout || 2000);\n };\n\n function onComplete(complete) {\n const loadingDuration = Date.now() - startTime.current;\n const minimumLoadingTime = props.minimumLoadingTime || 1000;\n // ensure the loading indicator is displayed at least a `minimumLoadingTime`\n // amount of time before changing it to Success or Error.\n if (loadingDuration >= minimumLoadingTime) {\n changeState(complete);\n } else {\n setTimeout(() => {\n changeState(complete);\n }, minimumLoadingTime - loadingDuration);\n }\n }\n\n async function onButtonClick(params) {\n onLoadingState();\n const data = await onClick(params);\n onComplete(data);\n }\n\n return (\n \n onButtonClick(params)}\n {...props}\n />\n \n );\n };\n}\n","import { post, get } from './http';\nimport { dataLayerAddToCart } from '../Services/Gtm.service';\n\nexport const add = async ({ articleNumber, quantity = 1 }) => {\n if (!quantity || isNaN(quantity) || parseFloat(quantity) <= 0) {\n throw 'Invalid quantity';\n }\n\n const response = await post('/api/cart/add', {\n articleNumber,\n quantity: parseFloat(quantity),\n });\n\n var result = await response.json();\n\n try {\n addToDataLayer([{ articleNumber, quantity }], result.orderRows);\n } catch (err) {\n console.log(err);\n }\n\n return result;\n};\n\nexport const reorder = async (orderId) => {\n const response = await post('/api/cart/reorder', { orderId });\n return response.json();\n};\n\nexport const getTierPrices = async (articleNumber) => {\n const response = await post('/api/cart/getTierPrices', {\n articleNumber,\n });\n return response.json();\n};\n\nconst addToDataLayer = (products, orderRows) => {\n let responseProducts = [];\n\n orderRows.map((row) => {\n for (const i in products) {\n if (Object.hasOwnProperty.call(products, i)) {\n if (products[i].articleNumber === row.articleNumber) {\n const index = responseProducts.findIndex(\n (e) => e.articleNumber === row.articleNumber\n );\n\n if (index === -1) {\n row.gtmEcommerceItem.quantity = products[i].quantity;\n row.gtmEcommerceItem.index = responseProducts.length;\n responseProducts.push(row);\n }\n }\n }\n }\n });\n\n const gtmEcommerceItems = responseProducts.map((p) => p.gtmEcommerceItem);\n if (gtmEcommerceItems) {\n dataLayerAddToCart(gtmEcommerceItems);\n }\n};\n","export function PercentageDiscount(price, campaignPrice) {\n if (price <= 0 || campaignPrice <= 0) {\n return '';\n }\n const percentagePrecise = 100 * (1 - campaignPrice / price);\n const percentageTwoDecimals = Math.round(percentagePrecise * 100) / 100;\n var percentage = Math.floor(percentageTwoDecimals);\n if (percentage <= 0) {\n return '';\n }\n\n return '-' + percentage + '%';\n}\n"],"sourceRoot":""}
\n \n