@isograph/react 0.2.0 → 0.3.1

package/src/react/useLazyReference.ts

@@ -1,22 +1,90 @@
-import { FragmentReference, Variables } from '../core/FragmentReference';
-import { useIsographEnvironment } from './IsographEnvironmentProvider';
-import { IsographEntrypoint } from '../core/entrypoint';
-import { getOrCreateCacheForArtifact } from '../core/cache';
 import { useLazyDisposableState } from '@isograph/react-disposable-state';
+import { getOrCreateCacheForArtifact } from '../core/cache';
+import { FetchOptions, type RequiredFetchOptions } from '../core/check';
+import {
+  IsographEntrypoint,
+  type NormalizationAst,
+  type NormalizationAstLoader,
+} from '../core/entrypoint';
+import {
+  ExtractParameters,
+  FragmentReference,
+  type UnknownTReadFromStore,
+} from '../core/FragmentReference';
+import { logMessage } from '../core/logging';
+import { useIsographEnvironment } from './IsographEnvironmentProvider';
 
 export function useLazyReference<
-  TReadFromStore extends Object,
+  TReadFromStore extends UnknownTReadFromStore,
   TClientFieldValue,
+  TNormalizationAst extends NormalizationAst | NormalizationAstLoader,
 >(
-  entrypoint: IsographEntrypoint<TReadFromStore, TClientFieldValue>,
-  variables: Variables,
-): {
-  fragmentReference: FragmentReference<TReadFromStore, TClientFieldValue>;
-} {
+  entrypoint: IsographEntrypoint<
+    TReadFromStore,
+    TClientFieldValue,
+    TNormalizationAst
+  >,
+  variables: ExtractParameters<TReadFromStore>,
+  ...[fetchOptions]: TNormalizationAst extends NormalizationAstLoader
+    ? [fetchOptions: RequiredFetchOptions<TClientFieldValue>]
+    : [fetchOptions?: FetchOptions<TClientFieldValue>]
+): NormalizationAst | NormalizationAstLoader extends TNormalizationAst
+  ? unknown
+  : {
+      fragmentReference: FragmentReference<TReadFromStore, TClientFieldValue>;
+    } {
   const environment = useIsographEnvironment();
-  const cache = getOrCreateCacheForArtifact(environment, entrypoint, variables);
+
+  if (entrypoint?.kind !== 'Entrypoint') {
+    // TODO have a separate error logger
+    logMessage(environment, () => ({
+      kind: 'NonEntrypointReceived',
+      entrypoint,
+    }));
+  }
+
+  const cache = getOrCreateCacheForArtifact(
+    environment,
+    entrypoint,
+    variables,
+    fetchOptions,
+  );
 
   return {
     fragmentReference: useLazyDisposableState(cache).state,
   };
 }
+
+// @ts-ignore
+function tsTests() {
+  let withAst!: IsographEntrypoint<any, unknown, NormalizationAst>;
+  let withAstLoader!: IsographEntrypoint<any, unknown, NormalizationAstLoader>;
+  let withAstOrLoader!: IsographEntrypoint<
+    any,
+    unknown,
+    NormalizationAst | NormalizationAstLoader
+  >;
+
+  useLazyReference(withAst, {}) satisfies {};
+  useLazyReference(withAst, {}, { shouldFetch: 'Yes' }) satisfies {};
+  useLazyReference(withAst, {}, { shouldFetch: 'IfNecessary' }) satisfies {};
+
+  // @ts-expect-error if there's no ast, require `shouldFetch` to be specified
+  useLazyReference(withAstLoader, {});
+  useLazyReference(withAstLoader, {}, { shouldFetch: 'Yes' }) satisfies {};
+  // @ts-expect-error if there's no ast, `shouldFetch` can't be `IfNecessary`
+  useLazyReference(withAstLoader, {}, { shouldFetch: 'IfNecessary' });
+
+  // if the type is unknown there can be no ast so we should use the same rules
+  // but because of TS bugs with inference we just return unknown
+  // @ts-expect-error this returns unknown which doesn't satisfy the constraint
+  useLazyReference(withAstOrLoader, {}) satisfies {};
+  // @ts-expect-error this returns unknown which doesn't satisfy the constraint
+  useLazyReference(withAstOrLoader, {}, { shouldFetch: 'Yes' }) satisfies {};
+  useLazyReference(
+    withAstOrLoader,
+    {},
+    { shouldFetch: 'IfNecessary' },
+    // @ts-expect-error this returns unknown which doesn't satisfy the constraint
+  ) satisfies {};
+}

package/src/react/useReadAndSubscribe.ts

@@ -1,24 +1,31 @@
 import { useEffect, useState } from 'react';
+import { subscribe } from '../core/cache';
 import {
+  ExtractData,
   FragmentReference,
   stableIdForFragmentReference,
+  type UnknownTReadFromStore,
 } from '../core/FragmentReference';
+import { readPromise } from '../core/PromiseWrapper';
 import {
   NetworkRequestReaderOptions,
   readButDoNotEvaluate,
   WithEncounteredRecords,
 } from '../core/read';
-import { useRerenderOnChange } from './useRerenderOnChange';
+import type { ReaderAst } from '../core/reader';
 import { useIsographEnvironment } from './IsographEnvironmentProvider';
-import { subscribe } from '../core/cache';
+import { useRerenderOnChange } from './useRerenderOnChange';
 
 /**
  * Read the data from a fragment reference and subscribe to updates.
  */
-export function useReadAndSubscribe<TReadFromStore extends Object>(
+export function useReadAndSubscribe<
+  TReadFromStore extends UnknownTReadFromStore,
+>(
   fragmentReference: FragmentReference<TReadFromStore, any>,
   networkRequestOptions: NetworkRequestReaderOptions,
-): TReadFromStore {
+  readerAst: ReaderAst<TReadFromStore>,
+): ExtractData<TReadFromStore> {
   const environment = useIsographEnvironment();
   const [readOutDataAndRecords, setReadOutDataAndRecords] = useState(() =>
     readButDoNotEvaluate(environment, fragmentReference, networkRequestOptions),
@@ -27,23 +34,33 @@ export function useReadAndSubscribe<TReadFromStore extends Object>(
     readOutDataAndRecords,
     fragmentReference,
     setReadOutDataAndRecords,
+    readerAst,
   );
   return readOutDataAndRecords.item;
 }
 
-export function useSubscribeToMultiple<TReadFromStore extends Object>(
+export function useSubscribeToMultiple<
+  TReadFromStore extends UnknownTReadFromStore,
+>(
   items: ReadonlyArray<{
     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 () => {
@@ -57,9 +74,15 @@ export function useSubscribeToMultiple<TReadFromStore extends Object>(
     // TODO find out
     [
       items
-        .map(({ fragmentReference }) =>
-          stableIdForFragmentReference(fragmentReference),
-        )
+        .map(({ fragmentReference }) => {
+          const readerWithRefetchQueries = readPromise(
+            fragmentReference.readerWithRefetchQueries,
+          );
+          stableIdForFragmentReference(
+            fragmentReference,
+            readerWithRefetchQueries.readerArtifact.fieldName,
+          );
+        })
         .join('.'),
     ],
   );

package/src/react/useRerenderOnChange.ts

@@ -1,17 +1,21 @@
 import { useEffect } from 'react';
 import { subscribe } from '../core/cache';
-import { WithEncounteredRecords } from '../core/read';
 import { FragmentReference } from '../core/FragmentReference';
+import { WithEncounteredRecords } from '../core/read';
+import type { ReaderAst } from '../core/reader';
 import { useIsographEnvironment } from './IsographEnvironmentProvider';
 
 // TODO add unit tests for this. Add integration tests that test
 // behavior when the encounteredRecords underneath a fragment change.
-export function useRerenderOnChange<TReadFromStore extends Object>(
+export function useRerenderOnChange<
+  TReadFromStore extends { parameters: object; data: object },
+>(
   encounteredDataAndRecords: WithEncounteredRecords<TReadFromStore>,
   fragmentReference: FragmentReference<any, any>,
   setEncounteredDataAndRecords: (
     data: WithEncounteredRecords<TReadFromStore>,
   ) => void,
+  readerAst: ReaderAst<TReadFromStore>,
 ) {
   const environment = useIsographEnvironment();
   useEffect(() => {
@@ -22,6 +26,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

@@ -1,18 +1,25 @@
-import { useIsographEnvironment } from '../react/IsographEnvironmentProvider';
-import { FragmentReference } from '../core/FragmentReference';
 import { getOrCreateCachedComponent } from '../core/componentCache';
-import { useReadAndSubscribe } from './useReadAndSubscribe';
 import {
-  getNetworkRequestOptionsWithDefaults,
-  NetworkRequestReaderOptions,
-} from '../core/read';
+  FragmentReference,
+  type UnknownTReadFromStore,
+} from '../core/FragmentReference';
 import {
   getPromiseState,
   PromiseWrapper,
   readPromise,
 } from '../core/PromiseWrapper';
+import {
+  getNetworkRequestOptionsWithDefaults,
+  NetworkRequestReaderOptions,
+} from '../core/read';
+import { getOrCreateCachedStartUpdate } from '../core/startUpdate';
+import { useIsographEnvironment } from '../react/IsographEnvironmentProvider';
+import { useReadAndSubscribe } from './useReadAndSubscribe';
 
-export function useResult<TReadFromStore extends Object, TClientFieldValue>(
+export function useResult<
+  TReadFromStore extends UnknownTReadFromStore,
+  TClientFieldValue,
+>(
   fragmentReference: FragmentReference<TReadFromStore, TClientFieldValue>,
   partialNetworkRequestOptions?: Partial<NetworkRequestReaderOptions> | void,
 ): TClientFieldValue {
@@ -34,7 +41,7 @@ export function useResult<TReadFromStore extends Object, TClientFieldValue>(
       // @ts-expect-error
       return getOrCreateCachedComponent(
         environment,
-        readerWithRefetchQueries.readerArtifact.componentName,
+        readerWithRefetchQueries.readerArtifact.fieldName,
         fragmentReference,
         networkRequestOptions,
       );
@@ -43,8 +50,22 @@ export function useResult<TReadFromStore extends Object, TClientFieldValue>(
       const data = useReadAndSubscribe(
         fragmentReference,
         networkRequestOptions,
+        readerWithRefetchQueries.readerArtifact.readerAst,
       );
-      return readerWithRefetchQueries.readerArtifact.resolver(data);
+      const param = {
+        data: data,
+        parameters: fragmentReference.variables,
+        ...(readerWithRefetchQueries.readerArtifact.hasUpdatable
+          ? {
+              startUpdate: getOrCreateCachedStartUpdate(
+                environment,
+                fragmentReference,
+                readerWithRefetchQueries.readerArtifact.fieldName,
+              ),
+            }
+          : undefined),
+      };
+      return readerWithRefetchQueries.readerArtifact.resolver(param);
     }
   }
 }

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

@@ -2,41 +2,22 @@ import type {IsographEntrypoint, NormalizationAst, RefetchQueryNormalizationArti
 import {Query__meName__param} from './param_type';
 import {Query__meName__output_type} from './output_type';
 import readerResolver from './resolver_reader';
+import queryText from './query_text';
+import normalizationAst from './normalization_ast';
 const nestedRefetchQueries: RefetchQueryNormalizationArtifactWrapper[] = [];
 
-const queryText = 'query meName  {\
-  me {\
-    id,\
-    name,\
-  },\
-}';
-
-const normalizationAst: NormalizationAst = [
-  {
-    kind: "Linked",
-    fieldName: "me",
-    arguments: null,
-    selections: [
-      {
-        kind: "Scalar",
-        fieldName: "id",
-        arguments: null,
-      },
-      {
-        kind: "Scalar",
-        fieldName: "name",
-        arguments: null,
-      },
-    ],
-  },
-];
 const artifact: IsographEntrypoint<
   Query__meName__param,
-  Query__meName__output_type
+  Query__meName__output_type,
+  NormalizationAst
 > = {
   kind: "Entrypoint",
-  queryText,
-  normalizationAst,
+  networkRequestInfo: {
+    kind: "NetworkRequestInfo",
+    queryText,
+    normalizationAst,
+  },
+  concreteType: "Query",
   readerWithRefetchQueries: {
     kind: "ReaderWithRefetchQueries",
     nestedRefetchQueries,

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

@@ -0,0 +1,25 @@
+import type {NormalizationAst} from '@isograph/react';
+const normalizationAst: NormalizationAst = {
+  kind: "NormalizationAst",
+  selections: [
+    {
+      kind: "Linked",
+      fieldName: "me",
+      arguments: null,
+      concreteType: "Economist",
+      selections: [
+        {
+          kind: "Scalar",
+          fieldName: "id",
+          arguments: null,
+        },
+        {
+          kind: "Scalar",
+          fieldName: "name",
+          arguments: null,
+        },
+      ],
+    },
+  ],
+};
+export default normalizationAst;

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

@@ -1,6 +1,9 @@
 
 export type Query__meName__param = {
-  me: {
-    name: string,
+  readonly data: {
+    readonly me: {
+      readonly name: string,
+    },
   },
+  readonly parameters: Record<PropertyKey, never>,
 };

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

@@ -0,0 +1,6 @@
+export default 'query meName  {\
+  me {\
+    id,\
+    name,\
+  },\
+}';

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

@@ -9,12 +9,15 @@ const readerAst: ReaderAst<Query__meName__param> = [
     fieldName: "me",
     alias: null,
     arguments: null,
+    condition: null,
+    isUpdatable: false,
     selections: [
       {
         kind: "Scalar",
         fieldName: "name",
         alias: null,
         arguments: null,
+        isUpdatable: false,
       },
     ],
   },
@@ -25,8 +28,10 @@ const artifact: EagerReaderArtifact<
   Query__meName__output_type
 > = {
   kind: "EagerReaderArtifact",
+  fieldName: "Query.meName",
   resolver,
   readerAst,
+  hasUpdatable: false,
 };
 
 export default artifact;

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

@@ -2,77 +2,22 @@ import type {IsographEntrypoint, NormalizationAst, RefetchQueryNormalizationArti
 import {Query__meNameSuccessor__param} from './param_type';
 import {Query__meNameSuccessor__output_type} from './output_type';
 import readerResolver from './resolver_reader';
+import queryText from './query_text';
+import normalizationAst from './normalization_ast';
 const nestedRefetchQueries: RefetchQueryNormalizationArtifactWrapper[] = [];
 
-const queryText = 'query meNameSuccessor  {\
-  me {\
-    id,\
-    name,\
-    successor {\
-      id,\
-      successor {\
-        id,\
-        name,\
-      },\
-    },\
-  },\
-}';
-
-const normalizationAst: NormalizationAst = [
-  {
-    kind: "Linked",
-    fieldName: "me",
-    arguments: null,
-    selections: [
-      {
-        kind: "Scalar",
-        fieldName: "id",
-        arguments: null,
-      },
-      {
-        kind: "Scalar",
-        fieldName: "name",
-        arguments: null,
-      },
-      {
-        kind: "Linked",
-        fieldName: "successor",
-        arguments: null,
-        selections: [
-          {
-            kind: "Scalar",
-            fieldName: "id",
-            arguments: null,
-          },
-          {
-            kind: "Linked",
-            fieldName: "successor",
-            arguments: null,
-            selections: [
-              {
-                kind: "Scalar",
-                fieldName: "id",
-                arguments: null,
-              },
-              {
-                kind: "Scalar",
-                fieldName: "name",
-                arguments: null,
-              },
-            ],
-          },
-        ],
-      },
-    ],
-  },
-];
 const artifact: IsographEntrypoint<
   Query__meNameSuccessor__param,
-  Query__meNameSuccessor__output_type
+  Query__meNameSuccessor__output_type,
+  NormalizationAst
 > = {
   kind: "Entrypoint",
-  queryText,
-  normalizationAst,
+  networkRequestInfo: {
+    kind: "NetworkRequestInfo",
+    queryText,
+    normalizationAst,
+  },
+  concreteType: "Query",
   readerWithRefetchQueries: {
     kind: "ReaderWithRefetchQueries",
     nestedRefetchQueries,

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

@@ -0,0 +1,56 @@
+import type {NormalizationAst} from '@isograph/react';
+const normalizationAst: NormalizationAst = {
+  kind: "NormalizationAst",
+  selections: [
+    {
+      kind: "Linked",
+      fieldName: "me",
+      arguments: null,
+      concreteType: "Economist",
+      selections: [
+        {
+          kind: "Scalar",
+          fieldName: "id",
+          arguments: null,
+        },
+        {
+          kind: "Scalar",
+          fieldName: "name",
+          arguments: null,
+        },
+        {
+          kind: "Linked",
+          fieldName: "successor",
+          arguments: null,
+          concreteType: "Economist",
+          selections: [
+            {
+              kind: "Scalar",
+              fieldName: "id",
+              arguments: null,
+            },
+            {
+              kind: "Linked",
+              fieldName: "successor",
+              arguments: null,
+              concreteType: "Economist",
+              selections: [
+                {
+                  kind: "Scalar",
+                  fieldName: "id",
+                  arguments: null,
+                },
+                {
+                  kind: "Scalar",
+                  fieldName: "name",
+                  arguments: null,
+                },
+              ],
+            },
+          ],
+        },
+      ],
+    },
+  ],
+};
+export default normalizationAst;

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

@@ -1,11 +1,14 @@
 
 export type Query__meNameSuccessor__param = {
-  me: {
-    name: string,
-    successor: ({
-      successor: ({
-        name: string,
+  readonly data: {
+    readonly me: {
+      readonly name: string,
+      readonly successor: ({
+        readonly successor: ({
+          readonly name: string,
+        } | null),
       } | null),
-    } | null),
+    },
   },
+  readonly parameters: Record<PropertyKey, never>,
 };

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

@@ -0,0 +1,13 @@
+export default 'query meNameSuccessor  {\
+  me {\
+    id,\
+    name,\
+    successor {\
+      id,\
+      successor {\
+        id,\
+        name,\
+      },\
+    },\
+  },\
+}';

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

@@ -9,30 +9,38 @@ const readerAst: ReaderAst<Query__meNameSuccessor__param> = [
     fieldName: "me",
     alias: null,
     arguments: null,
+    condition: null,
+    isUpdatable: false,
     selections: [
       {
         kind: "Scalar",
         fieldName: "name",
         alias: null,
         arguments: null,
+        isUpdatable: false,
       },
       {
         kind: "Linked",
         fieldName: "successor",
         alias: null,
         arguments: null,
+        condition: null,
+        isUpdatable: false,
         selections: [
           {
             kind: "Linked",
             fieldName: "successor",
             alias: null,
             arguments: null,
+            condition: null,
+            isUpdatable: false,
             selections: [
               {
                 kind: "Scalar",
                 fieldName: "name",
                 alias: null,
                 arguments: null,
+                isUpdatable: false,
               },
             ],
           },
@@ -47,8 +55,10 @@ const artifact: EagerReaderArtifact<
   Query__meNameSuccessor__output_type
 > = {
   kind: "EagerReaderArtifact",
+  fieldName: "Query.meNameSuccessor",
   resolver,
   readerAst,
+  hasUpdatable: false,
 };
 
 export default artifact;