Ok so i have this very basic example of redux state

const initialState = {
  good: 0,
  ok: 0,
  bad: 0,
};

const counterReducer = (state = initialState, action) => {
  console.log(action);
  console.log(state);
  console.log(initialState);
  console.log(state.good);

  switch (action.type) {
    case "GOOD":
      return { ...state, good: good + 1 };
    case "OK":
      return { ...state, ok: ok + 1 };
    case "BAD":
      return { ...state, bad: bad + 1 };

    case "ZERO":
      return state;
    default:
      return state;
  }
};

export default counterReducer;

i'm trying to change only one property of the state object on an onclick function named like this

const store = createStore(reducer);

const App = () => {
  const addGood = () => {
    store.dispatch({
      type: "GOOD",
    });
  };
  const addBad = () => {
    store.dispatch({ type: "BAD" });
  };
  const addOk = () => {
    store.dispatch({ type: "OK" });
  };

  return (
    <div>
      <button onClick={addGood}>good</button>
      <button onClick={addOk}>ok</button>
      <button onClick={addBad}>bad</button>
      <button>reset stats</button>
      <div>good {store.getState().good}</div>
      <div>ok {store.getState().ok}</div>
      <div>bad{store.getState().bad}</div>
    </div>
  );
};

const renderApp = () => {
  ReactDOM.render(<App />, document.getElementById("root"));
};

renderApp();
store.subscribe(renderApp);

but when i try to change the value of any of the properties it doesn't work , for example good , ok , bad but it crashes my app if i do so with good is not defined error