Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
Extracted base logic for the counter <button>s into new widget <Butto…
…nForCounter>, so that the logic for future new functionality for all instances would be DRY.
  • Loading branch information
maratbn committed Aug 5, 2018
1 parent 2287c16 commit e5ddcfe
Showing 1 changed file with 19 additions and 4 deletions.
23 changes: 19 additions & 4 deletions webpack_in/entry.jsx
Expand Up @@ -232,6 +232,19 @@ class ListWidget extends React.Component {
}
}

class ButtonForCounter extends React.Component {
render() {
return (<button onClick={ () => {
this.props.onCount();
}}>{ this.props.caption }</button>);
}
}

ButtonForCounter.propTypes = {
caption: PropTypes.string.isRequired,
onCount: PropTypes.func.isRequired
};

class ColorComponentEntry extends React.Component {
render() {
return (
Expand Down Expand Up @@ -276,24 +289,26 @@ class ColorComponentEntry extends React.Component {

this.props.onChangeValue(convertValue(strValueEntered));
}} />
<button onClick={ () => {
<ButtonForCounter caption="&#9650;"
onCount={ () => {
const valueNew = this.props.value + 1;

if (valueNew > 255) {
return;
}

this.props.onChangeValue(valueNew);
}}>&#9650;</button>
<button onClick={ () => {
}} />
<ButtonForCounter caption="&#9660;"
onCount={ () => {
const valueNew = this.props.value - 1;

if (valueNew < 0) {
return;
}

this.props.onChangeValue(valueNew);
}}>&#9660;</button>
}} />
</div>
);
}
Expand Down

0 comments on commit e5ddcfe

Please sign in to comment.