odyssey-client/src/store/ui/reducer.ts

57 lines
1.4 KiB
TypeScript

import { createSlice, PayloadAction } from "@reduxjs/toolkit";
import UIStore, { UILayer } from "./state";
const initialState: UIStore = {
layers: [],
};
export interface AddLayerPayload {
id: string;
data: UILayer;
}
export interface LayerActionPayload {
id: string;
}
const uiSlice = createSlice({
name: "ui",
initialState,
reducers: {
addLayer(state, action: PayloadAction<AddLayerPayload>) {
state.layers.push({ ...action.payload, visible: false });
},
removeLayer(state, action: PayloadAction<LayerActionPayload>) {
const index = state.layers.findIndex(
(layer) => layer.id == action.payload.id
);
if (index < 0) {
return;
}
state.layers.splice(index, 1);
},
showLayer(state, action: PayloadAction<LayerActionPayload>) {
const index = state.layers.findIndex(
(layer) => layer.id == action.payload.id
);
if (index < 0) {
return;
}
state.layers[index] = { ...state.layers[index], visible: true };
},
hideLayer(state, action: PayloadAction<LayerActionPayload>) {
const index = state.layers.findIndex(
(layer) => layer.id == action.payload.id
);
if (index < 0) {
return;
}
state.layers[index] = { ...state.layers[index], visible: false };
},
},
});
export const { addLayer, removeLayer, showLayer, hideLayer } = uiSlice.actions;
export default uiSlice.reducer;