import get from 'lodash/get';
import Thumbnail from '../Components/Thumbnail';
import { containerConnect } from 'Framework/ComponentContainer';
import { Services } from 'App/ServiceLocator';
import { getThumbnailData } from 'App/Reducers/DesignView/Selectors';
import { getSelectedVariantIdentifier } from 'App/Reducers/Configurator/Selectors';

const mapStateToProps = state => {
    return {
        Component: Thumbnail,
        selectedVariantIdentifier: getSelectedVariantIdentifier(state.configurator),
        thumbnails: getThumbnailData(state),
        selectedDesignViewIdentifier: get(state.designView.selectedDesignView, 'identifier'),
    };
};
const mapDispatchToProps = () => ({
    onThumbnailClick: identifier => Services.designData.selectDesignView(identifier),
});

export default containerConnect(mapStateToProps, mapDispatchToProps);
