@isograph/react 0.4.2 → 0.5.0

package/src/react/LoadableFieldRenderer.tsx

@@ -9,25 +9,43 @@ import { type LoadableField } from '../core/reader';
 import { useClientSideDefer } from '../loadable-hooks/useClientSideDefer';
 import { useResult } from './useResult';
 
+type ArgsWithoutProvidedArgs<
+  TReadFromStore extends UnknownTReadFromStore,
+  TProvidedArgs extends object,
+> = Omit<ExtractParameters<TReadFromStore>, keyof TProvidedArgs>;
+
+type MaybeRequiredArgs<
+  TReadFromStore extends UnknownTReadFromStore,
+  TProvidedArgs extends object,
+> =
+  {} extends ArgsWithoutProvidedArgs<TReadFromStore, TProvidedArgs>
+    ? {
+        args?: ArgsWithoutProvidedArgs<TReadFromStore, TProvidedArgs>;
+      }
+    : {
+        args: ArgsWithoutProvidedArgs<TReadFromStore, TProvidedArgs>;
+      };
+
 export function LoadableFieldRenderer<
   TReadFromStore extends UnknownTReadFromStore,
   TProvidedArgs extends object,
   TChildrenResult,
   TProps,
->(props: {
-  loadableField: LoadableField<
-    TReadFromStore,
-    React.FC<TProps>,
-    Omit<ExtractParameters<TReadFromStore>, keyof TProvidedArgs>
-  >;
-  // TODO we can improve this to not require args if its an empty object
-  args: Omit<ExtractParameters<TReadFromStore>, keyof TProvidedArgs>;
-  fetchOptions?: FetchOptions<React.FC<TProps>>;
-  networkRequestOptions?: Partial<NetworkRequestReaderOptions>;
-  additionalProps: Omit<TProps, keyof JSX.IntrinsicAttributes>;
-}): TChildrenResult {
+>(
+  props: {
+    loadableField: LoadableField<
+      TReadFromStore,
+      React.FC<TProps>,
+      Omit<ExtractParameters<TReadFromStore>, keyof TProvidedArgs>
+    >;
+    fetchOptions?: FetchOptions<React.FC<TProps>, never>;
+    networkRequestOptions?: Partial<NetworkRequestReaderOptions>;
+    additionalProps: Omit<TProps, keyof JSX.IntrinsicAttributes>;
+  } & MaybeRequiredArgs<TReadFromStore, TProvidedArgs>,
+): TChildrenResult {
   const { fragmentReference } = useClientSideDefer(
     props.loadableField,
+    // @ts-expect-error
     props.args,
     props.fetchOptions,
   );
@@ -39,3 +57,95 @@ export function LoadableFieldRenderer<
   // @ts-expect-error
   return <Component {...props.additionalProps} />;
 }
+
+// @ts-ignore
+function tsTests() {
+  let neverArgs!: LoadableField<
+    {
+      parameters: Record<string, never>;
+      data: {};
+    },
+    () => React.ReactNode
+  >;
+
+  let optionalArgs!: LoadableField<
+    {
+      parameters: {
+        foo?: string;
+      };
+      data: {};
+    },
+    () => React.ReactNode
+  >;
+
+  let requiredArgs!: LoadableField<
+    {
+      parameters: {
+        foo: string;
+      };
+      data: {};
+    },
+    () => React.ReactNode
+  >;
+
+  <LoadableFieldRenderer loadableField={neverArgs} additionalProps={{}} />;
+  <LoadableFieldRenderer
+    loadableField={neverArgs}
+    additionalProps={{}}
+    args={{}}
+  />;
+  <LoadableFieldRenderer
+    loadableField={neverArgs}
+    additionalProps={{}}
+    args={{
+      // @ts-expect-error
+      foo: 'bar',
+    }}
+  />;
+
+  <LoadableFieldRenderer loadableField={optionalArgs} additionalProps={{}} />;
+  <LoadableFieldRenderer
+    loadableField={optionalArgs}
+    additionalProps={{}}
+    args={{}}
+  />;
+  <LoadableFieldRenderer
+    loadableField={optionalArgs}
+    additionalProps={{}}
+    args={{
+      foo: 'bar',
+    }}
+  />;
+  <LoadableFieldRenderer
+    loadableField={optionalArgs}
+    additionalProps={{}}
+    args={{
+      // @ts-expect-error
+      foo: 12,
+    }}
+  />;
+
+  // @ts-expect-error
+  <LoadableFieldRenderer loadableField={requiredArgs} additionalProps={{}} />;
+  <LoadableFieldRenderer
+    loadableField={requiredArgs}
+    additionalProps={{}}
+    // @ts-expect-error
+    args={{}}
+  />;
+  <LoadableFieldRenderer
+    loadableField={requiredArgs}
+    additionalProps={{}}
+    args={{
+      foo: 'bar',
+    }}
+  />;
+  <LoadableFieldRenderer
+    loadableField={requiredArgs}
+    additionalProps={{}}
+    args={{
+      // @ts-expect-error
+      foo: 12,
+    }}
+  />;
+}

package/src/react/useImperativeReference.ts

@@ -2,6 +2,7 @@ import {
   UNASSIGNED_STATE,
   useUpdatableDisposableState,
 } from '@isograph/react-disposable-state';
+import type { NetworkResponseObject } from '../core/cache';
 import { FetchOptions, type RequiredFetchOptions } from '../core/check';
 import {
   IsographEntrypoint,
@@ -13,15 +14,18 @@ import {
   FragmentReference,
   type UnknownTReadFromStore,
 } from '../core/FragmentReference';
-import { ROOT_ID } from '../core/IsographEnvironment';
+import {
+  getOrLoadReaderWithRefetchQueries,
+  ROOT_ID,
+} from '../core/IsographEnvironment';
 import { maybeMakeNetworkRequest } from '../core/makeNetworkRequest';
-import { wrapPromise, wrapResolvedValue } from '../core/PromiseWrapper';
 import { useIsographEnvironment } from './IsographEnvironmentProvider';
 
 export type UseImperativeReferenceResult<
   TReadFromStore extends UnknownTReadFromStore,
   TClientFieldValue,
   TNormalizationAst extends NormalizationAst | NormalizationAstLoader,
+  TRawResponseType,
 > = {
   fragmentReference: FragmentReference<
     TReadFromStore,
@@ -31,7 +35,7 @@ export type UseImperativeReferenceResult<
     variables: ExtractParameters<TReadFromStore>,
     ...[fetchOptions]: NormalizationAstLoader extends TNormalizationAst
       ? [fetchOptions: RequiredFetchOptions<TClientFieldValue>]
-      : [fetchOptions?: FetchOptions<TClientFieldValue>]
+      : [fetchOptions?: FetchOptions<TClientFieldValue, TRawResponseType>]
   ) => void;
 };
 
@@ -39,16 +43,19 @@ export function useImperativeReference<
   TReadFromStore extends UnknownTReadFromStore,
   TClientFieldValue,
   TNormalizationAst extends NormalizationAst | NormalizationAstLoader,
+  TRawResponseType extends NetworkResponseObject,
 >(
   entrypoint: IsographEntrypoint<
     TReadFromStore,
     TClientFieldValue,
-    TNormalizationAst
+    TNormalizationAst,
+    TRawResponseType
   >,
 ): UseImperativeReferenceResult<
   TReadFromStore,
   TClientFieldValue,
-  TNormalizationAst
+  TNormalizationAst,
+  TRawResponseType
 > {
   const { state, setState } =
     useUpdatableDisposableState<
@@ -59,13 +66,13 @@ export function useImperativeReference<
     fragmentReference: state !== UNASSIGNED_STATE ? state : null,
     loadFragmentReference: (
       variables: ExtractParameters<TReadFromStore>,
-      fetchOptions?: FetchOptions<TClientFieldValue>,
+      fetchOptions?: FetchOptions<TClientFieldValue, TRawResponseType>,
     ) => {
-      const readerWithRefetchQueries =
-        entrypoint.readerWithRefetchQueries.kind ===
-        'ReaderWithRefetchQueriesLoader'
-          ? wrapPromise(entrypoint.readerWithRefetchQueries.loader())
-          : wrapResolvedValue(entrypoint.readerWithRefetchQueries);
+      const { fieldName, readerArtifactKind, readerWithRefetchQueries } =
+        getOrLoadReaderWithRefetchQueries(
+          environment,
+          entrypoint.readerWithRefetchQueries,
+        );
       const [networkRequest, disposeNetworkRequest] = maybeMakeNetworkRequest(
         environment,
         entrypoint,
@@ -77,6 +84,8 @@ export function useImperativeReference<
         {
           kind: 'FragmentReference',
           readerWithRefetchQueries,
+          fieldName,
+          readerArtifactKind,
           root: { __link: ROOT_ID, __typename: entrypoint.concreteType },
           variables,
           networkRequest,

package/src/react/useLazyReference.ts

@@ -1,5 +1,8 @@
 import { useLazyDisposableState } from '@isograph/react-disposable-state';
-import { getOrCreateCacheForArtifact } from '../core/cache';
+import {
+  getOrCreateCacheForArtifact,
+  type NetworkResponseObject,
+} from '../core/cache';
 import { FetchOptions, type RequiredFetchOptions } from '../core/check';
 import {
   IsographEntrypoint,
@@ -18,16 +21,18 @@ export function useLazyReference<
   TReadFromStore extends UnknownTReadFromStore,
   TClientFieldValue,
   TNormalizationAst extends NormalizationAst | NormalizationAstLoader,
+  TRawResponseType extends NetworkResponseObject,
 >(
   entrypoint: IsographEntrypoint<
     TReadFromStore,
     TClientFieldValue,
-    TNormalizationAst
+    TNormalizationAst,
+    TRawResponseType
   >,
   variables: ExtractParameters<TReadFromStore>,
   ...[fetchOptions]: TNormalizationAst extends NormalizationAstLoader
     ? [fetchOptions: RequiredFetchOptions<TClientFieldValue>]
-    : [fetchOptions?: FetchOptions<TClientFieldValue>]
+    : [fetchOptions?: FetchOptions<TClientFieldValue, TRawResponseType>]
 ): NormalizationAst | NormalizationAstLoader extends TNormalizationAst
   ? unknown
   : {
@@ -57,12 +62,18 @@ export function useLazyReference<
 
 // @ts-ignore
 function tsTests() {
-  let withAst!: IsographEntrypoint<any, unknown, NormalizationAst>;
-  let withAstLoader!: IsographEntrypoint<any, unknown, NormalizationAstLoader>;
+  let withAst!: IsographEntrypoint<any, unknown, NormalizationAst, any>;
+  let withAstLoader!: IsographEntrypoint<
+    any,
+    unknown,
+    NormalizationAstLoader,
+    {}
+  >;
   let withAstOrLoader!: IsographEntrypoint<
     any,
     unknown,
-    NormalizationAst | NormalizationAstLoader
+    NormalizationAst | NormalizationAstLoader,
+    {}
   >;
 
   useLazyReference(withAst, {}) satisfies {};

package/src/react/useReadAndSubscribe.ts

@@ -6,7 +6,6 @@ import {
   stableIdForFragmentReference,
   type UnknownTReadFromStore,
 } from '../core/FragmentReference';
-import { readPromise } from '../core/PromiseWrapper';
 import {
   NetworkRequestReaderOptions,
   readButDoNotEvaluate,
@@ -75,13 +74,7 @@ export function useSubscribeToMultiple<
     [
       items
         .map(({ fragmentReference }) => {
-          const readerWithRefetchQueries = readPromise(
-            fragmentReference.readerWithRefetchQueries,
-          );
-          stableIdForFragmentReference(
-            fragmentReference,
-            readerWithRefetchQueries.readerArtifact.fieldName,
-          );
+          stableIdForFragmentReference(fragmentReference);
         })
         .join('.'),
     ],

package/src/react/useResult.ts

@@ -28,25 +28,23 @@ export function useResult<
     partialNetworkRequestOptions,
   );
 
-  maybeUnwrapNetworkRequest(
-    fragmentReference.networkRequest,
-    networkRequestOptions,
-  );
-  const readerWithRefetchQueries = readPromise(
-    fragmentReference.readerWithRefetchQueries,
-  );
-
-  switch (readerWithRefetchQueries.readerArtifact.kind) {
+  switch (fragmentReference.readerArtifactKind) {
     case 'ComponentReaderArtifact': {
       // @ts-expect-error
       return getOrCreateCachedComponent(
         environment,
-        readerWithRefetchQueries.readerArtifact.fieldName,
         fragmentReference,
         networkRequestOptions,
       );
     }
     case 'EagerReaderArtifact': {
+      maybeUnwrapNetworkRequest(
+        fragmentReference.networkRequest,
+        networkRequestOptions,
+      );
+      const readerWithRefetchQueries = readPromise(
+        fragmentReference.readerWithRefetchQueries,
+      );
       const data = useReadAndSubscribe(
         fragmentReference,
         networkRequestOptions,
@@ -60,12 +58,12 @@ export function useResult<
               startUpdate: getOrCreateCachedStartUpdate(
                 environment,
                 fragmentReference,
-                readerWithRefetchQueries.readerArtifact.fieldName,
                 networkRequestOptions,
               ),
             }
           : undefined),
       };
+      // @ts-expect-error
       return readerWithRefetchQueries.readerArtifact.resolver(param);
     }
   }

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/Node/asEconomist/resolver_reader.ts

@@ -10,7 +10,7 @@ const readerAst: ReaderAst<{ data: any, parameters: Record<PropertyKey, never> }
   },
   {
     kind: "Link",
-    alias: "link",
+    alias: "__link",
   },
 ];
 
@@ -19,8 +19,8 @@ const artifact: EagerReaderArtifact<
   Link<"Economist"> | null
 > = {
   kind: "EagerReaderArtifact",
-  fieldName: "Node.asEconomist",
-  resolver: ({ data }) => data.__typename === "Economist" ? data.link : null,
+  fieldName: "asEconomist",
+  resolver: ({ data }) => data.__typename === "Economist" ? data.__link : null,
   readerAst,
   hasUpdatable: false,
 };

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

@@ -1,6 +1,7 @@
 import type {IsographEntrypoint, NormalizationAst, RefetchQueryNormalizationArtifactWrapper} from '@isograph/react';
 import {Query__linkedUpdate__param} from './param_type';
 import {Query__linkedUpdate__output_type} from './output_type';
+import type {Query__linkedUpdate__raw_response_type} from './raw_response_type';
 import readerResolver from './resolver_reader';
 import queryText from './query_text';
 import normalizationAst from './normalization_ast';
@@ -9,7 +10,8 @@ const nestedRefetchQueries: RefetchQueryNormalizationArtifactWrapper[] = [];
 const artifact: IsographEntrypoint<
   Query__linkedUpdate__param,
   Query__linkedUpdate__output_type,
-  NormalizationAst
+  NormalizationAst,
+  Query__linkedUpdate__raw_response_type
 > = {
   kind: "Entrypoint",
   networkRequestInfo: {

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

@@ -1,4 +1,4 @@
-import { type Node__link__output_type } from '../../Node/link/output_type';
+import { type Node____link__output_type } from '../../Node/__link/output_type';
 import type { StartUpdate } from '@isograph/react';
 
 export type Query__linkedUpdate__param = {
@@ -15,7 +15,7 @@ A client pointer for the Economist type.
       /**
 A store Link for the Node type.
       */
-      readonly link: Node__link__output_type,
+      readonly __link: Node____link__output_type,
       /**
 A client pointer for the Economist type.
       */
@@ -34,12 +34,12 @@ A client pointer for the Economist type.
         name: string,
       } | null),
     } | null),
-    set node(value: ({ link: Node__link__output_type } | 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,
+      readonly __link: Node____link__output_type,
       /**
 A client pointer for the Economist type.
       */

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

@@ -0,0 +1,13 @@
+export type Query__linkedUpdate__raw_response_type = {
+  node____id___l_0?: ({
+    __typename: "Economist",
+    id: string,
+    name: string,
+  } | null),
+  node____id___l_1?: ({
+    __typename: "Economist",
+    id: string,
+    name: string,
+  } | null),
+}
+

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

@@ -17,6 +17,7 @@ const readerAst: ReaderAst<Query__linkedUpdate__param> = [
     ],
     condition: null,
     isUpdatable: true,
+    refetchQueryIndex: null,
     selections: [
       {
         kind: "Linked",
@@ -25,6 +26,7 @@ const readerAst: ReaderAst<Query__linkedUpdate__param> = [
         arguments: null,
         condition: Node__asEconomist__resolver_reader,
         isUpdatable: false,
+        refetchQueryIndex: null,
         selections: [
           {
             kind: "Scalar",
@@ -34,10 +36,8 @@ const readerAst: ReaderAst<Query__linkedUpdate__param> = [
             isUpdatable: true,
           },
         ],
-        refetchQueryIndex: null,
       },
     ],
-    refetchQueryIndex: null,
   },
   {
     kind: "Linked",
@@ -51,10 +51,11 @@ const readerAst: ReaderAst<Query__linkedUpdate__param> = [
     ],
     condition: null,
     isUpdatable: false,
+    refetchQueryIndex: null,
     selections: [
       {
         kind: "Link",
-        alias: "link",
+        alias: "__link",
       },
       {
         kind: "Linked",
@@ -63,6 +64,7 @@ const readerAst: ReaderAst<Query__linkedUpdate__param> = [
         arguments: null,
         condition: Node__asEconomist__resolver_reader,
         isUpdatable: false,
+        refetchQueryIndex: null,
         selections: [
           {
             kind: "Scalar",
@@ -72,10 +74,8 @@ const readerAst: ReaderAst<Query__linkedUpdate__param> = [
             isUpdatable: false,
           },
         ],
-        refetchQueryIndex: null,
       },
     ],
-    refetchQueryIndex: null,
   },
 ];
 
@@ -84,7 +84,7 @@ const artifact: EagerReaderArtifact<
   Query__linkedUpdate__output_type
 > = {
   kind: "EagerReaderArtifact",
-  fieldName: "Query.linkedUpdate",
+  fieldName: "linkedUpdate",
   resolver,
   readerAst,
   hasUpdatable: true,

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

@@ -1,6 +1,7 @@
 import type {IsographEntrypoint, NormalizationAst, RefetchQueryNormalizationArtifactWrapper} from '@isograph/react';
 import {Query__meName__param} from './param_type';
 import {Query__meName__output_type} from './output_type';
+import type {Query__meName__raw_response_type} from './raw_response_type';
 import readerResolver from './resolver_reader';
 import queryText from './query_text';
 import normalizationAst from './normalization_ast';
@@ -9,7 +10,8 @@ const nestedRefetchQueries: RefetchQueryNormalizationArtifactWrapper[] = [];
 const artifact: IsographEntrypoint<
   Query__meName__param,
   Query__meName__output_type,
-  NormalizationAst
+  NormalizationAst,
+  Query__meName__raw_response_type
 > = {
   kind: "Entrypoint",
   networkRequestInfo: {

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

@@ -0,0 +1,7 @@
+export type Query__meName__raw_response_type = {
+  me: {
+    id: string,
+    name: string,
+  },
+}
+

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

@@ -11,6 +11,7 @@ const readerAst: ReaderAst<Query__meName__param> = [
     arguments: null,
     condition: null,
     isUpdatable: false,
+    refetchQueryIndex: null,
     selections: [
       {
         kind: "Scalar",
@@ -20,7 +21,6 @@ const readerAst: ReaderAst<Query__meName__param> = [
         isUpdatable: false,
       },
     ],
-    refetchQueryIndex: null,
   },
 ];
 
@@ -29,7 +29,7 @@ const artifact: EagerReaderArtifact<
   Query__meName__output_type
 > = {
   kind: "EagerReaderArtifact",
-  fieldName: "Query.meName",
+  fieldName: "meName",
   resolver,
   readerAst,
   hasUpdatable: false,

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

@@ -1,6 +1,7 @@
 import type {IsographEntrypoint, NormalizationAst, RefetchQueryNormalizationArtifactWrapper} from '@isograph/react';
 import {Query__meNameSuccessor__param} from './param_type';
 import {Query__meNameSuccessor__output_type} from './output_type';
+import type {Query__meNameSuccessor__raw_response_type} from './raw_response_type';
 import readerResolver from './resolver_reader';
 import queryText from './query_text';
 import normalizationAst from './normalization_ast';
@@ -9,7 +10,8 @@ const nestedRefetchQueries: RefetchQueryNormalizationArtifactWrapper[] = [];
 const artifact: IsographEntrypoint<
   Query__meNameSuccessor__param,
   Query__meNameSuccessor__output_type,
-  NormalizationAst
+  NormalizationAst,
+  Query__meNameSuccessor__raw_response_type
 > = {
   kind: "Entrypoint",
   networkRequestInfo: {

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

@@ -0,0 +1,14 @@
+export type Query__meNameSuccessor__raw_response_type = {
+  me: {
+    id: string,
+    name: string,
+    successor?: ({
+      id: string,
+      successor?: ({
+        id: string,
+        name: string,
+      } | null),
+    } | null),
+  },
+}
+

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

@@ -11,6 +11,7 @@ const readerAst: ReaderAst<Query__meNameSuccessor__param> = [
     arguments: null,
     condition: null,
     isUpdatable: false,
+    refetchQueryIndex: null,
     selections: [
       {
         kind: "Scalar",
@@ -26,6 +27,7 @@ const readerAst: ReaderAst<Query__meNameSuccessor__param> = [
         arguments: null,
         condition: null,
         isUpdatable: false,
+        refetchQueryIndex: null,
         selections: [
           {
             kind: "Linked",
@@ -34,6 +36,7 @@ const readerAst: ReaderAst<Query__meNameSuccessor__param> = [
             arguments: null,
             condition: null,
             isUpdatable: false,
+            refetchQueryIndex: null,
             selections: [
               {
                 kind: "Scalar",
@@ -43,13 +46,10 @@ const readerAst: ReaderAst<Query__meNameSuccessor__param> = [
                 isUpdatable: false,
               },
             ],
-            refetchQueryIndex: null,
           },
         ],
-        refetchQueryIndex: null,
       },
     ],
-    refetchQueryIndex: null,
   },
 ];
 
@@ -58,7 +58,7 @@ const artifact: EagerReaderArtifact<
   Query__meNameSuccessor__output_type
 > = {
   kind: "EagerReaderArtifact",
-  fieldName: "Query.meNameSuccessor",
+  fieldName: "meNameSuccessor",
   resolver,
   readerAst,
   hasUpdatable: false,

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

@@ -1,6 +1,7 @@
 import type {IsographEntrypoint, NormalizationAst, RefetchQueryNormalizationArtifactWrapper} from '@isograph/react';
 import {Query__nodeField__param} from './param_type';
 import {Query__nodeField__output_type} from './output_type';
+import type {Query__nodeField__raw_response_type} from './raw_response_type';
 import readerResolver from './resolver_reader';
 import queryText from './query_text';
 import normalizationAst from './normalization_ast';
@@ -9,7 +10,8 @@ const nestedRefetchQueries: RefetchQueryNormalizationArtifactWrapper[] = [];
 const artifact: IsographEntrypoint<
   Query__nodeField__param,
   Query__nodeField__output_type,
-  NormalizationAst
+  NormalizationAst,
+  Query__nodeField__raw_response_type
 > = {
   kind: "Entrypoint",
   networkRequestInfo: {

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

@@ -0,0 +1,7 @@
+export type Query__nodeField__raw_response_type = {
+  node____id___v_id?: ({
+    __typename: string,
+    id: string,
+  } | null),
+}
+