Integration with Redux

[ghengeveld]

Given that many React applications use Redux, integration with Redux would be beneficial for a lot of people and lower the barrier to entry.

The goal is to keep the React Async state in the global Redux store so it can be integrated with the rest of the application state.

React Async already uses a reducer internally, so integration with Redux should be fairly straightforward. We can take inspiration from Redux Form.

[Avi98]

hi, @ghengeveld if no one is working I can start working on it.

[ghengeveld]

Yes please, if you will. I'm currently focused on getting the DevTools released, so don't really have time to work on this.

[CMCDragonkai]

I was interested in this, right now I model async state in Redux using a custom type like:

type Async<D, I = any, E = Error> =
  | AsyncInitial
  | AsyncProgress<I>
  | AsyncSuccess<D, I>
  | AsyncFail<I, E>;

type AsyncInitial = { type: 'Initial' };
type AsyncProgress<I = any> = { type: 'Progress'; id?: I };
type AsyncSuccess<D = any, I = any> = { type: 'Success'; id?: I; data: D };
type AsyncFail<I = any, E = Error> = { type: 'Fail'; id?: I; error: E };

And this is reified into redux state in order to allow components to render conditionally on async state machine.

But I wanted more control over the async type, and was hoping for a richer type that could be cancelled... etc.

[ghengeveld]

Hi @CMCDragonkai, that's one of the goals for Async Library. We want to define a rich data model for asynchronous UI state, with plenty of flexibility for enhancement, and a lot of generally useful features out of the box. That includes things like cancellation.

At the moment you can take a look / get involved in the work that's already underway to implement React Async in TypeScript. The types you're looking for are here.

If you don't want to wait for the TypeScript migration to be done, you can start using the existing types in the library, these should be importable from "react-async/dist-types/index.d.ts".

It would be very welcome if you could take a stab at integrating this with Redux.