@isograph/react 0.3.0 → 0.4.0

package/src/react/useLazyReference.ts

@@ -1,32 +1,46 @@
+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 {
-  FragmentReference,
   ExtractParameters,
+  FragmentReference,
+  type UnknownTReadFromStore,
 } 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 { logMessage } from '../core/logging';
-import { FetchOptions } from '../core/check';
+import { useIsographEnvironment } from './IsographEnvironmentProvider';
 
 export function useLazyReference<
-  TReadFromStore extends { parameters: object; data: object },
+  TReadFromStore extends UnknownTReadFromStore,
   TClientFieldValue,
+  TNormalizationAst extends NormalizationAst | NormalizationAstLoader,
 >(
-  entrypoint: IsographEntrypoint<TReadFromStore, TClientFieldValue>,
+  entrypoint: IsographEntrypoint<
+    TReadFromStore,
+    TClientFieldValue,
+    TNormalizationAst
+  >,
   variables: ExtractParameters<TReadFromStore>,
-  fetchOptions?: FetchOptions,
-): {
-  fragmentReference: FragmentReference<TReadFromStore, TClientFieldValue>;
-} {
+  ...[fetchOptions]: TNormalizationAst extends NormalizationAstLoader
+    ? [fetchOptions: RequiredFetchOptions<TClientFieldValue>]
+    : [fetchOptions?: FetchOptions<TClientFieldValue>]
+): NormalizationAst | NormalizationAstLoader extends TNormalizationAst
+  ? unknown
+  : {
+      fragmentReference: FragmentReference<TReadFromStore, TClientFieldValue>;
+    } {
   const environment = useIsographEnvironment();
 
   if (entrypoint?.kind !== 'Entrypoint') {
     // TODO have a separate error logger
-    logMessage(environment, {
+    logMessage(environment, () => ({
       kind: 'NonEntrypointReceived',
       entrypoint,
-    });
+    }));
   }
 
   const cache = getOrCreateCacheForArtifact(
@@ -40,3 +54,37 @@ export function useLazyReference<
     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,26 @@
 import { useEffect, useState } from 'react';
+import { subscribe } from '../core/cache';
 import {
+  ExtractData,
   FragmentReference,
   stableIdForFragmentReference,
-  ExtractData,
+  type UnknownTReadFromStore,
 } from '../core/FragmentReference';
+import { readPromise } from '../core/PromiseWrapper';
 import {
   NetworkRequestReaderOptions,
   readButDoNotEvaluate,
   WithEncounteredRecords,
 } from '../core/read';
-import { useRerenderOnChange } from './useRerenderOnChange';
-import { useIsographEnvironment } from './IsographEnvironmentProvider';
-import { subscribe } from '../core/cache';
 import type { ReaderAst } from '../core/reader';
+import { useIsographEnvironment } from './IsographEnvironmentProvider';
+import { useRerenderOnChange } from './useRerenderOnChange';
 
 /**
  * Read the data from a fragment reference and subscribe to updates.
  */
 export function useReadAndSubscribe<
-  TReadFromStore extends { parameters: object; data: object },
+  TReadFromStore extends UnknownTReadFromStore,
 >(
   fragmentReference: FragmentReference<TReadFromStore, any>,
   networkRequestOptions: NetworkRequestReaderOptions,
@@ -38,7 +40,7 @@ export function useReadAndSubscribe<
 }
 
 export function useSubscribeToMultiple<
-  TReadFromStore extends { parameters: object; data: object },
+  TReadFromStore extends UnknownTReadFromStore,
 >(
   items: ReadonlyArray<{
     records: WithEncounteredRecords<TReadFromStore>;
@@ -72,9 +74,15 @@ export function useSubscribeToMultiple<
     // 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,9 +1,9 @@
 import { useEffect } from 'react';
 import { subscribe } from '../core/cache';
-import { WithEncounteredRecords } from '../core/read';
 import { FragmentReference } from '../core/FragmentReference';
-import { useIsographEnvironment } from './IsographEnvironmentProvider';
+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.

package/src/react/useResult.ts

@@ -1,19 +1,23 @@
-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 { parameters: object; data: object },
+  TReadFromStore extends UnknownTReadFromStore,
   TClientFieldValue,
 >(
   fragmentReference: FragmentReference<TReadFromStore, TClientFieldValue>,
@@ -37,7 +41,7 @@ export function useResult<
       // @ts-expect-error
       return getOrCreateCachedComponent(
         environment,
-        readerWithRefetchQueries.readerArtifact.componentName,
+        readerWithRefetchQueries.readerArtifact.fieldName,
         fragmentReference,
         networkRequestOptions,
       );
@@ -51,6 +55,16 @@ export function useResult<
       const param = {
         data: data,
         parameters: fragmentReference.variables,
+        ...(readerWithRefetchQueries.readerArtifact.hasUpdatable
+          ? {
+              startUpdate: getOrCreateCachedStartUpdate(
+                environment,
+                fragmentReference,
+                readerWithRefetchQueries.readerArtifact.fieldName,
+                networkRequestOptions,
+              ),
+            }
+          : undefined),
       };
       return readerWithRefetchQueries.readerArtifact.resolver(param);
     }

package/src/tests/__isograph/Economist/link/output_type.ts

@@ -0,0 +1,2 @@
+import type { Link } from '@isograph/react';
+export type Economist__link__output_type = Link<"Economist">;

package/src/tests/__isograph/Node/asEconomist/resolver_reader.ts

@@ -0,0 +1,28 @@
+import type { EagerReaderArtifact, ReaderAst, Link } from '@isograph/react';
+
+const readerAst: ReaderAst<{ data: any, parameters: Record<PropertyKey, never> }> = [
+  {
+    kind: "Scalar",
+    fieldName: "__typename",
+    alias: null,
+    arguments: null,
+    isUpdatable: false,
+  },
+  {
+    kind: "Link",
+    alias: "link",
+  },
+];
+
+const artifact: EagerReaderArtifact<
+  { data: any, parameters: Record<PropertyKey, never> },
+  Link<"Economist"> | null
+> = {
+  kind: "EagerReaderArtifact",
+  fieldName: "Node.asEconomist",
+  resolver: ({ data }) => data.__typename === "Economist" ? data.link : null,
+  readerAst,
+  hasUpdatable: false,
+};
+
+export default artifact;

package/src/tests/__isograph/Node/link/output_type.ts

@@ -0,0 +1,3 @@
+import type { Link } from '@isograph/react';
+export type Node__link__output_type = 
+  | Link<"Economist">;

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

@@ -0,0 +1,31 @@
+import type {IsographEntrypoint, NormalizationAst, RefetchQueryNormalizationArtifactWrapper} from '@isograph/react';
+import {Query__linkedUpdate__param} from './param_type';
+import {Query__linkedUpdate__output_type} from './output_type';
+import readerResolver from './resolver_reader';
+import queryText from './query_text';
+import normalizationAst from './normalization_ast';
+const nestedRefetchQueries: RefetchQueryNormalizationArtifactWrapper[] = [];
+
+const artifact: IsographEntrypoint<
+  Query__linkedUpdate__param,
+  Query__linkedUpdate__output_type,
+  NormalizationAst
+> = {
+  kind: "Entrypoint",
+  networkRequestInfo: {
+    kind: "NetworkRequestInfo",
+    operation: {
+      kind: "Operation",
+      text: queryText,
+    },
+    normalizationAst,
+  },
+  concreteType: "Query",
+  readerWithRefetchQueries: {
+    kind: "ReaderWithRefetchQueries",
+    nestedRefetchQueries,
+    readerArtifact: readerResolver,
+  },
+};
+
+export default artifact;

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

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

package/src/tests/__isograph/Query/linkedUpdate/output_type.ts

@@ -0,0 +1,3 @@
+import type React from 'react';
+import { linkedUpdate as resolver } from '../../../startUpdate.test';
+export type Query__linkedUpdate__output_type = ReturnType<typeof resolver>;

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

@@ -0,0 +1,51 @@
+import { type Node__link__output_type } from '../../Node/link/output_type';
+import type { StartUpdate } from '@isograph/react';
+
+export type Query__linkedUpdate__param = {
+  readonly data: {
+    readonly node: ({
+      /**
+A client pointer for the Economist type.
+      */
+      readonly asEconomist: ({
+        readonly name: string,
+      } | null),
+    } | null),
+    readonly john_stuart_mill: ({
+      /**
+A store Link for the Node type.
+      */
+      readonly link: Node__link__output_type,
+      /**
+A client pointer for the Economist type.
+      */
+      readonly asEconomist: ({
+        readonly name: string,
+      } | null),
+    } | null),
+  },
+  readonly parameters: Record<PropertyKey, never>,
+  readonly startUpdate: StartUpdate<{
+    get node(): ({
+      /**
+A client pointer for the Economist type.
+      */
+      readonly asEconomist: ({
+        name: string,
+      } | null),
+    } | null),
+    set node(value: ({ link: Node__link__output_type } | null)),
+    readonly john_stuart_mill: ({
+      /**
+A store Link for the Node type.
+      */
+      readonly link: Node__link__output_type,
+      /**
+A client pointer for the Economist type.
+      */
+      readonly asEconomist: ({
+        readonly name: string,
+      } | null),
+    } | null),
+  }>,
+};

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

@@ -0,0 +1,20 @@
+export default 'query linkedUpdate {\
+  node____id___l_0: node(id: 0) {\
+    __typename,\
+    id,\
+    ... on Economist {\
+      __typename,\
+      id,\
+      name,\
+    },\
+  },\
+  node____id___l_1: node(id: 1) {\
+    __typename,\
+    id,\
+    ... on Economist {\
+      __typename,\
+      id,\
+      name,\
+    },\
+  },\
+}';

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

@@ -0,0 +1,93 @@
+import type { EagerReaderArtifact, ReaderAst } from '@isograph/react';
+import { Query__linkedUpdate__param } from './param_type';
+import { Query__linkedUpdate__output_type } from './output_type';
+import { linkedUpdate as resolver } from '../../../startUpdate.test';
+import Node__asEconomist__resolver_reader from '../../Node/asEconomist/resolver_reader';
+
+const readerAst: ReaderAst<Query__linkedUpdate__param> = [
+  {
+    kind: "Linked",
+    fieldName: "node",
+    alias: null,
+    arguments: [
+      [
+        "id",
+        { kind: "Literal", value: 0 },
+      ],
+    ],
+    condition: null,
+    isUpdatable: true,
+    selections: [
+      {
+        kind: "Linked",
+        fieldName: "asEconomist",
+        alias: null,
+        arguments: null,
+        condition: Node__asEconomist__resolver_reader,
+        isUpdatable: false,
+        selections: [
+          {
+            kind: "Scalar",
+            fieldName: "name",
+            alias: null,
+            arguments: null,
+            isUpdatable: true,
+          },
+        ],
+        refetchQueryIndex: null,
+      },
+    ],
+    refetchQueryIndex: null,
+  },
+  {
+    kind: "Linked",
+    fieldName: "node",
+    alias: "john_stuart_mill",
+    arguments: [
+      [
+        "id",
+        { kind: "Literal", value: 1 },
+      ],
+    ],
+    condition: null,
+    isUpdatable: false,
+    selections: [
+      {
+        kind: "Link",
+        alias: "link",
+      },
+      {
+        kind: "Linked",
+        fieldName: "asEconomist",
+        alias: null,
+        arguments: null,
+        condition: Node__asEconomist__resolver_reader,
+        isUpdatable: false,
+        selections: [
+          {
+            kind: "Scalar",
+            fieldName: "name",
+            alias: null,
+            arguments: null,
+            isUpdatable: false,
+          },
+        ],
+        refetchQueryIndex: null,
+      },
+    ],
+    refetchQueryIndex: null,
+  },
+];
+
+const artifact: EagerReaderArtifact<
+  Query__linkedUpdate__param,
+  Query__linkedUpdate__output_type
+> = {
+  kind: "EagerReaderArtifact",
+  fieldName: "Query.linkedUpdate",
+  resolver,
+  readerAst,
+  hasUpdatable: true,
+};
+
+export default artifact;

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

@@ -2,43 +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,
-    concreteType: "Economist",
-    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",
   networkRequestInfo: {
     kind: "NetworkRequestInfo",
-    queryText,
+    operation: {
+      kind: "Operation",
+      text: queryText,
+    },
     normalizationAst,
   },
   concreteType: "Query",

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/query_text.ts

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

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

@@ -10,14 +10,17 @@ const readerAst: ReaderAst<Query__meName__param> = [
     alias: null,
     arguments: null,
     condition: null,
+    isUpdatable: false,
     selections: [
       {
         kind: "Scalar",
         fieldName: "name",
         alias: null,
         arguments: null,
+        isUpdatable: false,
       },
     ],
+    refetchQueryIndex: null,
   },
 ];
 
@@ -26,8 +29,10 @@ const artifact: EagerReaderArtifact<
   Query__meName__output_type
 > = {
   kind: "EagerReaderArtifact",
+  fieldName: "Query.meName",
   resolver,
   readerAst,
+  hasUpdatable: false,
 };
 
 export default artifact;