@isograph/react 0.2.0 → 0.3.0

package/src/core/makeNetworkRequest.ts

@@ -10,32 +10,90 @@ import {
   retainQuery,
   unretainQuery,
 } from './garbageCollection';
-import { IsographEnvironment } from './IsographEnvironment';
-import { AnyError, PromiseWrapper, wrapPromise } from './PromiseWrapper';
+import { IsographEnvironment, ROOT_ID } from './IsographEnvironment';
+import {
+  AnyError,
+  PromiseWrapper,
+  wrapPromise,
+  wrapResolvedValue,
+} from './PromiseWrapper';
 import { normalizeData } from './cache';
+import { logMessage } from './logging';
+import { check, DEFAULT_SHOULD_FETCH_VALUE, FetchOptions } from './check';
 
-export function makeNetworkRequest(
+let networkRequestId = 0;
+
+export function maybeMakeNetworkRequest(
   environment: IsographEnvironment,
   artifact: RefetchQueryNormalizationArtifact | IsographEntrypoint<any, any>,
   variables: Variables,
+  fetchOptions?: FetchOptions,
 ): ItemCleanupPair<PromiseWrapper<void, AnyError>> {
-  // @ts-expect-error
-  if (typeof window !== 'undefined' && window.__LOG) {
-    console.log('make network request', artifact, variables);
+  switch (fetchOptions?.shouldFetch ?? DEFAULT_SHOULD_FETCH_VALUE) {
+    case 'Yes': {
+      return makeNetworkRequest(environment, artifact, variables, fetchOptions);
+    }
+    case 'No': {
+      return [wrapResolvedValue(undefined), () => {}];
+    }
+    case 'IfNecessary': {
+      const result = check(
+        environment,
+        artifact.networkRequestInfo.normalizationAst,
+        variables,
+        {
+          __link: ROOT_ID,
+          __typename: artifact.concreteType,
+        },
+      );
+      if (result.kind === 'EnoughData') {
+        return [wrapResolvedValue(undefined), () => {}];
+      } else {
+        return makeNetworkRequest(
+          environment,
+          artifact,
+          variables,
+          fetchOptions,
+        );
+      }
+    }
   }
+}
+
+export function makeNetworkRequest(
+  environment: IsographEnvironment,
+  artifact: RefetchQueryNormalizationArtifact | IsographEntrypoint<any, any>,
+  variables: Variables,
+  fetchOptions?: FetchOptions,
+): ItemCleanupPair<PromiseWrapper<void, AnyError>> {
+  // TODO this should be a DataId and stored in the store
+  const myNetworkRequestId = networkRequestId + '';
+  networkRequestId++;
+
+  logMessage(environment, {
+    kind: 'MakeNetworkRequest',
+    artifact,
+    variables,
+    networkRequestId: myNetworkRequestId,
+  });
+
   let status: NetworkRequestStatus = {
     kind: 'UndisposedIncomplete',
   };
   // This should be an observable, not a promise
   const promise = environment
-    .networkFunction(artifact.queryText, variables)
+    .networkFunction(artifact.networkRequestInfo.queryText, variables)
     .then((networkResponse) => {
-      // @ts-expect-error
-      if (typeof window !== 'undefined' && window.__LOG) {
-        console.log('network response', artifact, networkResponse);
-      }
+      logMessage(environment, {
+        kind: 'ReceivedNetworkResponse',
+        networkResponse,
+        networkRequestId: myNetworkRequestId,
+      });
 
       if (networkResponse.errors != null) {
+        try {
+          fetchOptions?.onError?.();
+        } catch {}
         // @ts-expect-error Why are we getting the wrong constructor here?
         throw new Error('GraphQL network response had errors', {
           cause: networkResponse,
@@ -43,18 +101,21 @@ export function makeNetworkRequest(
       }
 
       if (status.kind === 'UndisposedIncomplete') {
+        const root = { __link: ROOT_ID, __typename: artifact.concreteType };
         normalizeData(
           environment,
-          artifact.normalizationAst,
+          artifact.networkRequestInfo.normalizationAst,
           networkResponse.data ?? {},
           variables,
           artifact.kind === 'Entrypoint'
             ? artifact.readerWithRefetchQueries.nestedRefetchQueries
             : [],
+          root,
         );
         const retainedQuery = {
-          normalizationAst: artifact.normalizationAst,
+          normalizationAst: artifact.networkRequestInfo.normalizationAst,
           variables,
+          root,
         };
         status = {
           kind: 'UndisposedComplete',
@@ -62,6 +123,21 @@ export function makeNetworkRequest(
         };
         retainQuery(environment, retainedQuery);
       }
+
+      try {
+        fetchOptions?.onComplete?.();
+      } catch {}
+    })
+    .catch((e) => {
+      logMessage(environment, {
+        kind: 'ReceivedNetworkError',
+        networkRequestId: myNetworkRequestId,
+        error: e,
+      });
+      try {
+        fetchOptions?.onError?.();
+      } catch {}
+      throw e;
     });
 
   const wrapper = wrapPromise(promise);

package/src/core/read.ts

@@ -1,19 +1,27 @@
-import { CleanupFn } from '@isograph/isograph-disposable-types/dist';
-import { getParentRecordKey, onNextChange } from './cache';
+import {
+  getParentRecordKey,
+  insertIfNotExists,
+  onNextChangeToRecord,
+  type EncounteredIds,
+} from './cache';
 import { getOrCreateCachedComponent } from './componentCache';
 import {
   IsographEntrypoint,
   RefetchQueryNormalizationArtifactWrapper,
 } from './entrypoint';
-import { FragmentReference, Variables } from './FragmentReference';
+import {
+  FragmentReference,
+  Variables,
+  ExtractData,
+  ExtractParameters,
+} from './FragmentReference';
 import {
   assertLink,
-  DataId,
-  defaultMissingFieldHandler,
   getOrLoadIsographArtifact,
   IsographEnvironment,
+  type Link,
 } from './IsographEnvironment';
-import { makeNetworkRequest } from './makeNetworkRequest';
+import { maybeMakeNetworkRequest } from './makeNetworkRequest';
 import {
   getPromiseState,
   PromiseWrapper,
@@ -23,18 +31,23 @@ import {
 } from './PromiseWrapper';
 import { ReaderAst } from './reader';
 import { Arguments } from './util';
+import { logMessage } from './logging';
+import { CleanupFn } from '@isograph/disposable-types';
+import { FetchOptions } from './check';
 
 export type WithEncounteredRecords<T> = {
-  readonly encounteredRecords: Set<DataId>;
-  readonly item: T;
+  readonly encounteredRecords: EncounteredIds;
+  readonly item: ExtractData<T>;
 };
 
-export function readButDoNotEvaluate<TReadFromStore extends Object>(
+export function readButDoNotEvaluate<
+  TReadFromStore extends { parameters: object; data: object },
+>(
   environment: IsographEnvironment,
   fragmentReference: FragmentReference<TReadFromStore, unknown>,
   networkRequestOptions: NetworkRequestReaderOptions,
 ): WithEncounteredRecords<TReadFromStore> {
-  const mutableEncounteredRecords = new Set<DataId>();
+  const mutableEncounteredRecords: EncounteredIds = new Map();
 
   const readerWithRefetchQueries = readPromise(
     fragmentReference.readerWithRefetchQueries,
@@ -50,10 +63,12 @@ export function readButDoNotEvaluate<TReadFromStore extends Object>(
     networkRequestOptions,
     mutableEncounteredRecords,
   );
-  // @ts-expect-error
-  if (typeof window !== 'undefined' && window.__LOG) {
-    console.log('done reading', { response });
-  }
+
+  logMessage(environment, {
+    kind: 'DoneReading',
+    response,
+  });
+
   if (response.kind === 'MissingData') {
     // There are two cases here that we care about:
     // 1. the network request is in flight, we haven't suspend on it, and we want
@@ -70,11 +85,11 @@ export function readButDoNotEvaluate<TReadFromStore extends Object>(
     ) {
       // TODO assert that the network request state is not Err
       throw new Promise((resolve, reject) => {
-        onNextChange(environment).then(resolve);
+        onNextChangeToRecord(environment, response.recordLink).then(resolve);
         fragmentReference.networkRequest.promise.catch(reject);
       });
     }
-    throw onNextChange(environment);
+    throw onNextChangeToRecord(environment, response.recordLink);
   } else {
     return {
       encounteredRecords: mutableEncounteredRecords,
@@ -83,34 +98,40 @@ export function readButDoNotEvaluate<TReadFromStore extends Object>(
   }
 }
 
-type ReadDataResult<TReadFromStore> =
+export type ReadDataResult<TReadFromStore> =
   | {
       readonly kind: 'Success';
-      readonly data: TReadFromStore;
-      readonly encounteredRecords: Set<DataId>;
+      readonly data: ExtractData<TReadFromStore>;
+      readonly encounteredRecords: EncounteredIds;
     }
   | {
       readonly kind: 'MissingData';
       readonly reason: string;
       readonly nestedReason?: ReadDataResult<unknown>;
+      readonly recordLink: Link;
     };
 
 function readData<TReadFromStore>(
   environment: IsographEnvironment,
   ast: ReaderAst<TReadFromStore>,
-  root: DataId,
-  variables: Variables,
+  root: Link,
+  variables: ExtractParameters<TReadFromStore>,
   nestedRefetchQueries: RefetchQueryNormalizationArtifactWrapper[],
   networkRequest: PromiseWrapper<void, any>,
   networkRequestOptions: NetworkRequestReaderOptions,
-  mutableEncounteredRecords: Set<DataId>,
+  mutableEncounteredRecords: EncounteredIds,
 ): ReadDataResult<TReadFromStore> {
-  mutableEncounteredRecords.add(root);
-  let storeRecord = environment.store[root];
+  const encounteredIds = insertIfNotExists(
+    mutableEncounteredRecords,
+    root.__typename,
+  );
+  encounteredIds.add(root.__link);
+  let storeRecord = environment.store[root.__typename]?.[root.__link];
   if (storeRecord === undefined) {
     return {
       kind: 'MissingData',
-      reason: 'No record for root ' + root,
+      reason: 'No record for root ' + root.__link,
+      recordLink: root,
     };
   }
 
@@ -134,7 +155,9 @@ function readData<TReadFromStore>(
         if (value === undefined) {
           return {
             kind: 'MissingData',
-            reason: 'No value for ' + storeRecordName + ' on root ' + root,
+            reason:
+              'No value for ' + storeRecordName + ' on root ' + root.__link,
+            recordLink: root,
           };
         }
         target[field.alias ?? field.fieldName] = value;
@@ -154,18 +177,20 @@ function readData<TReadFromStore>(
                   'No link for ' +
                   storeRecordName +
                   ' on root ' +
-                  root +
+                  root.__link +
                   '. Link is ' +
                   JSON.stringify(item),
+                recordLink: root,
               };
             } else if (link === null) {
               results.push(null);
               continue;
             }
+
             const result = readData(
               environment,
               field.selections,
-              link.__link,
+              link,
               variables,
               nestedRefetchQueries,
               networkRequest,
@@ -179,10 +204,11 @@ function readData<TReadFromStore>(
                   'Missing data for ' +
                   storeRecordName +
                   ' on root ' +
-                  root +
+                  root.__link +
                   '. Link is ' +
                   JSON.stringify(item),
                 nestedReason: result,
+                recordLink: result.recordLink,
               };
             }
             results.push(result.data);
@@ -191,17 +217,63 @@ function readData<TReadFromStore>(
           break;
         }
         let link = assertLink(value);
+
+        if (field.condition) {
+          const data = readData(
+            environment,
+            field.condition.readerAst,
+            root,
+            variables,
+            nestedRefetchQueries,
+            networkRequest,
+            networkRequestOptions,
+            mutableEncounteredRecords,
+          );
+          if (data.kind === 'MissingData') {
+            return {
+              kind: 'MissingData',
+              reason:
+                'Missing data for ' +
+                storeRecordName +
+                ' on root ' +
+                root.__link,
+              nestedReason: data,
+              recordLink: data.recordLink,
+            };
+          }
+          const condition = field.condition.resolver({
+            data: data.data,
+            parameters: {},
+          });
+          if (condition === true) {
+            link = root;
+          } else if (condition === false) {
+            link = null;
+          } else {
+            link = condition;
+          }
+        }
+
         if (link === undefined) {
           // TODO make this configurable, and also generated and derived from the schema
-          const missingFieldHandler =
-            environment.missingFieldHandler ?? defaultMissingFieldHandler;
-          const altLink = missingFieldHandler(
+          const missingFieldHandler = environment.missingFieldHandler;
+
+          const altLink = missingFieldHandler?.(
             storeRecord,
             root,
             field.fieldName,
             field.arguments,
             variables,
           );
+          logMessage(environment, {
+            kind: 'MissingFieldHandlerCalled',
+            root,
+            storeRecord,
+            fieldName: field.fieldName,
+            arguments: field.arguments,
+            variables,
+          });
+
           if (altLink === undefined) {
             return {
               kind: 'MissingData',
@@ -209,9 +281,10 @@ function readData<TReadFromStore>(
                 'No link for ' +
                 storeRecordName +
                 ' on root ' +
-                root +
+                root.__link +
                 '. Link is ' +
                 JSON.stringify(value),
+              recordLink: root,
             };
           } else {
             link = altLink;
@@ -220,7 +293,7 @@ function readData<TReadFromStore>(
           target[field.alias ?? field.fieldName] = null;
           break;
         }
-        const targetId = link.__link;
+        const targetId = link;
         const data = readData(
           environment,
           field.selections,
@@ -234,8 +307,10 @@ function readData<TReadFromStore>(
         if (data.kind === 'MissingData') {
           return {
             kind: 'MissingData',
-            reason: 'Missing data for ' + storeRecordName + ' on root ' + root,
+            reason:
+              'Missing data for ' + storeRecordName + ' on root ' + root.__link,
             nestedReason: data,
+            recordLink: data.recordLink,
           };
         }
         target[field.alias ?? field.fieldName] = data.data;
@@ -260,15 +335,19 @@ function readData<TReadFromStore>(
         if (data.kind === 'MissingData') {
           return {
             kind: 'MissingData',
-            reason: 'Missing data for ' + field.alias + ' on root ' + root,
+            reason:
+              'Missing data for ' + field.alias + ' on root ' + root.__link,
             nestedReason: data,
+            recordLink: data.recordLink,
           };
         } else {
           const refetchQueryIndex = field.refetchQuery;
-          if (refetchQueryIndex == null) {
-            throw new Error('refetchQuery is null in RefetchField');
-          }
           const refetchQuery = nestedRefetchQueries[refetchQueryIndex];
+          if (refetchQuery == null) {
+            throw new Error(
+              'refetchQuery is null in RefetchField. This is indicative of a bug in Isograph.',
+            );
+          }
           const refetchQueryArtifact = refetchQuery.artifact;
           const allowedVariables = refetchQuery.allowedVariables;
 
@@ -276,7 +355,7 @@ function readData<TReadFromStore>(
           // use the resolver reader AST to get the resolver parameters.
           target[field.alias] = (args: any) => [
             // Stable id
-            root + '__' + field.name,
+            root.__link + '__' + field.name,
             // Fetcher
             field.refetchReaderArtifact.resolver(
               environment,
@@ -294,9 +373,15 @@ function readData<TReadFromStore>(
       }
       case 'Resolver': {
         const usedRefetchQueries = field.usedRefetchQueries;
-        const resolverRefetchQueries = usedRefetchQueries.map(
-          (index) => nestedRefetchQueries[index],
-        );
+        const resolverRefetchQueries = usedRefetchQueries.map((index) => {
+          const resolverRefetchQuery = nestedRefetchQueries[index];
+          if (resolverRefetchQuery == null) {
+            throw new Error(
+              'resolverRefetchQuery is null in Resolver. This is indicative of a bug in Isograph.',
+            );
+          }
+          return resolverRefetchQuery;
+        });
 
         switch (field.readerArtifact.kind) {
           case 'EagerReaderArtifact': {
@@ -304,7 +389,7 @@ function readData<TReadFromStore>(
               environment,
               field.readerArtifact.readerAst,
               root,
-              variables,
+              generateChildVariableMap(variables, field.arguments),
               resolverRefetchQueries,
               networkRequest,
               networkRequestOptions,
@@ -313,11 +398,18 @@ function readData<TReadFromStore>(
             if (data.kind === 'MissingData') {
               return {
                 kind: 'MissingData',
-                reason: 'Missing data for ' + field.alias + ' on root ' + root,
+                reason:
+                  'Missing data for ' + field.alias + ' on root ' + root.__link,
                 nestedReason: data,
+                recordLink: data.recordLink,
               };
             } else {
-              target[field.alias] = field.readerArtifact.resolver(data.data);
+              const firstParameter = {
+                data: data.data,
+                parameters: variables,
+              };
+              target[field.alias] =
+                field.readerArtifact.resolver(firstParameter);
             }
             break;
           }
@@ -363,11 +455,13 @@ function readData<TReadFromStore>(
         if (refetchReaderParams.kind === 'MissingData') {
           return {
             kind: 'MissingData',
-            reason: 'Missing data for ' + field.alias + ' on root ' + root,
+            reason:
+              'Missing data for ' + field.alias + ' on root ' + root.__link,
             nestedReason: refetchReaderParams,
+            recordLink: refetchReaderParams.recordLink,
           };
         } else {
-          target[field.alias] = (args: any) => {
+          target[field.alias] = (args: any, fetchOptions?: FetchOptions) => {
             // TODO we should use the reader AST for this
             const includeReadOutData = (variables: any, readOutData: any) => {
               variables.id = readOutData.id;
@@ -385,7 +479,9 @@ function readData<TReadFromStore>(
 
             return [
               // Stable id
-              root +
+              root.__typename +
+                ':' +
+                root.__link +
                 '/' +
                 field.name +
                 '/' +
@@ -396,7 +492,12 @@ function readData<TReadFromStore>(
                   entrypoint: IsographEntrypoint<any, any>,
                 ): [FragmentReference<any, any>, CleanupFn] => {
                   const [networkRequest, disposeNetworkRequest] =
-                    makeNetworkRequest(environment, entrypoint, localVariables);
+                    maybeMakeNetworkRequest(
+                      environment,
+                      entrypoint,
+                      localVariables,
+                      fetchOptions,
+                    );
 
                   const fragmentReference: FragmentReference<any, any> = {
                     kind: 'FragmentReference',
@@ -410,7 +511,7 @@ function readData<TReadFromStore>(
                     } as const),
 
                     // TODO localVariables is not guaranteed to have an id field
-                    root: localVariables.id,
+                    root,
                     variables: localVariables,
                     networkRequest,
                   };
@@ -453,10 +554,11 @@ function readData<TReadFromStore>(
                             entrypointLoaderState.kind === 'EntrypointNotLoaded'
                           ) {
                             const [networkRequest, disposeNetworkRequest] =
-                              makeNetworkRequest(
+                              maybeMakeNetworkRequest(
                                 environment,
                                 entrypoint,
                                 localVariables,
+                                fetchOptions,
                               );
                             entrypointLoaderState = {
                               kind: 'NetworkRequestStarted',
@@ -479,7 +581,7 @@ function readData<TReadFromStore>(
                       ),
 
                       // TODO localVariables is not guaranteed to have an id field
-                      root: localVariables.id,
+                      root,
                       variables: localVariables,
                       networkRequest,
                     };
@@ -542,7 +644,12 @@ function generateChildVariableMap(
   const childVars: Writable<Variables> = {};
   for (const [name, value] of fieldArguments) {
     if (value.kind === 'Variable') {
-      childVars[name] = variables[value.name];
+      const variable = variables[value.name];
+      // Variable could be null if it was not provided but has a default case,
+      // so we allow the loop to continue rather than throwing an error.
+      if (variable != null) {
+        childVars[name] = variable;
+      }
     } else {
       childVars[name] = value.value;
     }
@@ -603,7 +710,7 @@ export function getNetworkRequestOptionsWithDefaults(
 // TODO call stableStringifyArgs on the variable values, as well.
 // This doesn't matter for now, since we are just using primitive values
 // in the demo.
-function stableStringifyArgs(args: Object) {
+function stableStringifyArgs(args: object) {
   const keys = Object.keys(args);
   keys.sort();
   let s = '';