import * as React from 'react' ; import classNames from 'classnames' ; import { Checkbox } from 'superdesk-ui-framework/react' ; interface IProps { children : React . ReactNode ; uploading ? : boolean ; remove ? ( event ) : void ; icon ? : string ; selected ? : boolean ; toggleSelected ? ( ) : void ; onCheckboxClick ? ( e ) : void ; } export class GridItemThumb extends React . PureComponent < IProps > { onChange ( e ) { if ( this . props . toggleSelected != null ) { e . stopPropagation ( ) ; this . props . toggleSelected ( ) ; } } render ( ) { const classes = classNames ( 'sd-grid-item__thumb' , { 'sd-grid-item__thumb--uploading' : this . props . uploading , } ) ; return ( < div className = { classes } > { ! this . props . icon ? null : ( < div style = { { display : 'flex' , alignItems : 'center' , justifyContent : 'center' } } > < i className = { `icon--2x icon-${ this . props . icon }` } /> < /div>)} { this . props . remove && ( < a className = "icn-btn sd-grid-item__remove" onClick = { this . props . remove } > < i className = "icon-close-small" / > < /a>)} { this . props . toggleSelected == null ? null : ( < div className = "sd-grid-item__checkbox" onClick = { this . props . onCheckboxClick } > < Checkbox checked = { this . props . selected ?? false } label = { { text : '' } } onChange = { ( ) => this . onChange } /> < /div>)} { this . props . children } < /div>); } }