@isograph/react 0.0.0-main-dcf30dfc → 0.0.0-main-8f1270e1

package/dist/core/componentCache.js

@@ -28,7 +28,11 @@ function getOrCreateCachedComponent(environment, componentName, fragmentReferenc
                         ' ' +
                         fragmentReference.root);
                 }
-                return readerWithRefetchQueries.readerArtifact.resolver(data, additionalRuntimeProps);
+                const firstParameter = {
+                    data,
+                    parameters: fragmentReference.variables,
+                };
+                return readerWithRefetchQueries.readerArtifact.resolver(firstParameter, additionalRuntimeProps);
             }
             Component.displayName = `${componentName} (id: ${fragmentReference.root}) @component`;
             return Component;

package/dist/core/read.js

@@ -204,7 +204,12 @@ function readData(environment, ast, root, variables, nestedRefetchQueries, netwo
                             };
                         }
                         else {
-                            target[field.alias] = field.readerArtifact.resolver(data.data);
+                            const firstParameter = {
+                                data: data.data,
+                                parameters: variables,
+                            };
+                            target[field.alias] =
+                                field.readerArtifact.resolver(firstParameter);
                         }
                         break;
                     }

package/dist/core/reader.d.ts

@@ -1,20 +1,24 @@
 /// <reference types="react" />
 import { Factory } from '@isograph/disposable-types';
-import { FragmentReference } from './FragmentReference';
+import { FragmentReference, Variables } from './FragmentReference';
 import { ComponentOrFieldName, DataId, IsographEnvironment } from './IsographEnvironment';
 import { IsographEntrypoint, IsographEntrypointLoader, RefetchQueryNormalizationArtifact, RefetchQueryNormalizationArtifactWrapper } from './entrypoint';
 import { Arguments } from './util';
-export type TopLevelReaderArtifact<TReadFromStore extends Object, TClientFieldValue, TComponentProps extends Record<string, never>> = EagerReaderArtifact<TReadFromStore, TClientFieldValue> | ComponentReaderArtifact<TReadFromStore, TComponentProps>;
-export type EagerReaderArtifact<TReadFromStore extends Object, TClientFieldValue> = {
+export type TopLevelReaderArtifact<TReadFromStore extends Object, TClientFieldValue, TComponentProps extends Record<string, never>, TVariables = Variables> = EagerReaderArtifact<TReadFromStore, TClientFieldValue, TVariables> | ComponentReaderArtifact<TReadFromStore, TComponentProps, TVariables>;
+export type EagerReaderArtifact<TReadFromStore extends Object, TClientFieldValue, TVariables = Variables> = {
     readonly kind: 'EagerReaderArtifact';
     readonly readerAst: ReaderAst<TReadFromStore>;
-    readonly resolver: (data: TReadFromStore) => TClientFieldValue;
+    readonly resolver: (data: ResolverFirstParameter<TReadFromStore, TVariables>) => TClientFieldValue;
 };
-export type ComponentReaderArtifact<TReadFromStore extends Object, TComponentProps extends Record<string, unknown> = Record<string, never>> = {
+export type ComponentReaderArtifact<TReadFromStore extends Object, TComponentProps extends Record<string, unknown> = Record<string, never>, TVariables = Variables> = {
     readonly kind: 'ComponentReaderArtifact';
     readonly componentName: ComponentOrFieldName;
     readonly readerAst: ReaderAst<TReadFromStore>;
-    readonly resolver: (data: TReadFromStore, runtimeProps: TComponentProps) => React.ReactNode;
+    readonly resolver: (data: ResolverFirstParameter<TReadFromStore, TVariables>, runtimeProps: TComponentProps) => React.ReactNode;
+};
+export type ResolverFirstParameter<TReadFromStore extends Object, TVariables = Variables> = {
+    readonly data: TReadFromStore;
+    readonly parameters: TVariables;
 };
 export type RefetchReaderArtifact = {
     readonly kind: 'RefetchReaderArtifact';

package/dist/index.d.ts

@@ -3,7 +3,7 @@ export { type PromiseWrapper, readPromise, getPromiseState, wrapResolvedValue, w
 export { subscribe, normalizeData } from './core/cache';
 export { makeNetworkRequest } from './core/makeNetworkRequest';
 export { ROOT_ID, type DataId, type DataTypeValue, type IsographEnvironment, type IsographNetworkFunction, type IsographStore, type Link, type StoreRecord, createIsographEnvironment, createIsographStore, defaultMissingFieldHandler, } from './core/IsographEnvironment';
-export { type EagerReaderArtifact, type ComponentReaderArtifact, type RefetchReaderArtifact, type ReaderAst, type ReaderAstNode, type ReaderLinkedField, type ReaderNonLoadableResolverField, type ReaderScalarField, type TopLevelReaderArtifact, type LoadableField, } from './core/reader';
+export { type EagerReaderArtifact, type ComponentReaderArtifact, type RefetchReaderArtifact, type ReaderAst, type ReaderAstNode, type ReaderLinkedField, type ReaderNonLoadableResolverField, type ReaderScalarField, type TopLevelReaderArtifact, type LoadableField, type ResolverFirstParameter, } from './core/reader';
 export { type NormalizationAst, type NormalizationAstNode, type NormalizationLinkedField, type NormalizationScalarField, type IsographEntrypoint, assertIsEntrypoint, type RefetchQueryNormalizationArtifact, type RefetchQueryNormalizationArtifactWrapper, type ExtractProps, type ExtractReadFromStore, type ExtractResolverResult, } from './core/entrypoint';
 export { readButDoNotEvaluate } from './core/read';
 export { type ExtractSecondParam, type Argument, type ArgumentName, type ArgumentValue, type Arguments, } from './core/util';

package/dist/loadable-hooks/useSkipLimitPagination.js

@@ -4,6 +4,8 @@ exports.useSkipLimitPagination = void 0;
 const IsographEnvironmentProvider_1 = require("../react/IsographEnvironmentProvider");
 const useResult_1 = require("../react/useResult");
 const read_1 = require("../core/read");
+const cache_1 = require("../core/cache");
+const react_1 = require("react");
 const react_disposable_state_1 = require("@isograph/react-disposable-state");
 const reference_counted_pointer_1 = require("@isograph/reference-counted-pointer");
 const PromiseWrapper_1 = require("../core/PromiseWrapper");
@@ -42,7 +44,11 @@ function useSkipLimitPagination(loadableField) {
             (0, useResult_1.maybeUnwrapNetworkRequest)(fragmentReference.networkRequest, networkRequestOptions);
             const data = (0, read_1.readButDoNotEvaluate)(environment, fragmentReference, networkRequestOptions);
             const readerWithRefetchQueries = (0, PromiseWrapper_1.readPromise)(fragmentReference.readerWithRefetchQueries);
-            return readerWithRefetchQueries.readerArtifact.resolver(data.item, undefined);
+            const firstParameter = {
+                data,
+                parameters: fragmentReference.variables,
+            };
+            return readerWithRefetchQueries.readerArtifact.resolver(firstParameter, undefined);
         });
         const items = flatten(results);
         return items;
@@ -70,6 +76,7 @@ function useSkipLimitPagination(loadableField) {
         ];
         setState(totalItemCleanupPair);
     };
+    const [, rerender] = (0, react_1.useState)({});
     const loadedReferences = state === react_disposable_state_1.UNASSIGNED_STATE ? [] : state;
     if (loadedReferences.length === 0) {
         return {
@@ -88,6 +95,10 @@ function useSkipLimitPagination(loadableField) {
     switch (networkRequestStatus.kind) {
         case 'Pending': {
             const completedFragmentReferences = loadedReferences.slice(0, loadedReferences.length - 1);
+            const unsubscribe = (0, cache_1.subscribeToAnyChange)(environment, () => {
+                unsubscribe();
+                rerender({});
+            });
             return {
                 kind: 'Pending',
                 pendingFragment: mostRecentFragmentReference,

package/dist/react/useResult.js

@@ -18,7 +18,11 @@ function useResult(fragmentReference, partialNetworkRequestOptions) {
         }
         case 'EagerReaderArtifact': {
             const data = (0, useReadAndSubscribe_1.useReadAndSubscribe)(fragmentReference, networkRequestOptions, readerWithRefetchQueries.readerArtifact.readerAst);
-            return readerWithRefetchQueries.readerArtifact.resolver(data);
+            const firstParameter = {
+                data: data,
+                parameters: fragmentReference.variables,
+            };
+            return readerWithRefetchQueries.readerArtifact.resolver(firstParameter);
         }
     }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@isograph/react",
-  "version": "0.0.0-main-dcf30dfc",
+  "version": "0.0.0-main-8f1270e1",
   "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-dcf30dfc",
-    "@isograph/react-disposable-state": "0.0.0-main-dcf30dfc",
-    "@isograph/reference-counted-pointer": "0.0.0-main-dcf30dfc"
+    "@isograph/disposable-types": "0.0.0-main-8f1270e1",
+    "@isograph/react-disposable-state": "0.0.0-main-8f1270e1",
+    "@isograph/reference-counted-pointer": "0.0.0-main-8f1270e1"
   },
   "peerDependencies": {
     "react": "18.2.0"

package/src/core/componentCache.ts

@@ -50,8 +50,13 @@ export function getOrCreateCachedComponent(
           );
         }
 
-        return readerWithRefetchQueries.readerArtifact.resolver(
+        const firstParameter = {
           data,
+          parameters: fragmentReference.variables,
+        };
+
+        return readerWithRefetchQueries.readerArtifact.resolver(
+          firstParameter,
           additionalRuntimeProps,
         );
       }

package/src/core/read.ts

@@ -317,7 +317,12 @@ function readData<TReadFromStore>(
                 nestedReason: data,
               };
             } else {
-              target[field.alias] = field.readerArtifact.resolver(data.data);
+              const firstParameter = {
+                data: data.data,
+                parameters: variables,
+              };
+              target[field.alias] =
+                field.readerArtifact.resolver(firstParameter);
             }
             break;
           }

package/src/core/reader.ts

@@ -1,5 +1,5 @@
 import { Factory } from '@isograph/disposable-types';
-import { FragmentReference } from './FragmentReference';
+import { FragmentReference, Variables } from './FragmentReference';
 import {
   ComponentOrFieldName,
   DataId,
@@ -17,32 +17,45 @@ export type TopLevelReaderArtifact<
   TReadFromStore extends Object,
   TClientFieldValue,
   TComponentProps extends Record<string, never>,
+  TVariables = Variables,
 > =
-  | EagerReaderArtifact<TReadFromStore, TClientFieldValue>
-  | ComponentReaderArtifact<TReadFromStore, TComponentProps>;
+  | EagerReaderArtifact<TReadFromStore, TClientFieldValue, TVariables>
+  | ComponentReaderArtifact<TReadFromStore, TComponentProps, TVariables>;
 
 export type EagerReaderArtifact<
   TReadFromStore extends Object,
   TClientFieldValue,
+  TVariables = Variables,
 > = {
   readonly kind: 'EagerReaderArtifact';
   readonly readerAst: ReaderAst<TReadFromStore>;
-  readonly resolver: (data: TReadFromStore) => TClientFieldValue;
+  readonly resolver: (
+    data: ResolverFirstParameter<TReadFromStore, TVariables>,
+  ) => TClientFieldValue;
 };
 
 export type ComponentReaderArtifact<
   TReadFromStore extends Object,
   TComponentProps extends Record<string, unknown> = Record<string, never>,
+  TVariables = Variables,
 > = {
   readonly kind: 'ComponentReaderArtifact';
   readonly componentName: ComponentOrFieldName;
   readonly readerAst: ReaderAst<TReadFromStore>;
   readonly resolver: (
-    data: TReadFromStore,
+    data: ResolverFirstParameter<TReadFromStore, TVariables>,
     runtimeProps: TComponentProps,
   ) => React.ReactNode;
 };
 
+export type ResolverFirstParameter<
+  TReadFromStore extends Object,
+  TVariables = Variables,
+> = {
+  readonly data: TReadFromStore;
+  readonly parameters: TVariables;
+};
+
 export type RefetchReaderArtifact = {
   readonly kind: 'RefetchReaderArtifact';
   readonly readerAst: ReaderAst<unknown>;

package/src/index.ts

@@ -37,6 +37,7 @@ export {
   type ReaderScalarField,
   type TopLevelReaderArtifact,
   type LoadableField,
+  type ResolverFirstParameter,
 } from './core/reader';
 export {
   type NormalizationAst,

package/src/loadable-hooks/useSkipLimitPagination.ts

@@ -4,6 +4,8 @@ import { ItemCleanupPair } from '@isograph/disposable-types';
 import { FragmentReference } from '../core/FragmentReference';
 import { maybeUnwrapNetworkRequest } from '../react/useResult';
 import { readButDoNotEvaluate } from '../core/read';
+import { subscribeToAnyChange } from '../core/cache';
+import { useState } from 'react';
 import {
   UNASSIGNED_STATE,
   useUpdatableDisposableState,
@@ -105,8 +107,13 @@ export function useSkipLimitPagination<
         fragmentReference.readerWithRefetchQueries,
       );
 
+      const firstParameter = {
+        data,
+        parameters: fragmentReference.variables,
+      };
+
       return readerWithRefetchQueries.readerArtifact.resolver(
-        data.item,
+        firstParameter,
         undefined,
       ) as ReadonlyArray<any>;
     });
@@ -155,6 +162,8 @@ export function useSkipLimitPagination<
       setState(totalItemCleanupPair);
     };
 
+  const [, rerender] = useState({});
+
   const loadedReferences = state === UNASSIGNED_STATE ? [] : state;
   if (loadedReferences.length === 0) {
     return {
@@ -182,6 +191,12 @@ export function useSkipLimitPagination<
         0,
         loadedReferences.length - 1,
       );
+
+      const unsubscribe = subscribeToAnyChange(environment, () => {
+        unsubscribe();
+        rerender({});
+      });
+
       return {
         kind: 'Pending',
         pendingFragment: mostRecentFragmentReference,

package/src/react/useResult.ts

@@ -45,7 +45,11 @@ export function useResult<TReadFromStore extends Object, TClientFieldValue>(
         networkRequestOptions,
         readerWithRefetchQueries.readerArtifact.readerAst,
       );
-      return readerWithRefetchQueries.readerArtifact.resolver(data);
+      const firstParameter = {
+        data: data,
+        parameters: fragmentReference.variables,
+      };
+      return readerWithRefetchQueries.readerArtifact.resolver(firstParameter);
     }
   }
 }

package/src/tests/__isograph/Query/meName/param_type.ts

@@ -1,6 +1,11 @@
 
+import { type Variables } from '@isograph/react';
+
 export type Query__meName__param = {
-  me: {
-    name: string,
+  data: {
+    me: {
+      name: string,
+    },
   },
+  parameters: Variables,
 };

package/src/tests/__isograph/Query/meNameSuccessor/param_type.ts

@@ -1,11 +1,16 @@
 
+import { type Variables } from '@isograph/react';
+
 export type Query__meNameSuccessor__param = {
-  me: {
-    name: string,
-    successor: ({
+  data: {
+    me: {
+      name: string,
       successor: ({
-        name: string,
+        successor: ({
+          name: string,
+        } | null),
       } | null),
-    } | null),
+    },
   },
+  parameters: Variables,
 };

package/src/tests/__isograph/Query/nodeField/param_type.ts

@@ -1,6 +1,11 @@
 
+import { type Variables } from '@isograph/react';
+
 export type Query__nodeField__param = {
-  node: ({
-    id: string,
-  } | null),
+  data: {
+    node: ({
+      id: string,
+    } | null),
+  },
+  parameters: Variables,
 };

package/src/tests/__isograph/iso.ts

@@ -1,4 +1,4 @@
-import type { IsographEntrypoint } from '@isograph/react';
+import type { IsographEntrypoint, ResolverFirstParameter, Variables } from '@isograph/react';
 import { type Query__meNameSuccessor__param } from './Query/meNameSuccessor/param_type';
 import { type Query__meName__param } from './Query/meName/param_type';
 import { type Query__nodeField__param } from './Query/nodeField/param_type';
@@ -10,9 +10,9 @@ import entrypoint_Query__nodeField from '../__isograph/Query/nodeField/entrypoin
 // This means that the type of the exported iso literal is exactly
 // the type of the passed-in function, which takes one parameter
 // of type TParam.
-type IdentityWithParam<TParam> = <TClientFieldReturn>(
+type IdentityWithParam<TParam extends Object> = <TClientFieldReturn, TVariables = Variables>(
   clientField: (param: TParam) => TClientFieldReturn
-) => (param: TParam) => TClientFieldReturn;
+) => (param: ResolverFirstParameter<TParam, TVariables>) => TClientFieldReturn;
 
 // This is the type given it to client fields with @component.
 // This means that the type of the exported iso literal is exactly
@@ -21,9 +21,13 @@ type IdentityWithParam<TParam> = <TClientFieldReturn>(
 //
 // TComponentProps becomes the types of the props you must pass
 // whenever the @component field is rendered.
-type IdentityWithParamComponent<TParam> = <TClientFieldReturn, TComponentProps = Record<string, never>>(
+type IdentityWithParamComponent<TParam extends Object> = <
+  TClientFieldReturn,
+  TComponentProps = Record<string, never>,
+  TVariables = Variables
+>(
   clientComponentField: (data: TParam, componentProps: TComponentProps) => TClientFieldReturn
-) => (data: TParam, componentProps: TComponentProps) => TClientFieldReturn;
+) => (data: ResolverFirstParameter<TParam, TVariables>, componentProps: TComponentProps) => TClientFieldReturn;
 
 type WhitespaceCharacter = ' ' | '\t' | '\n';
 type Whitespace<In> = In extends `${WhitespaceCharacter}${infer In}`