import containerConnect from 'Framework/ComponentContainer';
import { setVisible } from 'App/Reducers/UI/Actions';
import { clearOptionDetails } from 'App/Reducers/Configurator/Actions';
import get from 'lodash/get';
import OptionDetail from '../../Components/Optiondetail';

const mapStateToProps = ({ ui, configurator, device }) => {
    return {
        Component: OptionDetail,

        show: !ui.visibilityMap.incompatibility && !!ui.visibilityMap.optionDetails,
        title: get(configurator.selectedoptionclassification, 'title', ''),
        optionclassification: configurator.selectedoptionclassification || {},
        details: configurator.optiondetails,
        options: configurator.optionsWithDetails,
        channelSettings: get(configurator.configuration, 'information.channelSettings'),
        languageSettings: get(configurator.configuration, 'information.languageSettings'),
        isTabletDevice: device.screen.isTabletDevice,
    };
};

const mapDispatchToProps = dispatch => ({
    onClose: () => {
        dispatch(setVisible('optionDetails', false));
        dispatch(clearOptionDetails());
    },
});

export default containerConnect(mapStateToProps, mapDispatchToProps);
