Web: Components: Added propTypes for ContentRow component, added recommended bind`s for functions

This commit is contained in:
Ilya Oleshko 2019-07-25 12:37:46 +03:00
parent c0d2546b00
commit 07d3457c3a

View File

@ -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;