Web: Components: Added propTypes for ContentRow component, added recommended bind`s for functions
This commit is contained in:
parent
c0d2546b00
commit
07d3457c3a
@ -72,11 +72,13 @@ const StyledOptionButton = styled.div`
|
||||
`;
|
||||
|
||||
class ContentRow extends React.PureComponent {
|
||||
constructor(props){
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
checked: this.props.checked
|
||||
}
|
||||
|
||||
this.handleContextMenu = this.handleContextMenu.bind(this);
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
@ -84,7 +86,7 @@ class ContentRow extends React.PureComponent {
|
||||
};
|
||||
|
||||
componentWillUnmount() {
|
||||
document.removeEventListener('contextmenu', this.handleContextMenu);
|
||||
document.removeEventListener('contextmenu', this.handleContextMenu);
|
||||
}
|
||||
|
||||
handleContextMenu = (event) => {
|
||||
@ -92,42 +94,37 @@ class ContentRow extends React.PureComponent {
|
||||
}
|
||||
|
||||
componentDidUpdate(prevProps, prevState) {
|
||||
if(this.props.checked !== prevProps.checked) {
|
||||
if (this.props.checked !== prevProps.checked) {
|
||||
/*console.log(`ContentRow componentDidUpdate
|
||||
this.props.checked=${this.props.checked}
|
||||
prevProps.checked=${prevProps.checked}
|
||||
this.state.checked=${this.state.checked}
|
||||
prevState.checked=${prevState.checked}`);*/
|
||||
|
||||
this.setState({checked: this.props.checked});
|
||||
this.setState({ checked: this.props.checked });
|
||||
}
|
||||
};
|
||||
|
||||
render () {
|
||||
// console.log("ContentRow render");
|
||||
|
||||
render() {
|
||||
//console.log("ContentRow render");
|
||||
|
||||
const { onSelect, avatarRole, avatarSource, avatarName, contextOptions, data, children } = this.props;
|
||||
|
||||
|
||||
return (
|
||||
<StyledContentRow {...this.props}>
|
||||
|
||||
<StyledCheckbox>
|
||||
<Checkbox isChecked={this.props.checked} onChange={(e) => {
|
||||
const checked = e.target.checked;
|
||||
|
||||
|
||||
onSelect && onSelect(checked, data);
|
||||
}} />
|
||||
</StyledCheckbox>
|
||||
|
||||
{(avatarRole !== '' || avatarSource !== '' || avatarName !== '') &&
|
||||
<StyledCheckbox>
|
||||
<Checkbox isChecked={this.props.checked} onChange={(e) => {
|
||||
const checked = e.target.checked;
|
||||
onSelect && onSelect(checked, data);
|
||||
}} />
|
||||
</StyledCheckbox>
|
||||
{(avatarRole !== '' || avatarSource !== '' || avatarName !== '') &&
|
||||
<StyledAvatar>
|
||||
<Avatar size='small' role={avatarRole || ''} source={avatarSource || ''} userName={avatarName || ''} />
|
||||
</StyledAvatar>
|
||||
}
|
||||
<StyledContent>{children}</StyledContent>
|
||||
{this.props.hasOwnProperty("contextOptions") &&
|
||||
{this.props.hasOwnProperty("contextOptions") &&
|
||||
<StyledOptionButton>
|
||||
<ContextMenuButton directionX='right' getData={() => contextOptions} />
|
||||
</StyledOptionButton>
|
||||
@ -138,9 +135,19 @@ class ContentRow extends React.PureComponent {
|
||||
}
|
||||
|
||||
ContentRow.propTypes = {
|
||||
onSelect: PropTypes.func,
|
||||
avatarRole: PropTypes.string,
|
||||
avatarSource: PropTypes.string,
|
||||
avatarName: PropTypes.string,
|
||||
contextOptions: PropTypes.func,
|
||||
data: PropTypes.object,
|
||||
children: PropTypes.element
|
||||
};
|
||||
|
||||
ContentRow.defaultProps = {
|
||||
avatarRole: '',
|
||||
avatarSource: '',
|
||||
avatarName: ''
|
||||
};
|
||||
|
||||
export default ContentRow;
|
Loading…
Reference in New Issue
Block a user