components.buttons.ChangeSize.ChangeSize.jsx Maven / Gradle / Ivy

Go to download

Show more of this group Show more artifacts with this name
Show all versions of n2o-react

There is a newer version: 7.28.3

import React, { useContext } from 'react'
import PropTypes from 'prop-types'
import { connect } from 'react-redux'
import { UncontrolledButtonDropdown, DropdownToggle, DropdownMenu, DropdownItem } from 'reactstrap'

import { makeWidgetSizeSelector } from '../../../ducks/widgets/selectors'
import { DataSourceContext } from '../../../core/widget/context'
import { SIZES } from '../constants'

/**
 * Дропдаун для выбора размера(size) виджета
 * @reactProps {string} entityKey - id виджета, размер которого меняется
 * @reactProps {number} size - текущий размер(приходит из редакса)
 * @example
 * 
 */
function ChangeSizeComponent({ size: currentSize, icon, label, nested = false }) {
    const { setSize } = useContext(DataSourceContext)

    const items = SIZES.map((size, i) => {
        const onClick = () => setSize(size)

        return (
            
                
                    {currentSize === size && }
                
                {size}
            
        )
    })

    return (
        
            
                
                    
                        
                            {icon && }
                            {label}
                        
                        {items}
                    

                

            

        
    )
}
ChangeSizeComponent.propTypes = {
    size: PropTypes.number,
    icon: PropTypes.string,
}

const mapStateToProps = (state, { entityKey: widgetId }) => ({
    size: makeWidgetSizeSelector(widgetId)(state),
})

const ChangeSize = connect(mapStateToProps)(ChangeSizeComponent)

export { ChangeSize }
export { ChangeSizeComponent }