Typechecking state transitions in a React/Redux app

And this is how you end up with 12 branches in a reducer, 4 in render, 4 state types, 4 action types, 4 action creators, plus the mapDispatchToProps definitions, all to handle a simple network call that could have been:

    const App : React.FunctionComponent = () => {
      const { loading, data, error } = useMagicFetch(...); 
    
      if (error) return <Error error={error} />;
      if (loading) return <Loader />;

      return <DataList data={data} />;
    }

But then you lose the benefits of serializable / replayable / shared state. Mind you, I've built multiple apps that ended up not too far from this, and am eagerly looking for alternatives.

That’s a lot of code for very little functionality.