Fix the ID update bug.
This commit is contained in:
parent
46c16b8bc7
commit
4b300004b9
4 changed files with 8 additions and 11 deletions
|
@ -8,8 +8,8 @@
|
|||
"devDependencies": {
|
||||
"react-scripts": "1.0.0"
|
||||
},
|
||||
"name": "ljg0t8",
|
||||
"description": null,
|
||||
"name": "a-maze-r",
|
||||
"description": "The A-Maze-Ing Generator!",
|
||||
"version": "0.0.0",
|
||||
"scripts": {
|
||||
"start": "react-scripts start",
|
||||
|
|
|
@ -6,7 +6,7 @@ export default function App() {
|
|||
const [maze, setMaze] = useState({});
|
||||
let title;
|
||||
if (!!maze.grid) {
|
||||
title = <h1>The Maze ({maze.width}x{maze.height})</h1>;
|
||||
title = <h1>The Maze ({maze.width}x{maze.height}, ID: {maze.id})</h1>;
|
||||
} else {
|
||||
title = <span/>;
|
||||
}
|
||||
|
|
|
@ -20,7 +20,6 @@ export default function InputForm({handleResult}) {
|
|||
.then(response => response.json())
|
||||
.then(result => {
|
||||
handleResult(result);
|
||||
// FIXME doesn't update the contents of the text input field.
|
||||
setId(_ => result.id);
|
||||
})
|
||||
.catch(reason => {
|
||||
|
@ -75,7 +74,7 @@ export default function InputForm({handleResult}) {
|
|||
<form onSubmit={handleSubmit}>
|
||||
<ValidatingInputNumberField id={"width"}
|
||||
label={"Width"}
|
||||
defaultValue={width}
|
||||
value={width}
|
||||
constraints={{
|
||||
min: 2
|
||||
}}
|
||||
|
@ -85,7 +84,7 @@ export default function InputForm({handleResult}) {
|
|||
/><br/>
|
||||
<ValidatingInputNumberField id={"height"}
|
||||
label={"Height"}
|
||||
defaultValue={height}
|
||||
value={height}
|
||||
constraints={{
|
||||
min: 2
|
||||
}}
|
||||
|
@ -95,7 +94,7 @@ export default function InputForm({handleResult}) {
|
|||
/><br/>
|
||||
<ValidatingInputNumberField id={"id"}
|
||||
label={"ID (optional)"}
|
||||
defaultValue={id}
|
||||
value={id}
|
||||
validatorFn={validateIdInput}
|
||||
disabled={status === "submitting"}
|
||||
onChange={setId}
|
||||
|
|
|
@ -3,7 +3,7 @@ import React, {useState} from 'react';
|
|||
export default function ValidatingInputNumberField({
|
||||
id,
|
||||
label,
|
||||
defaultValue = 0,
|
||||
value = 0,
|
||||
constraints = {},
|
||||
validatorFn = (value) => {
|
||||
return {valid: true, value};
|
||||
|
@ -13,7 +13,6 @@ export default function ValidatingInputNumberField({
|
|||
}
|
||||
}) {
|
||||
const [error, setError] = useState(null);
|
||||
const [value, setValue] = useState(defaultValue);
|
||||
|
||||
const handleValueChange = (e) => {
|
||||
const value = e.target.value;
|
||||
|
@ -22,9 +21,8 @@ export default function ValidatingInputNumberField({
|
|||
setError(validation.message);
|
||||
} else {
|
||||
setError(null);
|
||||
onChange(validation.value);
|
||||
}
|
||||
setValue(validation.value);
|
||||
onChange(validation.value);
|
||||
};
|
||||
let errorComponent;
|
||||
if (!!error) {
|
||||
|
|
Loading…
Reference in a new issue