-
Notifications
You must be signed in to change notification settings - Fork 294
feat: Separating header click action from toggle click action. #229
Conversation
})(({style}) => style); | ||
|
||
class TreeNode extends PureComponent { | ||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
remove blank line
@@ -89,14 +124,16 @@ class TreeNode extends PureComponent { | |||
} | |||
|
|||
TreeNode.propTypes = { | |||
separateToggleEvent: PropTypes.bool, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
if you have props that are not required, you should add defaultProps
style: PropTypes.object.isRequired, | ||
node: PropTypes.object.isRequired, | ||
decorators: PropTypes.object.isRequired, | ||
animations: PropTypes.oneOfType([ | ||
PropTypes.object, | ||
PropTypes.bool | ||
]).isRequired | ||
PropTypes.bool, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
remove comma
PropTypes.bool | ||
]).isRequired | ||
PropTypes.bool, | ||
]).isRequired, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
remove comma
@@ -31,14 +31,16 @@ TreeBeard.propTypes = { | |||
PropTypes.object, | |||
PropTypes.bool | |||
]), | |||
separateToggleEvent: PropTypes.bool, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
add to defaultProps
onToggle: PropTypes.func, | ||
onClickHeader: PropTypes.func, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
add to defaultProps
decorators: PropTypes.object | ||
}; | ||
|
||
TreeBeard.defaultProps = { | ||
style: defaultTheme, | ||
animations: defaultAnimations, | ||
decorators: defaultDecorators | ||
decorators: defaultDecorators, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
remove comma
@@ -23,6 +23,7 @@ const Header = ({style, node}) => { | |||
Header.propTypes = { | |||
node: PropTypes.object, | |||
style: PropTypes.object, | |||
onClick: PropTypes.func, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
remove comma
const iconType = node.children ? 'folder' : 'file-text'; | ||
const iconClass = `fa fa-${iconType}`; | ||
const iconStyle = {marginRight: '5px'}; | ||
|
||
return ( | ||
<Div style={style.base}> | ||
<Div style={style.base} onClick={() => onClick()}> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
do onClick like this: onClick={onClick}
Please fix eslint errors. |
onClick: PropTypes.func | ||
onClick: PropTypes.func, | ||
onClickToggle: PropTypes.func, | ||
onClickHeader: PropTypes.func, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
remove comma
@@ -13,7 +13,8 @@ const Header = ({node, style}) => ( | |||
|
|||
Header.propTypes = { | |||
style: PropTypes.object, | |||
node: PropTypes.object.isRequired | |||
node: PropTypes.object.isRequired, | |||
onClick: PropTypes.func, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
remove comma
]).isRequired, | ||
node: PropTypes.object.isRequired | ||
node: PropTypes.object.isRequired, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
remove comma
animations: PropTypes.oneOfType([ | ||
PropTypes.object, | ||
PropTypes.bool | ||
PropTypes.bool, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
remove comma
animations() { | ||
const {animations, node} = this.props; | ||
if (!animations) { | ||
return { | ||
toggle: defaultAnimations.toggle(this.props, 0) | ||
toggle: defaultAnimations.toggle(this.props, 0), |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
remove comma
}; | ||
} | ||
const animation = Object.assign({}, animations, node.animations); | ||
return { | ||
toggle: animation.toggle(this.props), | ||
drawer: animation.drawer(this.props) | ||
drawer: animation.drawer(this.props), |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
remove comma
style, | ||
separateToggleEvent, | ||
onToggle, | ||
onClickHeader, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
remove comma
<Ul style={{...defaultTheme.tree.base, ...style.tree.base}}> | ||
{castArray(data).map(node => ( | ||
<TreeNode | ||
{...{decorators, node, onToggle, animations}} | ||
{...{decorators, node, separateToggleEvent, onToggle, onClickHeader, animations}} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
please create unit test when you press onClickHeader
or when you have onClickHeader
I close this PR because it'll implement in version 4.2.4, in beta version already implement. |
#177
I've add
separateToggleEvent
andonClickHeader
to properties.To enable
onClickHeader
we need to setseparateToggleEvent
to true.separateToggleEvent is to support the behavior we need without breaking change.