Move to Typescript.

This commit is contained in:
Manuel Friedli 2023-04-17 02:43:36 +02:00
parent 34618860a4
commit ac964ddd3f
16 changed files with 482 additions and 119 deletions

View file

@ -1,40 +0,0 @@
import React, {useReducer} from 'react';
import Maze from "./Maze";
import InputForm from "./InputForm";
import reduce from "./reducer";
import MessageBanner from "./MessageBanner";
export default function App() {
const [state, dispatch] = useReducer(reduce, {
maze: null,
loading: false,
errorMessage: null,
showSolution: false,
userPath: []
},
undefined);
const hasValidMaze = !!state.maze;
return (
<>
<MessageBanner state={state}
dispatch={dispatch}/>
<InputForm state={state}
dispatch={dispatch}/>
{hasValidMaze &&
<>
<h1>The Maze ({state.maze.width}x{state.maze.height}, ID: {state.maze.id})</h1>
<input type={"checkbox"}
onChange={(e) => {
dispatch({
type: 'toggled_show_solution',
value: e.target.checked
});
}}
id={"showSolution"}/><label htmlFor="showSolution">Show Solution</label>
<Maze state={state}
dispatch={dispatch}/>
</>
}
</>
);
}