implement test VCO redux state and actions

src/features/timbre/Timbre.js

@@ -0,0 +1,6 @@
+import React from 'react';
+import VCO from './parameters/VCO';
+
+export function Timbre(props) {
+    return <VCO id="vco1" />;
+}

src/features/timbre/parameters/VCO.js

@@ -0,0 +1,42 @@
+import React from 'react';
+import { useSelector, useDispatch } from 'react-redux';
+import { selectById, parameterUpdated } from '../timbreSlice.js';
+
+export default function VCO(props) {
+    const parameters = useSelector((state) => selectById(state, props.id));
+
+    const dispatch = useDispatch();
+    return (
+        <div>
+            <span>Current Waveform {parameters.waveform} </span>
+            <button
+                aria-label="Increment value"
+                onClick={() =>
+                    dispatch(
+                        parameterUpdated({
+                            id: 'vco1',
+                            changes: { waveform: 'Triangle' },
+                        })
+                    )
+                }>
+                {' '}
+                Set Waveform to Triangle{' '}
+            </button>
+            <span>Current Mod Value {parameters.mod} </span>
+            <input
+                type="range"
+                min="0"
+                max="100"
+                value={parameters.mod}
+                onChange={(e) =>
+                    dispatch(
+                        parameterUpdated({
+                            id: 'vco1',
+                            changes: { mod: e.target.value },
+                        })
+                    )
+                }
+            />
+        </div>
+    );
+}

src/features/timbre/timbreSlice.js

@@ -0,0 +1,32 @@
+import { createSlice, createEntityAdapter } from '@reduxjs/toolkit';
+
+const timbreAdapter = createEntityAdapter({});
+
+const timbreSlice = createSlice({
+    name: 'timbre',
+    initialState: timbreAdapter.getInitialState({
+        ids: ['vco1'],
+        entities: {
+            vco1: {
+                id: 'vco1',
+                waveform: 'Saw',
+                mod: 0,
+            },
+        },
+    }),
+    reducers: {
+        parameterAdded: timbreAdapter.addOne,
+        parameterUpdated: timbreAdapter.updateOne,
+    },
+});
+
+export const {
+    selectById,
+    selectAll,
+    selectEntities,
+    selectIds,
+} = timbreAdapter.getSelectors((state) => state.timbre);
+
+export const { parameterAdded, parameterUpdated } = timbreSlice.actions;
+
+export default timbreSlice.reducer;