{"version":3,"sources":["webpack:///./Scripts/Components/VariantPickerDropdown.js","webpack:///./Scripts/Containers/VariantPicker.container.js"],"names":["VariantPickerDropdown","props","options","field","previousField","index","onSelectChange","fieldValues","disabled","getAvailableVariants","variants","previousFieldValue","variantValues","variantId","push","className","name","onChange","e","target","value","translate","toLowerCase","values","getOptions","length","currentValue","key","fieldId","connect","state","variantPicker","items","variantUrl","error","currentVariantId","React","useState","setFieldValues","preventUrlChange","setPreventUrlChange","isRedirecting","setIsRedirecting","dispatch","useDispatch","useEffect","initializeFieldValues","location","href","triggerGetVariantUrl","firstField","selectedVariant","val","fieldValueObjects","multiCulture","getVariantUrl","setFieldValue","resetFieldValues","fieldValuesCopy","i","firstFieldValue","0","f","message"],"mappings":"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","file":"24.5a1d0599b46c8c14b013.js","sourcesContent":["import React from \"react\"\r\nimport { translate } from \"../Services/translation\"\r\n\r\nexport default function VariantPickerDropdown(props) {\r\n    const { field, previousField, index, onSelectChange, fieldValues, disabled } = props\r\n\r\n    // const [isDisabled, setIsDisabled] = React.useState(disabled)\r\n\r\n    const getOptions = () => {\r\n        if(index == 0) return [...new Set(Object.values(field.variantValues))]\r\n\r\n        var variants = getAvailableVariants()\r\n        var values = []\r\n        \r\n        for(var variantId of variants) {\r\n            if(field.variantValues[variantId])\r\n                values.push(field.variantValues[variantId])\r\n        }\r\n        \r\n        if(!values || !values[0])\r\n            return null\r\n\r\n        return values\r\n    }\r\n\r\n    const getAvailableVariants = () => {\r\n        var variants = []\r\n        var previousFieldIndex = index-1\r\n        var previousFieldValue = fieldValues[previousFieldIndex]\r\n        for(var variantId of Object.keys(previousField.variantValues)) {\r\n            var valueForVariant = previousField.variantValues[variantId]\r\n            if(valueForVariant == previousFieldValue)\r\n                variants.push(variantId)\r\n        }\r\n        return variants\r\n    }\r\n\r\n    const getCurrentValue = () => fieldValues[index] ? fieldValues[index] : \"\"\r\n\r\n    const renderOptions = () => {\r\n        var options = getOptions()\r\n        if(options == null || options.length == 0) {\r\n            field.currentValue = \"0\"\r\n            return <option value=\"0\">\r\n                {translate(\"variantpicker.no-option-available\")}\r\n            </option>\r\n        }\r\n\r\n        return options.sort().map(value => <option key={field.fieldId + value}>\r\n            {value}\r\n        </option>)\r\n    }\r\n\r\n\r\n    return <div className=\"field-wrapper\">\r\n        <label>{field.name}</label>\r\n        <div className=\"input-wrapper input-wrapper--select\">\r\n            <select onChange={e => onSelectChange(index, e.target.value)} value={getCurrentValue()} disabled={disabled}>\r\n                <option disabled={true} value={\"\"}>{translate(\"variantpicker.choose\")} {field.name.toLowerCase()}</option>\r\n                {renderOptions()}\r\n            </select>\r\n        </div>\r\n    </div>\r\n}","import React from \"react\"\r\nimport { connect, useDispatch } from \"react-redux\";\r\nimport { getVariantPickerData, getVariantUrl } from \"../Actions/VariantPicker.action\";\r\nimport VariantPickerDropdown from \"../Components/VariantPickerDropdown\";\r\n\r\nfunction VariantPickerContainer(props) {\r\n    const { items, variantUrl, error, currentVariantId } = props\r\n    \r\n    const [fieldValues, setFieldValues] = React.useState({})\r\n    const [preventUrlChange, setPreventUrlChange] = React.useState(true)\r\n    const [isRedirecting, setIsRedirecting] = React.useState(false)\r\n    const dispatch = useDispatch()\r\n\r\n    React.useEffect(() => {\r\n        if(items){\r\n            initializeFieldValues()\r\n        }\r\n    }, [items])\r\n\r\n    React.useEffect(() => {\r\n        if(variantUrl) {\r\n            setIsRedirecting(true)\r\n            location.href = variantUrl\r\n        }\r\n    }, [variantUrl])\r\n\r\n    React.useEffect(() => {\r\n        if(!preventUrlChange && fieldValues && items/* && Object.keys(fieldValues).length == items.length*/) {\r\n            triggerGetVariantUrl()\r\n        }\r\n    }, [fieldValues, preventUrlChange])\r\n\r\n    const triggerGetVariantUrl = () => {\r\n        var firstField = items[0]\r\n        // Based on the first field's value, get the variant id (variant ids are the keys, so get the index of the value, then get the variant id from the index)\r\n        var selectedVariant = Object.keys(firstField.variantValues)[Object.values(firstField.variantValues).findIndex(val => val == fieldValues[0])]\r\n        var fieldValueObjects = []\r\n        for(var index in items) {\r\n            var field = items[index]\r\n            var value = fieldValues[index]\r\n            fieldValueObjects.push({\r\n                fieldId: field.fieldId,\r\n                value: !value && value !== null ? field.variantValues[selectedVariant] : value, // get the stored value or the value based on the first field's value\r\n                multiCulture: field.multiCulture\r\n            })\r\n        }\r\n        dispatch(getVariantUrl(currentVariantId, fieldValueObjects))\r\n    }\r\n\r\n    const setFieldValue = (key, value) => {\r\n        setPreventUrlChange(false)\r\n        if(key == 0 && items.length > 1) {\r\n            resetFieldValues(value)\r\n        }else{\r\n            var fieldValuesCopy = Object.assign({}, fieldValues)\r\n            // Reset all fields after this field\r\n            if(key < items.length-1) {\r\n                for(var i = key+1; i < items.length; i++) {\r\n                    fieldValuesCopy[i] = null\r\n                }\r\n            }\r\n            fieldValuesCopy[key] = value\r\n            setFieldValues(fieldValuesCopy)\r\n        }\r\n    }\r\n\r\n    const resetFieldValues = firstFieldValue => {\r\n        if(firstFieldValue == items[0].currentValue) {\r\n            initializeFieldValues()\r\n        }else{\r\n            setFieldValues({ 0: firstFieldValue })\r\n        }\r\n    }\r\n\r\n    const initializeFieldValues = () => {\r\n        var fieldValues = {}\r\n        for(var index in items) {\r\n            var field = items[index]\r\n            fieldValues[index] = field.variantValues[currentVariantId]\r\n        }\r\n        setFieldValues(fieldValues)\r\n    }\r\n\r\n    // Render if there are more than one variant\r\n    return items && items.length > 0 && items.filter(f => Object.keys(f.variantValues).length > 1).length >= 1 ?\r\n        <div className=\"variant-picker\">\r\n            {items.map((field, i) => \r\n                <VariantPickerDropdown fieldValues={fieldValues}\r\n                                       index={i}\r\n                                       field={field} \r\n                                       onSelectChange={setFieldValue} \r\n                                       previousField={i > 0 ? items[i-1] : null} \r\n                                       key={field.fieldId}\r\n                                       disabled={isRedirecting} />\r\n            )}\r\n            {error && <div className=\"variant-picker__error\">{error.message ? error.message : \"Unknown error\"}</div>}\r\n        </div>\r\n        : null\r\n}\r\n\r\nconst mapStateToProps = state => {\r\n    return state.variantPicker\r\n}\r\n\r\nexport default connect(mapStateToProps)(VariantPickerContainer);"],"sourceRoot":""}