@soundxyz/graphql-react-ws - npm Package Compare versions

Comparing version 1.0.0-alpha-d9c448c.0 to 1.0.0-alpha-eb2ba91.0

CHANGELOG.md

 # @soundxyz/graphql-react-ws
 
-## 1.0.0-alpha-d9c448c.0
+## 1.0.0-alpha-eb2ba91.0
 
@@ -5,0 +5,0 @@ ### Major Changes

dist/client.d.ts

@@ -1,2 +0,1 @@
-/// <reference types="react" />
 import { ClientOptions, ExecutionResult } from 'graphql-ws';
@@ -44,5 +43,4 @@ import type { ResultOf, StringDocumentNode, VariablesOf } from '@soundxyz/gql-string';
         data: ExecutionResultWithData<ResultOf<Doc_1>> | null;
-        latestData: import("react").MutableRefObject<ExecutionResultWithData<ResultOf<Doc_1>> | null>;
         error: ExecutionResultWithErrors<ResultOf<Doc_1>> | null;
-        latestError: import("react").MutableRefObject<ExecutionResultWithErrors<ResultOf<Doc_1>> | null>;
+        store: SubscriptionStore<Doc_1>;
     };
@@ -52,1 +50,5 @@ };
 export type OnError<Doc extends StringDocumentNode> = (resultWithError: ExecutionResultWithErrors<ResultOf<Doc>>) => void;
+export type SubscriptionStore<Doc extends StringDocumentNode> = {
+    data: ExecutionResultWithData<ResultOf<Doc>> | null;
+    error: ExecutionResultWithErrors<ResultOf<Doc>> | null;
+};

dist/client.js

 import { createClient } from 'graphql-ws';
-import { useLatestRef, useStableCallback, useStableValue } from './utils.js';
-import { useState, useMemo, useEffect } from 'react';
+import { useMemo, useEffect } from 'react';
+import { proxy } from 'valtio';
+import { useProxySnapshot, useStableCallback, useStableValue } from './utils.js';
 
@@ -120,2 +121,3 @@ function GraphQLReactWS({
   }
+  const subscriptionStores = {};
   function useSubscription({
@@ -127,6 +129,8 @@ query,
   }) {
-    const [data, setData] = useState(null);
-    const latestData = useLatestRef(data);
-    const [error, setError] = useState(null);
-    const latestError = useLatestRef(error);
+    var _a;
+    const store = subscriptionStores[_a = query + JSON.stringify(variables)] || (subscriptionStores[_a] = proxy({
+      data: null,
+      error: null
+    }));
+    const { data, error } = useProxySnapshot(store);
     const onDataCallback = useStableCallback((resultWithData) => {
@@ -169,7 +173,5 @@ if (!onData)
               onDataCallback(result);
-              setData(result);
-              latestData.current = result;
-              if (!errors && latestError.current) {
-                setError(null);
-                latestError.current = null;
+              store.data = result;
+              if (!errors && store.error) {
+                store.error = null;
               }
@@ -184,4 +186,3 @@ }
               onErrorCallback(result);
-              setError(result);
-              latestError.current = result;
+              store.error = result;
             }
@@ -202,5 +203,4 @@ }
       data,
-      latestData,
       error,
-      latestError
+      store
     };
@@ -207,0 +207,0 @@ }

dist/package.json

 {
   "name": "@soundxyz/graphql-react-ws",
-  "version": "1.0.0-alpha-d9c448c.0",
+  "version": "1.0.0-alpha-eb2ba91.0",
   "sideEffects": false,
@@ -5,0 +5,0 @@ "peerDependencies": {

dist/utils.d.ts

@@ -5,1 +5,2 @@ import { MutableRefObject } from 'react';
 export declare function useStableCallback<Cb extends (...args: any[]) => unknown>(cb: Cb): Cb;
+export declare function useProxySnapshot<T extends object>(proxyObject: T): T;

dist/utils.js

@@ -0,3 +1,4 @@
+import equal from 'fast-deep-equal';
 import { useRef, useMemo, useCallback } from 'react';
-import equal from 'fast-deep-equal';
+import { useSnapshot } from 'valtio';
 
@@ -29,3 +30,6 @@ function useStableValue(obj) {
 }
+function useProxySnapshot(proxyObject) {
+  return useSnapshot(proxyObject);
+}
 
-export { useLatestRef, useStableCallback, useStableValue };
+export { useLatestRef, useProxySnapshot, useStableCallback, useStableValue };

package.json

 {
   "name": "@soundxyz/graphql-react-ws",
-  "version": "1.0.0-alpha-d9c448c.0",
+  "version": "1.0.0-alpha-eb2ba91.0",
   "license": "MIT",
@@ -5,0 +5,0 @@ "author": "PabloSzx <[e-mail]>",

src/client.ts

@@ -1,6 +0,8 @@
-import { createClient, ClientOptions, SubscribePayload, ExecutionResult } from 'graphql-ws';
+import { ClientOptions, createClient, ExecutionResult, SubscribePayload } from 'graphql-ws';
+import { useEffect, useMemo } from 'react';
+import { proxy } from 'valtio';
+
+import { useProxySnapshot, useStableCallback, useStableValue } from './utils';
+
 import type { ResultOf, StringDocumentNode, VariablesOf } from '@soundxyz/gql-string';
-import { useLatestRef, useStableCallback, useStableValue } from './utils';
-import { useEffect, useMemo, useState } from 'react';
-
 export type ExecutionResultWithData<Data> = Omit<ExecutionResult<unknown, unknown>, 'data'> & {
@@ -185,2 +187,4 @@ data: Data;
 
+  const subscriptionStores: Record<string, SubscriptionStore<StringDocumentNode>> = {};
+
   function useSubscription<Doc extends StringDocumentNode>({
@@ -198,10 +202,10 @@ query,
     : { variables: VariablesOf<Doc> | false })) {
-    const [data, setData] = useState<ExecutionResultWithData<ResultOf<Doc>> | null>(null);
+    const store: SubscriptionStore<Doc> = (subscriptionStores[query + JSON.stringify(variables)] ||=
+      proxy<SubscriptionStore<Doc>>({
+        data: null,
+        error: null,
+      }));
 
-    const latestData = useLatestRef(data);
+    const { data, error } = useProxySnapshot(store);
 
-    const [error, setError] = useState<ExecutionResultWithErrors<ResultOf<Doc>> | null>(null);
-
-    const latestError = useLatestRef(error);
-
     const onDataCallback = useStableCallback<OnData<Doc>>(resultWithData => {
@@ -248,8 +252,7 @@ if (!onData) return;
               onDataCallback(result);
-              setData(result);
-              latestData.current = result;
 
-              if (!errors && latestError.current) {
-                setError(null);
-                latestError.current = null;
+              store.data = result;
+
+              if (!errors && store.error) {
+                store.error = null;
               }
@@ -266,4 +269,3 @@ }
               onErrorCallback(result);
-              setError(result);
-              latestError.current = result;
+              store.error = result;
             }
@@ -286,5 +288,4 @@ }
       data,
-      latestData,
       error,
-      latestError,
+      store,
     };
@@ -305,1 +306,6 @@ }
 ) => void;
+
+export type SubscriptionStore<Doc extends StringDocumentNode> = {
+  data: ExecutionResultWithData<ResultOf<Doc>> | null;
+  error: ExecutionResultWithErrors<ResultOf<Doc>> | null;
+};

src/utils.ts

@@ -1,3 +0,4 @@
-import { useRef, useMemo, MutableRefObject, useCallback } from 'react';
 import equal from 'fast-deep-equal';
+import { MutableRefObject, useCallback, useMemo, useRef } from 'react';
+import { useSnapshot } from 'valtio';
 
@@ -33,1 +34,5 @@ export function useStableValue<T>(obj: T) {
 }
+
+export function useProxySnapshot<T extends object>(proxyObject: T): T {
+  return useSnapshot(proxyObject) as T;
+}

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

32787

increased by1.31%

Lines of code

715

increased by2.14%

No dependency changes