Enable Mapping Save button when Valid #2859
Conversation
| @@ -7,13 +7,14 @@ class InputClickToEdit extends Component { | |||
| this.state = { | |||
| isEditing: null, | |||
| value: this.props.value, | |||
There was a problem hiding this comment.
maybe value could be called currentValue instead? currentValue vs. initial value makes this super understandable
| @@ -7,13 +7,14 @@ class InputClickToEdit extends Component { | |||
| this.state = { | |||
| isEditing: null, | |||
There was a problem hiding this comment.
my instinct would be to initialize isEditing as false- couldn't find a reason for it to be null ?
| @@ -88,7 +96,8 @@ const {func, bool, number, string} = PropTypes | |||
| InputClickToEdit.propTypes = { | |||
| wrapperClass: string.isRequired, | |||
There was a problem hiding this comment.
You could pull <div className={wrapperClass}> outside the if statement in the render function to stay DRY. :)
| @@ -63,7 +71,7 @@ class InputClickToEdit extends Component { | |||
| className="form-control input-sm provider--input" | |||
| defaultValue={value} | |||
| onBlur={this.handleInputBlur} | |||
| onKeyDown={this.handleKeyDown} | |||
| onKeyUp={this.handleKeyUp} | |||
| autoFocus={true} | |||
| onFocus={this.handleFocus} | |||
| ref={r => (this.inputRef = r)} | |||
There was a problem hiding this comment.
It doesn't look like you're using inputRef anymore?
There was a problem hiding this comment.
if tabIndex is not specified in props, then does the tabIndex of the input become undefined? could it default to 0? I'm afraid undefined would break things. https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex
…stead of onUpdate
| this.setState({ | ||
| isEditing: false, | ||
| initialValue: e.target.value, | ||
| }) | ||
| } | ||
|
|
||
| handleKeyDown = e => { |
There was a problem hiding this comment.
Lets define these event types also
| wrapperClass: string | ||
| value?: string | ||
| onChange?: (value: string) => void | ||
| onBlur: (value: string) => void |
There was a problem hiding this comment.
This onChange and onBlur probably take Event types.
There was a problem hiding this comment.
They do take strings types. I can change the name of those props if they are too similar to the props on the HTML input
| }) | ||
| }) | ||
|
|
||
| describe('instance methods', () => {}) |
| } | ||
|
|
||
| describe('Components.Shared.ProvidersTableRowNew', () => { | ||
| describe('rendering', () => {}) |
There was a problem hiding this comment.
Let's cut anything that isn't used.
| }) | ||
| }) | ||
|
|
||
| describe('instance methods', () => {}) |
… instead of e.currenttarget
Resolves #2808
The problem
InputClickToEdit was only calling the update function during onBlur.
The Solution
Create another update prop function for onKeyUpdate.