@isograph/react 0.0.0-main-dfe22b10 → 0.0.0-main-752db914

package/dist/core/IsographEnvironment.d.ts

@@ -5,6 +5,7 @@ import { WithEncounteredRecords } from './read';
 import { FragmentReference, Variables } from './FragmentReference';
 import { PromiseWrapper } from './PromiseWrapper';
 import { IsographEntrypoint } from './entrypoint';
+import type { ReaderAst } from './reader';
 export type ComponentOrFieldName = string;
 export type StringifiedArgs = string;
 type ComponentCache = {
@@ -20,6 +21,7 @@ export type FragmentSubscription<TReadFromStore extends Object> = {
     /** The value read out from the previous call to readButDoNotEvaluate */
     readonly encounteredDataAndRecords: WithEncounteredRecords<TReadFromStore>;
     readonly fragmentReference: FragmentReference<TReadFromStore, any>;
+    readonly readerAst: ReaderAst<TReadFromStore>;
 };
 type AnyRecordSubscription = {
     readonly kind: 'AnyRecords';

package/dist/core/cache.d.ts

@@ -1,7 +1,7 @@
 import { Factory, ParentCache } from '@isograph/react-disposable-state';
 import { DataId, type IsographEnvironment } from './IsographEnvironment';
 import { IsographEntrypoint, NormalizationAst, NormalizationLinkedField, NormalizationScalarField, RefetchQueryNormalizationArtifactWrapper } from '../core/entrypoint';
-import { ReaderLinkedField, ReaderScalarField } from './reader';
+import { ReaderLinkedField, ReaderScalarField, type ReaderAst } from './reader';
 import { WithEncounteredRecords } from './read';
 import { FragmentReference, Variables } from './FragmentReference';
 export declare function getOrCreateItemInSuspenseCache<TReadFromStore extends Object, TClientFieldValue>(environment: IsographEnvironment, index: string, factory: Factory<FragmentReference<TReadFromStore, TClientFieldValue>>): ParentCache<FragmentReference<TReadFromStore, TClientFieldValue>>;
@@ -20,7 +20,7 @@ type NetworkResponseObject = {
 };
 export declare function normalizeData(environment: IsographEnvironment, normalizationAst: NormalizationAst, networkResponse: NetworkResponseObject, variables: Variables, nestedRefetchQueries: RefetchQueryNormalizationArtifactWrapper[]): Set<DataId>;
 export declare function subscribeToAnyChange(environment: IsographEnvironment, callback: () => void): () => void;
-export declare function subscribe<TReadFromStore extends Object>(environment: IsographEnvironment, encounteredDataAndRecords: WithEncounteredRecords<TReadFromStore>, fragmentReference: FragmentReference<TReadFromStore, any>, callback: (newEncounteredDataAndRecords: WithEncounteredRecords<TReadFromStore>) => void): () => void;
+export declare function subscribe<TReadFromStore extends Object>(environment: IsographEnvironment, encounteredDataAndRecords: WithEncounteredRecords<TReadFromStore>, fragmentReference: FragmentReference<TReadFromStore, any>, callback: (newEncounteredDataAndRecords: WithEncounteredRecords<TReadFromStore>) => void, readerAst: ReaderAst<TReadFromStore>): () => void;
 export declare function onNextChange(environment: IsographEnvironment): Promise<void>;
 export declare function getParentRecordKey(astNode: NormalizationLinkedField | NormalizationScalarField | ReaderLinkedField | ReaderScalarField, variables: Variables): string;
 export declare const FIRST_SPLIT_KEY = "____";

package/dist/core/cache.js

@@ -97,12 +97,13 @@ function subscribeToAnyChange(environment, callback) {
 }
 exports.subscribeToAnyChange = subscribeToAnyChange;
 // TODO we should re-read and call callback if the value has changed
-function subscribe(environment, encounteredDataAndRecords, fragmentReference, callback) {
+function subscribe(environment, encounteredDataAndRecords, fragmentReference, callback, readerAst) {
     const fragmentSubscription = {
         kind: 'FragmentSubscription',
         callback,
         encounteredDataAndRecords,
         fragmentReference,
+        readerAst,
     };
     // @ts-expect-error
     environment.subscriptions.add(fragmentSubscription);

package/dist/core/componentCache.js

@@ -19,7 +19,8 @@ function getOrCreateCachedComponent(environment, componentName, fragmentReferenc
     byArgs[stringifiedArgs] =
         (_c = byArgs[stringifiedArgs]) !== null && _c !== void 0 ? _c : (() => {
             function Component(additionalRuntimeProps) {
-                const data = (0, useReadAndSubscribe_1.useReadAndSubscribe)(fragmentReference, networkRequestOptions);
+                const readerWithRefetchQueries = (0, PromiseWrapper_1.readPromise)(fragmentReference.readerWithRefetchQueries);
+                const data = (0, useReadAndSubscribe_1.useReadAndSubscribe)(fragmentReference, networkRequestOptions, readerWithRefetchQueries.readerArtifact.readerAst);
                 // @ts-expect-error
                 if (typeof window !== 'undefined' && window.__LOG) {
                     console.log('Component re-rendered: ' +
@@ -27,7 +28,6 @@ function getOrCreateCachedComponent(environment, componentName, fragmentReferenc
                         ' ' +
                         fragmentReference.root);
                 }
-                const readerWithRefetchQueries = (0, PromiseWrapper_1.readPromise)(fragmentReference.readerWithRefetchQueries);
                 return readerWithRefetchQueries.readerArtifact.resolver(data, additionalRuntimeProps);
             }
             Component.displayName = `${componentName} (id: ${fragmentReference.root}) @component`;

package/dist/loadable-hooks/useSkipLimitPagination.d.ts

@@ -12,16 +12,6 @@ type UseSkipLimitReturnValue<TArgs, TItem> = {
     readonly pendingFragment: FragmentReference<any, ReadonlyArray<TItem>>;
 };
 /**
- * accepts a loadableField that accepts skip and limit arguments
- * and returns:
- * - a fetchMore function that, when called, triggers a network
- *   request for additional data, and
- * - the data received so far.
- *
- * This hook will suspend if any network request is in flight.
- *
- * Calling fetchMore before the hook mounts is a no-op.
- *
  * NOTE: this hook does not subscribe to changes. This is a known
  * issue. If you are running into this issue, reach out on GitHub/
  * Twitter, and we'll fix the issue.

package/dist/loadable-hooks/useSkipLimitPagination.js

@@ -17,16 +17,6 @@ function flatten(arr) {
     return outArray;
 }
 /**
- * accepts a loadableField that accepts skip and limit arguments
- * and returns:
- * - a fetchMore function that, when called, triggers a network
- *   request for additional data, and
- * - the data received so far.
- *
- * This hook will suspend if any network request is in flight.
- *
- * Calling fetchMore before the hook mounts is a no-op.
- *
  * NOTE: this hook does not subscribe to changes. This is a known
  * issue. If you are running into this issue, reach out on GitHub/
  * Twitter, and we'll fix the issue.

package/dist/react/useReadAndSubscribe.d.ts

@@ -1,11 +1,13 @@
 import { FragmentReference } from '../core/FragmentReference';
 import { NetworkRequestReaderOptions, WithEncounteredRecords } from '../core/read';
+import type { ReaderAst } from '../core/reader';
 /**
  * Read the data from a fragment reference and subscribe to updates.
  */
-export declare function useReadAndSubscribe<TReadFromStore extends Object>(fragmentReference: FragmentReference<TReadFromStore, any>, networkRequestOptions: NetworkRequestReaderOptions): TReadFromStore;
+export declare function useReadAndSubscribe<TReadFromStore extends Object>(fragmentReference: FragmentReference<TReadFromStore, any>, networkRequestOptions: NetworkRequestReaderOptions, readerAst: ReaderAst<TReadFromStore>): TReadFromStore;
 export declare function useSubscribeToMultiple<TReadFromStore extends Object>(items: ReadonlyArray<{
     records: WithEncounteredRecords<TReadFromStore>;
     callback: (updatedRecords: WithEncounteredRecords<TReadFromStore>) => void;
     fragmentReference: FragmentReference<TReadFromStore, any>;
+    readerAst: ReaderAst<TReadFromStore>;
 }>): void;

package/dist/react/useReadAndSubscribe.js

@@ -10,18 +10,18 @@ const cache_1 = require("../core/cache");
 /**
  * Read the data from a fragment reference and subscribe to updates.
  */
-function useReadAndSubscribe(fragmentReference, networkRequestOptions) {
+function useReadAndSubscribe(fragmentReference, networkRequestOptions, readerAst) {
     const environment = (0, IsographEnvironmentProvider_1.useIsographEnvironment)();
     const [readOutDataAndRecords, setReadOutDataAndRecords] = (0, react_1.useState)(() => (0, read_1.readButDoNotEvaluate)(environment, fragmentReference, networkRequestOptions));
-    (0, useRerenderOnChange_1.useRerenderOnChange)(readOutDataAndRecords, fragmentReference, setReadOutDataAndRecords);
+    (0, useRerenderOnChange_1.useRerenderOnChange)(readOutDataAndRecords, fragmentReference, setReadOutDataAndRecords, readerAst);
     return readOutDataAndRecords.item;
 }
 exports.useReadAndSubscribe = useReadAndSubscribe;
 function useSubscribeToMultiple(items) {
     const environment = (0, IsographEnvironmentProvider_1.useIsographEnvironment)();
     (0, react_1.useEffect)(() => {
-        const cleanupFns = items.map(({ records, callback, fragmentReference }) => {
-            return (0, cache_1.subscribe)(environment, records, fragmentReference, callback);
+        const cleanupFns = items.map(({ records, callback, fragmentReference, readerAst }) => {
+            return (0, cache_1.subscribe)(environment, records, fragmentReference, callback, readerAst);
         });
         return () => {
             cleanupFns.forEach((loader) => {

package/dist/react/useRerenderOnChange.d.ts

@@ -1,3 +1,4 @@
 import { WithEncounteredRecords } from '../core/read';
 import { FragmentReference } from '../core/FragmentReference';
-export declare function useRerenderOnChange<TReadFromStore extends Object>(encounteredDataAndRecords: WithEncounteredRecords<TReadFromStore>, fragmentReference: FragmentReference<any, any>, setEncounteredDataAndRecords: (data: WithEncounteredRecords<TReadFromStore>) => void): void;
+import type { ReaderAst } from '../core/reader';
+export declare function useRerenderOnChange<TReadFromStore extends Object>(encounteredDataAndRecords: WithEncounteredRecords<TReadFromStore>, fragmentReference: FragmentReference<any, any>, setEncounteredDataAndRecords: (data: WithEncounteredRecords<TReadFromStore>) => void, readerAst: ReaderAst<TReadFromStore>): void;

package/dist/react/useRerenderOnChange.js

@@ -6,12 +6,12 @@ const cache_1 = require("../core/cache");
 const IsographEnvironmentProvider_1 = require("./IsographEnvironmentProvider");
 // TODO add unit tests for this. Add integration tests that test
 // behavior when the encounteredRecords underneath a fragment change.
-function useRerenderOnChange(encounteredDataAndRecords, fragmentReference, setEncounteredDataAndRecords) {
+function useRerenderOnChange(encounteredDataAndRecords, fragmentReference, setEncounteredDataAndRecords, readerAst) {
     const environment = (0, IsographEnvironmentProvider_1.useIsographEnvironment)();
     (0, react_1.useEffect)(() => {
         return (0, cache_1.subscribe)(environment, encounteredDataAndRecords, fragmentReference, (newEncounteredDataAndRecords) => {
             setEncounteredDataAndRecords(newEncounteredDataAndRecords);
-        });
+        }, readerAst);
         // Note: this is an empty array on purpose:
         // - the fragment reference is stable for the life of the component
         // - ownership of encounteredDataAndRecords is transferred into the

package/dist/react/useResult.js

@@ -17,7 +17,7 @@ function useResult(fragmentReference, partialNetworkRequestOptions) {
             return (0, componentCache_1.getOrCreateCachedComponent)(environment, readerWithRefetchQueries.readerArtifact.componentName, fragmentReference, networkRequestOptions);
         }
         case 'EagerReaderArtifact': {
-            const data = (0, useReadAndSubscribe_1.useReadAndSubscribe)(fragmentReference, networkRequestOptions);
+            const data = (0, useReadAndSubscribe_1.useReadAndSubscribe)(fragmentReference, networkRequestOptions, readerWithRefetchQueries.readerArtifact.readerAst);
             return readerWithRefetchQueries.readerArtifact.resolver(data);
         }
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@isograph/react",
-  "version": "0.0.0-main-dfe22b10",
+  "version": "0.0.0-main-752db914",
   "description": "Use Isograph with React",
   "homepage": "https://isograph.dev",
   "main": "dist/index.js",
@@ -17,9 +17,9 @@
     "tsc": "tsc"
   },
   "dependencies": {
-    "@isograph/disposable-types": "0.0.0-main-dfe22b10",
-    "@isograph/react-disposable-state": "0.0.0-main-dfe22b10",
-    "@isograph/reference-counted-pointer": "0.0.0-main-dfe22b10"
+    "@isograph/disposable-types": "0.0.0-main-752db914",
+    "@isograph/react-disposable-state": "0.0.0-main-752db914",
+    "@isograph/reference-counted-pointer": "0.0.0-main-752db914"
   },
   "peerDependencies": {
     "react": "18.2.0"

package/src/core/IsographEnvironment.ts

@@ -4,6 +4,7 @@ import { WithEncounteredRecords } from './read';
 import { FragmentReference, Variables } from './FragmentReference';
 import { PromiseWrapper, wrapPromise } from './PromiseWrapper';
 import { IsographEntrypoint } from './entrypoint';
+import type { ReaderAst } from './reader';
 
 export type ComponentOrFieldName = string;
 export type StringifiedArgs = string;
@@ -21,6 +22,7 @@ export type FragmentSubscription<TReadFromStore extends Object> = {
   /** The value read out from the previous call to readButDoNotEvaluate */
   readonly encounteredDataAndRecords: WithEncounteredRecords<TReadFromStore>;
   readonly fragmentReference: FragmentReference<TReadFromStore, any>;
+  readonly readerAst: ReaderAst<TReadFromStore>;
 };
 type AnyRecordSubscription = {
   readonly kind: 'AnyRecords';

package/src/core/cache.ts

@@ -21,7 +21,7 @@ import {
   NormalizationScalarField,
   RefetchQueryNormalizationArtifactWrapper,
 } from '../core/entrypoint';
-import { ReaderLinkedField, ReaderScalarField } from './reader';
+import { ReaderLinkedField, ReaderScalarField, type ReaderAst } from './reader';
 import { Argument, ArgumentValue } from './util';
 import { WithEncounteredRecords, readButDoNotEvaluate } from './read';
 import { FragmentReference, Variables } from './FragmentReference';
@@ -187,12 +187,14 @@ export function subscribe<TReadFromStore extends Object>(
   callback: (
     newEncounteredDataAndRecords: WithEncounteredRecords<TReadFromStore>,
   ) => void,
+  readerAst: ReaderAst<TReadFromStore>,
 ): () => void {
   const fragmentSubscription: FragmentSubscription<TReadFromStore> = {
     kind: 'FragmentSubscription',
     callback,
     encounteredDataAndRecords,
     fragmentReference,
+    readerAst,
   };
   // @ts-expect-error
   environment.subscriptions.add(fragmentSubscription);

package/src/core/componentCache.ts

@@ -30,9 +30,14 @@ export function getOrCreateCachedComponent(
     byArgs[stringifiedArgs] ??
     (() => {
       function Component(additionalRuntimeProps: { [key: string]: any }) {
+        const readerWithRefetchQueries = readPromise(
+          fragmentReference.readerWithRefetchQueries,
+        );
+
         const data = useReadAndSubscribe(
           fragmentReference,
           networkRequestOptions,
+          readerWithRefetchQueries.readerArtifact.readerAst,
         );
 
         // @ts-expect-error
@@ -45,10 +50,6 @@ export function getOrCreateCachedComponent(
           );
         }
 
-        const readerWithRefetchQueries = readPromise(
-          fragmentReference.readerWithRefetchQueries,
-        );
-
         return readerWithRefetchQueries.readerArtifact.resolver(
           data,
           additionalRuntimeProps,

package/src/loadable-hooks/useSkipLimitPagination.ts

@@ -51,16 +51,6 @@ function flatten<T>(arr: ReadonlyArray<ReadonlyArray<T>>): ReadonlyArray<T> {
 }
 
 /**
- * accepts a loadableField that accepts skip and limit arguments
- * and returns:
- * - a fetchMore function that, when called, triggers a network
- *   request for additional data, and
- * - the data received so far.
- *
- * This hook will suspend if any network request is in flight.
- *
- * Calling fetchMore before the hook mounts is a no-op.
- *
  * NOTE: this hook does not subscribe to changes. This is a known
  * issue. If you are running into this issue, reach out on GitHub/
  * Twitter, and we'll fix the issue.

package/src/react/useReadAndSubscribe.ts

@@ -11,6 +11,7 @@ import {
 import { useRerenderOnChange } from './useRerenderOnChange';
 import { useIsographEnvironment } from './IsographEnvironmentProvider';
 import { subscribe } from '../core/cache';
+import type { ReaderAst } from '../core/reader';
 
 /**
  * Read the data from a fragment reference and subscribe to updates.
@@ -18,6 +19,7 @@ import { subscribe } from '../core/cache';
 export function useReadAndSubscribe<TReadFromStore extends Object>(
   fragmentReference: FragmentReference<TReadFromStore, any>,
   networkRequestOptions: NetworkRequestReaderOptions,
+  readerAst: ReaderAst<TReadFromStore>,
 ): TReadFromStore {
   const environment = useIsographEnvironment();
   const [readOutDataAndRecords, setReadOutDataAndRecords] = useState(() =>
@@ -27,6 +29,7 @@ export function useReadAndSubscribe<TReadFromStore extends Object>(
     readOutDataAndRecords,
     fragmentReference,
     setReadOutDataAndRecords,
+    readerAst,
   );
   return readOutDataAndRecords.item;
 }
@@ -36,14 +39,21 @@ export function useSubscribeToMultiple<TReadFromStore extends Object>(
     records: WithEncounteredRecords<TReadFromStore>;
     callback: (updatedRecords: WithEncounteredRecords<TReadFromStore>) => void;
     fragmentReference: FragmentReference<TReadFromStore, any>;
+    readerAst: ReaderAst<TReadFromStore>;
   }>,
 ) {
   const environment = useIsographEnvironment();
   useEffect(
     () => {
       const cleanupFns = items.map(
-        ({ records, callback, fragmentReference }) => {
-          return subscribe(environment, records, fragmentReference, callback);
+        ({ records, callback, fragmentReference, readerAst }) => {
+          return subscribe(
+            environment,
+            records,
+            fragmentReference,
+            callback,
+            readerAst,
+          );
         },
       );
       return () => {

package/src/react/useRerenderOnChange.ts

@@ -3,6 +3,7 @@ import { subscribe } from '../core/cache';
 import { WithEncounteredRecords } from '../core/read';
 import { FragmentReference } from '../core/FragmentReference';
 import { useIsographEnvironment } from './IsographEnvironmentProvider';
+import type { ReaderAst } from '../core/reader';
 
 // TODO add unit tests for this. Add integration tests that test
 // behavior when the encounteredRecords underneath a fragment change.
@@ -12,6 +13,7 @@ export function useRerenderOnChange<TReadFromStore extends Object>(
   setEncounteredDataAndRecords: (
     data: WithEncounteredRecords<TReadFromStore>,
   ) => void,
+  readerAst: ReaderAst<TReadFromStore>,
 ) {
   const environment = useIsographEnvironment();
   useEffect(() => {
@@ -22,6 +24,7 @@ export function useRerenderOnChange<TReadFromStore extends Object>(
       (newEncounteredDataAndRecords) => {
         setEncounteredDataAndRecords(newEncounteredDataAndRecords);
       },
+      readerAst,
     );
     // Note: this is an empty array on purpose:
     // - the fragment reference is stable for the life of the component

package/src/react/useResult.ts

@@ -43,6 +43,7 @@ export function useResult<TReadFromStore extends Object, TClientFieldValue>(
       const data = useReadAndSubscribe(
         fragmentReference,
         networkRequestOptions,
+        readerWithRefetchQueries.readerArtifact.readerAst,
       );
       return readerWithRefetchQueries.readerArtifact.resolver(data);
     }