import { containerConnect } from 'Framework/ComponentContainer';
import ProductPartsList from '../../Components/ProductPartsList';
import { getConf } from 'App/configuration';
import { getComponent } from 'App/configuration';
import CallToAction from 'App/Shared/Components/CallToAction';
import memoize from 'Utils/Function/memoize';
import { applyOptionInputText } from '../../../../Reducers/Configurator/Actions';

const removeHiddenComponents = memoize(components =>
    components.filter(({ hiddenInFrontend }) => !hiddenInFrontend)
);

const mapStateToProps = ({ configurator, device, ui }) => {
    const dock = getConf('dock');

    return {
        Component: ProductPartsList,
        CallToActionComponent: getComponent('StartHere') || CallToAction,
        displaySwitchedOptions: getConf('displaySwitchedOptions'),
        optionclassifications: removeHiddenComponents(configurator.filteredOptionclassifications),
        selectedoptionclassification: configurator.selectedoptionclassification,
        showStartHere: ui.visibilityMap.startHere,
        optionListVisible: ui.visibilityMap.optionlist,
        vertical: dock ? dock === 'left' : device.screen.orientation === 'landscape',
    };
};

const mapDispatchToProps = dispatch => ({
    onCloseSelectedPart: optionClassification => dispatch(applyOptionInputText(optionClassification)),
});

export default containerConnect(mapStateToProps, mapDispatchToProps);
