[RxJs] Question: Any guidelines in using Recoil with RxJs

[ShravanSunder]

Any guidelines in using Recoil with RxJs? I was trying to find documentation or articles on how this would work but haven't come across any. I have some familiarity with Redux-Observable and find that it makes push based events easy to deal with.

[drarmstr]

Would be interesting to hear from anyone mixing these libraries?

Assuming you follow the Recoil interface (i.e. not mutating objects stored in Recoil state, ...) then I would expect they should be able to coexist in the same application. Can't say any advice or patterns trying to mix observables and selectors. Looks like there are some guides out there for using RxJS with React Hooks for state management that may be applicable.

[ShravanSunder]

It sounds like I should use rxjs with hooks first and get used to the patterns. Along the way if I have to lift up any state I could try to use the same methodology to lift up the state with recoil? I could experiment with that idea for now.

[ShravanSunder]

@drarmstr could you make this into a discussion? I'd like to post some ideas to spark a discussion and check my approaches.

[drarmstr]

We haven't yet enabled GitHub Discussions for this repository, if that's what you mean. We've started talking about it, though.

@drarmstr could you make this into a discussion? I'd like to post some ideas to spark a discussion and check my approaches.

[luisanton-io]

Would be interesting to hear from anyone mixing these libraries?

Hello there. Coincidentally I have implemented a small package in Typescript using Recoil and RxJS.
I called it Recoil Nexus. The goal was being able to update atoms outside of React: it works with a JSX element working as a "bridge". Live example here.

All is working up to recoil version 0.4.0.

Of course I'd love it if meanwhile anyone wants to try it out or leave any feedback.
Cheers!
L

[ShravanSunder]

Of course I'd love it if meanwhile anyone wants to try it out or leave any feedback.

i'll check it out! Right now i'm experimenting using observable-hooks to bridge recoil and observables.

• The issues i ran into since recoil is immutable you can't store any observables in them
• The other issue is creating an observable from a state from recoil seems to create longer update cycles, perhaps i'm using it wrong.

I created the following hooks to create observables from recoil atoms.

export const useSubjectFromRecoil = <T>(atom: RecoilValueReadOnly<RecoilSubject<T>>): SubjectWithValue<T> => {
   const recoilState = useRecoilValue(atom);
   const subject$ = recoilState.getSubject();
   // const subject$ = useObservable((input$: Observable<[T]>) => input$.pipe(map(([value]) => value)), [recoilState]) as BehaviorSubject<T>;

   return { subject$, next: recoilState.next };
};

export const useSubjectTransformRecoil = <T>(
   atom: RecoilValueReadOnly<RecoilSubject<T>>,
   operator: TTransform<T>,
   ...otherObservables$: Observable<any>[]
): SubjectWithTransform<T> => {
   const recoilState = useRecoilValue(atom);
   
   // todo: it doens't make sense to send this to the recoil state
   const subject$ = useObservable(() => operator(recoilState.getSubject(), ...otherObservables$)) as BehaviorSubject<T>;
   // const value = useObservableState(subject$, recoilState);

   return { subject$, next: recoilState.next, source$: recoilState.getSubject() };
};

it seems to be causing multiple triggers when i use it. In addition, the cycle time is causes strange intermittent states during updates.

[ShravanSunder]

@drarmstr could you move this to discussion? #