Fix Incorrect State Update in Sketch/index.js, Typo in Image Selector

[mattxwang]

This PR addresses two bugs (and leaves a third unsolved, but slightly-better solved):

1. As @jamieliu386 reported, there is a bug involving controlled vs. uncontrolled inputs when the Create, Edit, or Delete Sketch modals are left. This is because previously, they (for some reason) updated the input values in the modal after they are closed, which is when the internals are unmounted by react-modal. I fixed this by... not doing that. This resolves the problem for EditSketch and ConfirmDelete, but there are lingering problems in CreateSketch (which I will not deal with in this PR).

2. There was a small typo involving maxWidth instead of max-width for a CSS-in-JS property in ImageSelector; this fixes that typo.

A general observation is that all of these modals are really really poorly coded and probably need an entire refactor. Slow and steady wins the race.

[krashanoff]

Hey Matt, thanks for handling this card. I noticed that you mentioned createSketch still has the problem so I tested locally and observed the errors once before it randomly stopped throwing the messages. Really strange stuff, can you reproduce?

[mattxwang]

I noticed that you mentioned createSketch still has the problem so I tested locally and observed the errors once before it randomly stopped throwing the messages. Really strange stuff, can you reproduce?

Do you mean for the CreateSketch workflow? My guess on the problem is that the ReactModal has an onClose that changes the state of the Sketch/index component, but when the sketch is created, the CreateSketchModal component handles the redirect itself: thus, you get a race condition of sorts where the page may or may not still be on Sketch/index when () => this.setState({ createSketchModalOpen: false }) (line 178 in Sketch/index) is called. So you'll get inconsistent results, depending on how quickly the Redirect might be triggered.

Solution probably involves the root Sketch/index to handle the redirect so it can clean itself up properly; but, I think in general the problem is that the modals (especially CreateSketch) all need some refactoring.

[krashanoff]

Solution probably involves the root Sketch/index to handle the redirect so it can clean itself up properly; but, I think in general the problem is that the modals (especially CreateSketch) all need some refactoring.

Yeah, that seems to be the case. Well I think this fix is acceptable for the time being, though we will eventually need to move all redirect handling up a level in component hierarchy relative to what we are currently doing. In any case, LGTM, but would still like to get input from @jamieliu386

[jamieliu386]

LGTM as well!