Fix display of control points.

Apparently redux state objects *must* be objects.
This commit is contained in:
Dan Albert 2022-03-01 23:39:49 -08:00
parent dba2699b7e
commit 1cd77a4a77
2 changed files with 9 additions and 3 deletions

View File

@ -3,14 +3,20 @@ import { PayloadAction, createSlice } from "@reduxjs/toolkit";
import { ControlPoint } from "./controlpoint"; import { ControlPoint } from "./controlpoint";
import { RootState } from "../app/store"; import { RootState } from "../app/store";
const initialState: ControlPoint[] = []; interface ControlPointsState {
controlPoints: ControlPoint[];
}
const initialState: ControlPointsState = {
controlPoints: [],
};
export const controlPointsSlice = createSlice({ export const controlPointsSlice = createSlice({
name: "controlPoints", name: "controlPoints",
initialState, initialState,
reducers: { reducers: {
setControlPoints: (state, action: PayloadAction<ControlPoint[]>) => { setControlPoints: (state, action: PayloadAction<ControlPoint[]>) => {
state = action.payload; state.controlPoints = action.payload;
}, },
}, },
}); });

View File

@ -7,7 +7,7 @@ export default function ControlPointsLayer() {
const controlPoints = useAppSelector(selectControlPoints); const controlPoints = useAppSelector(selectControlPoints);
return ( return (
<LayerGroup> <LayerGroup>
{controlPoints.map((controlPoint) => { {controlPoints.controlPoints.map((controlPoint) => {
return ( return (
<ControlPoint key={controlPoint.name} controlPoint={controlPoint} /> <ControlPoint key={controlPoint.name} controlPoint={controlPoint} />
); );