reactjrx 1.105.1 → 1.107.0

package/dist/index.cjs

@@ -71,6 +71,9 @@ function useObserve(source$, optionsOrDeps, maybeDeps) {
   );
   const sourceRef = useLiveRef(source$);
   const optionsRef = useLiveRef(options);
+  const getSnapshot = React.useCallback(() => {
+    return valueRef.current;
+  }, []);
   const subscribe = React.useCallback(
     (next) => {
       const source = sourceRef.current;
@@ -100,10 +103,7 @@ function useObserve(source$, optionsOrDeps, maybeDeps) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [...deps]
   );
-  const getSnapshot = React.useCallback(() => {
-    return valueRef.current;
-  }, []);
-  const result = React.useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
+  const result = React.useSyncExternalStore(subscribe, getSnapshot);
   return result;
 }
 function useSubscribe(source, deps = []) {
@@ -161,9 +161,8 @@ const useSubject = ({
   }, [completeOnUnmountRef, onBeforeCompleteRef, subject]);
   return subject;
 };
-const useObserveCallback = () => {
+const useObservableCallback = () => {
   const subject = useSubject();
-  const event$ = useLiveRef(subject.current.asObservable());
   const trigger = React.useCallback(
     (arg) => {
       subject.current.next(arg);
@@ -171,7 +170,7 @@ const useObserveCallback = () => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
     []
   );
-  return [event$.current, trigger];
+  return [subject.current, trigger];
 };
 const useBehaviorSubject = (state) => {
   const subject = useConstant(() => new rxjs.BehaviorSubject(state));
@@ -709,13 +708,20 @@ function useQuery$(options, queryClient) {
   return result;
 }
 function useMutation$(options, queryClient) {
+  const stateSubject = useBehaviorSubject({
+    status: "idle",
+    isPending: false,
+    isError: false,
+    isSuccess: false,
+    isIdle: true
+  });
   const mutationFnAsync = (variables) => {
     let lastData;
     return new Promise((resolve, reject) => {
       const source = typeof options.mutationFn === "function" ? options.mutationFn(variables) : options.mutationFn;
       source.pipe(rxjs.take(1)).subscribe({
         next: (data) => {
-          lastData = data;
+          lastData = { value: data };
         },
         error: (error) => {
           reject(error);
@@ -723,7 +729,7 @@ function useMutation$(options, queryClient) {
         complete: () => {
           if (lastData === void 0)
             return reject(new Error("Stream completed without any data"));
-          resolve(lastData);
+          resolve(lastData.value);
         }
       });
     });
@@ -735,7 +741,11 @@ function useMutation$(options, queryClient) {
     },
     queryClient
   );
-  return result;
+  const { status, isPending, isError, isSuccess, isIdle } = result;
+  React.useEffect(() => {
+    stateSubject.current.next({ status, isPending, isError, isSuccess, isIdle });
+  }, [status, isPending, isError, isSuccess, isIdle, stateSubject]);
+  return { ...result, state$: stateSubject.current };
 }
 function hasObjectPrototype(o) {
   return Object.prototype.toString.call(o) === "[object Object]";
@@ -3506,9 +3516,9 @@ exports.useLiveRef = useLiveRef;
 exports.useMount = useMount;
 exports.useMutation = useMutation;
 exports.useMutation$ = useMutation$;
+exports.useObservableCallback = useObservableCallback;
 exports.useObservableState = useObservableState;
 exports.useObserve = useObserve;
-exports.useObserveCallback = useObserveCallback;
 exports.usePersistSignals = usePersistSignals;
 exports.useQuery = useQuery;
 exports.useQuery$ = useQuery$;

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 export * from './lib/binding/useObserve';
 export * from './lib/binding/useSubscribe';
-export * from './lib/binding/useObservableEvent';
+export * from './lib/binding/useObservableCallback';
 export * from './lib/binding/useObservableState';
 export * from './lib/binding/useSubject';
 export * from './lib/binding/useBehaviorSubject';

package/dist/index.js

@@ -53,6 +53,9 @@ function useObserve(source$, optionsOrDeps, maybeDeps) {
   );
   const sourceRef = useLiveRef(source$);
   const optionsRef = useLiveRef(options);
+  const getSnapshot = useCallback(() => {
+    return valueRef.current;
+  }, []);
   const subscribe = useCallback(
     (next) => {
       const source = sourceRef.current;
@@ -82,10 +85,7 @@ function useObserve(source$, optionsOrDeps, maybeDeps) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [...deps]
   );
-  const getSnapshot = useCallback(() => {
-    return valueRef.current;
-  }, []);
-  const result = useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
+  const result = useSyncExternalStore(subscribe, getSnapshot);
   return result;
 }
 function useSubscribe(source, deps = []) {
@@ -143,9 +143,8 @@ const useSubject = ({
   }, [completeOnUnmountRef, onBeforeCompleteRef, subject]);
   return subject;
 };
-const useObserveCallback = () => {
+const useObservableCallback = () => {
   const subject = useSubject();
-  const event$ = useLiveRef(subject.current.asObservable());
   const trigger = useCallback(
     (arg) => {
       subject.current.next(arg);
@@ -153,7 +152,7 @@ const useObserveCallback = () => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
     []
   );
-  return [event$.current, trigger];
+  return [subject.current, trigger];
 };
 const useBehaviorSubject = (state) => {
   const subject = useConstant(() => new BehaviorSubject(state));
@@ -691,13 +690,20 @@ function useQuery$(options, queryClient) {
   return result;
 }
 function useMutation$(options, queryClient) {
+  const stateSubject = useBehaviorSubject({
+    status: "idle",
+    isPending: false,
+    isError: false,
+    isSuccess: false,
+    isIdle: true
+  });
   const mutationFnAsync = (variables) => {
     let lastData;
     return new Promise((resolve, reject) => {
       const source = typeof options.mutationFn === "function" ? options.mutationFn(variables) : options.mutationFn;
       source.pipe(take(1)).subscribe({
         next: (data) => {
-          lastData = data;
+          lastData = { value: data };
         },
         error: (error) => {
           reject(error);
@@ -705,7 +711,7 @@ function useMutation$(options, queryClient) {
         complete: () => {
           if (lastData === void 0)
             return reject(new Error("Stream completed without any data"));
-          resolve(lastData);
+          resolve(lastData.value);
         }
       });
     });
@@ -717,7 +723,11 @@ function useMutation$(options, queryClient) {
     },
     queryClient
   );
-  return result;
+  const { status, isPending, isError, isSuccess, isIdle } = result;
+  useEffect(() => {
+    stateSubject.current.next({ status, isPending, isError, isSuccess, isIdle });
+  }, [status, isPending, isError, isSuccess, isIdle, stateSubject]);
+  return { ...result, state$: stateSubject.current };
 }
 function hasObjectPrototype(o) {
   return Object.prototype.toString.call(o) === "[object Object]";
@@ -3489,9 +3499,9 @@ export {
   useMount,
   useMutation,
   useMutation$,
+  useObservableCallback,
   useObservableState,
   useObserve,
-  useObserveCallback,
   usePersistSignals,
   useQuery,
   useQuery$,

package/dist/lib/binding/useObservableCallback.d.ts

@@ -0,0 +1,5 @@
+import { Observable } from 'rxjs';
+/**
+ * This creates an event handler and an observable that represents calls to that handler.
+ */
+export declare const useObservableCallback: <T = void>() => readonly [Observable<T>, (arg: T) => void];

package/dist/lib/queries/useMutation$.d.ts

@@ -1,5 +1,77 @@
-import { DefaultError, QueryClient, UseMutationOptions } from '@tanstack/react-query';
+import { DefaultError, QueryClient, UseMutationOptions, UseMutationResult } from '@tanstack/react-query';
 import { Observable } from 'rxjs';
 export declare function useMutation$<TData = unknown, TError = DefaultError, TVariables = void, TContext = unknown>(options: Omit<UseMutationOptions<TData, TError, TVariables, TContext>, "mutationFn"> & {
     mutationFn: ((variables: TVariables) => Observable<TData>) | Observable<TData>;
-}, queryClient?: QueryClient): import('@tanstack/react-query').UseMutationResult<TData, TError, TVariables, TContext>;
+}, queryClient?: QueryClient): {
+    state$: import('rxjs').BehaviorSubject<Pick<UseMutationResult<TData, TError, TVariables, TContext>, "status" | "isPending" | "isError" | "isSuccess" | "isIdle">>;
+    data: undefined;
+    variables: undefined;
+    error: null;
+    isError: false;
+    isIdle: true;
+    isPending: false;
+    isSuccess: false;
+    status: "idle";
+    mutate: import('@tanstack/react-query').UseMutateFunction<TData, TError, TVariables, TContext>;
+    reset: () => void;
+    context: TContext | undefined;
+    failureCount: number;
+    failureReason: TError | null;
+    isPaused: boolean;
+    submittedAt: number;
+    mutateAsync: import('@tanstack/react-query').UseMutateAsyncFunction<TData, TError, TVariables, TContext>;
+} | {
+    state$: import('rxjs').BehaviorSubject<Pick<UseMutationResult<TData, TError, TVariables, TContext>, "status" | "isPending" | "isError" | "isSuccess" | "isIdle">>;
+    data: undefined;
+    variables: TVariables;
+    error: null;
+    isError: false;
+    isIdle: false;
+    isPending: true;
+    isSuccess: false;
+    status: "pending";
+    mutate: import('@tanstack/react-query').UseMutateFunction<TData, TError, TVariables, TContext>;
+    reset: () => void;
+    context: TContext | undefined;
+    failureCount: number;
+    failureReason: TError | null;
+    isPaused: boolean;
+    submittedAt: number;
+    mutateAsync: import('@tanstack/react-query').UseMutateAsyncFunction<TData, TError, TVariables, TContext>;
+} | {
+    state$: import('rxjs').BehaviorSubject<Pick<UseMutationResult<TData, TError, TVariables, TContext>, "status" | "isPending" | "isError" | "isSuccess" | "isIdle">>;
+    data: undefined;
+    error: TError;
+    variables: TVariables;
+    isError: true;
+    isIdle: false;
+    isPending: false;
+    isSuccess: false;
+    status: "error";
+    mutate: import('@tanstack/react-query').UseMutateFunction<TData, TError, TVariables, TContext>;
+    reset: () => void;
+    context: TContext | undefined;
+    failureCount: number;
+    failureReason: TError | null;
+    isPaused: boolean;
+    submittedAt: number;
+    mutateAsync: import('@tanstack/react-query').UseMutateAsyncFunction<TData, TError, TVariables, TContext>;
+} | {
+    state$: import('rxjs').BehaviorSubject<Pick<UseMutationResult<TData, TError, TVariables, TContext>, "status" | "isPending" | "isError" | "isSuccess" | "isIdle">>;
+    data: TData;
+    error: null;
+    variables: TVariables;
+    isError: false;
+    isIdle: false;
+    isPending: false;
+    isSuccess: true;
+    status: "success";
+    mutate: import('@tanstack/react-query').UseMutateFunction<TData, TError, TVariables, TContext>;
+    reset: () => void;
+    context: TContext | undefined;
+    failureCount: number;
+    failureReason: TError | null;
+    isPaused: boolean;
+    submittedAt: number;
+    mutateAsync: import('@tanstack/react-query').UseMutateAsyncFunction<TData, TError, TVariables, TContext>;
+};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "reactjrx",
   "private": false,
-  "version": "1.105.1",
+  "version": "1.107.0",
   "type": "module",
   "files": [
     "dist"

package/dist/lib/binding/useObservableEvent.d.ts

@@ -1,4 +0,0 @@
-/**
- * This creates an event handler and an observable that represents calls to that handler.
- */
-export declare const useObserveCallback: <T = void>() => readonly [import('rxjs').Observable<T>, (arg: T) => void];