manuel/labyrinth-frontend
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Fix the ID update bug.

Browse source
This commit is contained in:
Manuel Friedli 2023-04-16 01:01:23 +02:00
parent 46c16b8bc7
commit 4b300004b9
4 changed files with 8 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
package.json
View file

@ -8,8 +8,8 @@
"devDependencies": { "devDependencies": {
"react-scripts": "1.0.0" "react-scripts": "1.0.0"
}, },
"name": "ljg0t8", "name": "a-maze-r",
"description": null, "description": "The A-Maze-Ing Generator!",
"version": "0.0.0", "version": "0.0.0",
"scripts": { "scripts": {
"start": "react-scripts start", "start": "react-scripts start",

2
src/App.js
View file

@ -6,7 +6,7 @@ export default function App() {
const [maze, setMaze] = useState({}); const [maze, setMaze] = useState({});
let title; let title;
if (!!maze.grid) { 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 { } else {
title = <span/>; title = <span/>;
} }

7
src/InputForm.js
View file

@ -20,7 +20,6 @@ export default function InputForm({handleResult}) {
.then(response => response.json()) .then(response => response.json())
.then(result => { .then(result => {
handleResult(result); handleResult(result);
// FIXME doesn't update the contents of the text input field.
setId(_ => result.id); setId(_ => result.id);
}) })
.catch(reason => { .catch(reason => {
@ -75,7 +74,7 @@ export default function InputForm({handleResult}) {
<form onSubmit={handleSubmit}> <form onSubmit={handleSubmit}>
<ValidatingInputNumberField id={"width"} <ValidatingInputNumberField id={"width"}
label={"Width"} label={"Width"}
defaultValue={width} value={width}
constraints={{ constraints={{
min: 2 min: 2
}} }}
@ -85,7 +84,7 @@ export default function InputForm({handleResult}) {
/><br/> /><br/>
<ValidatingInputNumberField id={"height"} <ValidatingInputNumberField id={"height"}
label={"Height"} label={"Height"}
defaultValue={height} value={height}
constraints={{ constraints={{
min: 2 min: 2
}} }}
@ -95,7 +94,7 @@ export default function InputForm({handleResult}) {
/><br/> /><br/>
<ValidatingInputNumberField id={"id"} <ValidatingInputNumberField id={"id"}
label={"ID (optional)"} label={"ID (optional)"}
defaultValue={id} value={id}
validatorFn={validateIdInput} validatorFn={validateIdInput}
disabled={status === "submitting"} disabled={status === "submitting"}
onChange={setId} onChange={setId}

6
src/ValidatingInputNumberField.js
View file

@ -3,7 +3,7 @@ import React, {useState} from 'react';
export default function ValidatingInputNumberField({ export default function ValidatingInputNumberField({
id, id,
label, label,
defaultValue = 0, value = 0,
constraints = {}, constraints = {},
validatorFn = (value) => { validatorFn = (value) => {
return {valid: true, value}; return {valid: true, value};
@ -13,7 +13,6 @@ export default function ValidatingInputNumberField({
} }
}) { }) {
const [error, setError] = useState(null); const [error, setError] = useState(null);
const [value, setValue] = useState(defaultValue);
const handleValueChange = (e) => { const handleValueChange = (e) => {
const value = e.target.value; const value = e.target.value;
@ -22,9 +21,8 @@ export default function ValidatingInputNumberField({
setError(validation.message); setError(validation.message);
} else { } else {
setError(null); setError(null);
onChange(validation.value);
} }
setValue(validation.value); onChange(validation.value);
}; };
let errorComponent; let errorComponent;
if (!!error) { if (!!error) {