@isograph/react 0.2.0 → 0.3.1

package/src/core/logging.ts

@@ -0,0 +1,118 @@
+import { CleanupFn } from '@isograph/disposable-types';
+import { NetworkResponseObject, type EncounteredIds } from './cache';
+import { CheckResult } from './check';
+import {
+  IsographEntrypoint,
+  RefetchQueryNormalizationArtifact,
+  type NormalizationAstNodes,
+} from './entrypoint';
+import { FragmentReference, Variables } from './FragmentReference';
+import {
+  IsographEnvironment,
+  IsographStore,
+  StoreRecord,
+  type Link,
+} from './IsographEnvironment';
+import { ReadDataResult } from './read';
+import { Arguments } from './util';
+
+export type LogMessage =
+  | {
+      kind: 'AboutToNormalize';
+      normalizationAst: NormalizationAstNodes;
+      networkResponse: NetworkResponseObject;
+      variables: Variables;
+    }
+  | {
+      kind: 'AfterNormalization';
+      store: IsographStore;
+      encounteredIds: EncounteredIds;
+    }
+  | {
+      kind: 'DeepEqualityCheck';
+      fragmentReference: FragmentReference<any, any>;
+      old: object;
+      new: object;
+      deeplyEqual: boolean;
+    }
+  | {
+      kind: 'ComponentRerendered';
+      componentName: string;
+      rootLink: Link;
+    }
+  | {
+      kind: 'MakeNetworkRequest';
+      artifact:
+        | RefetchQueryNormalizationArtifact
+        | IsographEntrypoint<any, any, any>;
+      variables: Variables;
+      networkRequestId: string;
+    }
+  | {
+      kind: 'ReceivedNetworkResponse';
+      // TODO should be object
+      networkResponse: any;
+      networkRequestId: string;
+    }
+  | {
+      kind: 'ReceivedNetworkError';
+      error: any;
+      networkRequestId: string;
+    }
+  | {
+      kind: 'MissingFieldHandlerCalled';
+      root: Link;
+      storeRecord: StoreRecord;
+      fieldName: string;
+      arguments: Arguments | null;
+      variables: Variables;
+    }
+  | {
+      kind: 'DoneReading';
+      response: ReadDataResult<any>;
+      fieldName: string;
+      root: Link;
+    }
+  | {
+      kind: 'NonEntrypointReceived';
+      entrypoint: any;
+    }
+  | {
+      kind: 'EnvironmentCheck';
+      result: CheckResult;
+    }
+  | {
+      kind: 'EnvironmentCreated';
+    };
+
+export type LogFunction = (logMessage: LogMessage) => void;
+
+// wrapped so that items in the loggers set are unique.
+export type WrappedLogFunction = {
+  log: LogFunction;
+};
+
+export function logMessage(
+  environment: IsographEnvironment,
+  getMessage: () => LogMessage,
+) {
+  if (environment.loggers.size > 0) {
+    const message = getMessage();
+    for (const logger of environment.loggers) {
+      try {
+        logger.log(message);
+      } catch {}
+    }
+  }
+}
+
+export function registerLogger(
+  environment: IsographEnvironment,
+  log: LogFunction,
+): CleanupFn {
+  const wrapped = { log };
+  environment.loggers.add(wrapped);
+  return () => {
+    environment.loggers.delete(wrapped);
+  };
+}

package/src/core/makeNetworkRequest.ts

@@ -1,60 +1,168 @@
 import { ItemCleanupPair } from '@isograph/disposable-types';
+import { normalizeData } from './cache';
+import { check, DEFAULT_SHOULD_FETCH_VALUE, FetchOptions } from './check';
+import { getOrCreateCachedComponent } from './componentCache';
 import {
   IsographEntrypoint,
   RefetchQueryNormalizationArtifact,
+  type NormalizationAst,
+  type NormalizationAstLoader,
 } from './entrypoint';
-import { Variables } from './FragmentReference';
+import {
+  ExtractParameters,
+  type FragmentReference,
+  type UnknownTReadFromStore,
+} from './FragmentReference';
 import {
   garbageCollectEnvironment,
   RetainedQuery,
   retainQuery,
   unretainQuery,
 } from './garbageCollection';
-import { IsographEnvironment } from './IsographEnvironment';
-import { AnyError, PromiseWrapper, wrapPromise } from './PromiseWrapper';
-import { normalizeData } from './cache';
+import { IsographEnvironment, Link, ROOT_ID } from './IsographEnvironment';
+import { logMessage } from './logging';
+import {
+  AnyError,
+  PromiseWrapper,
+  wrapPromise,
+  wrapResolvedValue,
+} from './PromiseWrapper';
+import { readButDoNotEvaluate } from './read';
+import { getOrCreateCachedStartUpdate } from './startUpdate';
+
+let networkRequestId = 0;
 
-export function makeNetworkRequest(
+export function maybeMakeNetworkRequest<
+  TReadFromStore extends UnknownTReadFromStore,
+  TClientFieldValue,
+  TNormalizationAst extends NormalizationAst | NormalizationAstLoader,
+>(
   environment: IsographEnvironment,
-  artifact: RefetchQueryNormalizationArtifact | IsographEntrypoint<any, any>,
-  variables: Variables,
+  artifact:
+    | RefetchQueryNormalizationArtifact
+    | IsographEntrypoint<TReadFromStore, TClientFieldValue, TNormalizationAst>,
+  variables: ExtractParameters<TReadFromStore>,
+  fetchOptions?: FetchOptions<TClientFieldValue>,
 ): 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': {
+      if (
+        artifact.networkRequestInfo.normalizationAst.kind ===
+        'NormalizationAstLoader'
+      ) {
+        throw new Error(
+          'Using lazy loaded normalizationAst with shouldFetch: "IfNecessary" is not supported as it will lead to slower initial load time.',
+        );
+      }
+      const result = check(
+        environment,
+        artifact.networkRequestInfo.normalizationAst.selections,
+        variables,
+        {
+          __link: ROOT_ID,
+          __typename: artifact.concreteType,
+        },
+      );
+
+      if (result.kind === 'EnoughData') {
+        return [wrapResolvedValue(undefined), () => {}];
+      } else {
+        return makeNetworkRequest(
+          environment,
+          artifact,
+          variables,
+          fetchOptions,
+        );
+      }
+    }
+  }
+}
+
+function loadNormalizationAst(
+  normalizationAst: NormalizationAstLoader | NormalizationAst,
+) {
+  switch (normalizationAst.kind) {
+    case 'NormalizationAst': {
+      return normalizationAst;
+    }
+    case 'NormalizationAstLoader': {
+      return normalizationAst.loader();
+    }
   }
+}
+
+export function makeNetworkRequest<
+  TReadFromStore extends UnknownTReadFromStore,
+  TClientFieldValue,
+  TNormalizationAst extends NormalizationAst | NormalizationAstLoader,
+>(
+  environment: IsographEnvironment,
+  artifact:
+    | RefetchQueryNormalizationArtifact
+    | IsographEntrypoint<TReadFromStore, TClientFieldValue, TNormalizationAst>,
+  variables: ExtractParameters<TReadFromStore>,
+  fetchOptions?: FetchOptions<TClientFieldValue>,
+): 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)
-    .then((networkResponse) => {
-      // @ts-expect-error
-      if (typeof window !== 'undefined' && window.__LOG) {
-        console.log('network response', artifact, networkResponse);
-      }
+  const promise = Promise.all([
+    environment.networkFunction(
+      artifact.networkRequestInfo.queryText,
+      variables,
+    ),
+    loadNormalizationAst(artifact.networkRequestInfo.normalizationAst),
+  ])
+    .then(([networkResponse, normalizationAst]) => {
+      logMessage(environment, () => ({
+        kind: 'ReceivedNetworkResponse',
+        networkResponse,
+        networkRequestId: myNetworkRequestId,
+      }));
 
       if (networkResponse.errors != null) {
-        // @ts-expect-error Why are we getting the wrong constructor here?
+        try {
+          fetchOptions?.onError?.();
+        } catch {}
         throw new Error('GraphQL network response had errors', {
           cause: networkResponse,
         });
       }
 
+      const root = { __link: ROOT_ID, __typename: artifact.concreteType };
       if (status.kind === 'UndisposedIncomplete') {
         normalizeData(
           environment,
-          artifact.normalizationAst,
+          normalizationAst.selections,
           networkResponse.data ?? {},
           variables,
           artifact.kind === 'Entrypoint'
             ? artifact.readerWithRefetchQueries.nestedRefetchQueries
             : [],
+          root,
         );
         const retainedQuery = {
-          normalizationAst: artifact.normalizationAst,
+          normalizationAst: normalizationAst.selections,
           variables,
+          root,
         };
         status = {
           kind: 'UndisposedComplete',
@@ -62,6 +170,35 @@ export function makeNetworkRequest(
         };
         retainQuery(environment, retainedQuery);
       }
+
+      const onComplete = fetchOptions?.onComplete;
+      if (onComplete != null) {
+        let data = readDataForOnComplete(
+          artifact,
+          environment,
+          root,
+          variables,
+        );
+
+        try {
+          // @ts-expect-error this problem will be fixed when we remove RefetchQueryNormalizationArtifact
+          // (or we can fix this by having a single param of type { kind: 'Entrypoint', entrypoint,
+          // fetchOptions: FetchOptions<TReadFromStore> } | { kind: 'RefetchQuery', refetchQuery,
+          // fetchOptions: FetchOptions<void> }).
+          onComplete(data);
+        } catch {}
+      }
+    })
+    .catch((e) => {
+      logMessage(environment, () => ({
+        kind: 'ReceivedNetworkError',
+        networkRequestId: myNetworkRequestId,
+        error: e,
+      }));
+      try {
+        fetchOptions?.onError?.();
+      } catch {}
+      throw e;
     });
 
   const wrapper = wrapPromise(promise);
@@ -97,3 +234,95 @@ type NetworkRequestStatus =
       readonly kind: 'UndisposedComplete';
       readonly retainedQuery: RetainedQuery;
     };
+
+function readDataForOnComplete<
+  TReadFromStore extends UnknownTReadFromStore,
+  TClientFieldValue,
+  TNormalizationAst extends NormalizationAst | NormalizationAstLoader,
+>(
+  artifact:
+    | RefetchQueryNormalizationArtifact
+    | IsographEntrypoint<TReadFromStore, TClientFieldValue, TNormalizationAst>,
+  environment: IsographEnvironment,
+  root: Link,
+  variables: ExtractParameters<TReadFromStore>,
+): TClientFieldValue | null {
+  // An entrypoint, but not a RefetchQueryNormalizationArtifact, has a reader ASTs.
+  // So, we can only pass data to onComplete if makeNetworkRequest was passed an entrypoint.
+  // This is awkward, since we don't express that in the types of the parameters
+  // (i.e. FetchOptions could be passed, along with a RefetchQueryNormalizationArtifact).
+  //
+  // However, this isn't a big deal: RefetchQueryNormalizationArtifact is going away.
+  if (artifact.kind === 'Entrypoint') {
+    // TODO this is a smell!
+    const fakeNetworkRequest = wrapResolvedValue(undefined);
+    // TODO this is a smell — we know the network response is not in flight,
+    // so we don't really care!
+    const fakeNetworkRequestOptions = {
+      suspendIfInFlight: false,
+      throwOnNetworkError: false,
+    };
+
+    const fragment: FragmentReference<TReadFromStore, TClientFieldValue> = {
+      kind: 'FragmentReference',
+      // TODO this smells.
+      readerWithRefetchQueries: wrapResolvedValue(
+        artifact.readerWithRefetchQueries,
+      ),
+      root,
+      variables,
+      networkRequest: fakeNetworkRequest,
+    };
+    const fragmentResult = readButDoNotEvaluate(
+      environment,
+      fragment,
+      fakeNetworkRequestOptions,
+    ).item;
+    const readerArtifact = artifact.readerWithRefetchQueries.readerArtifact;
+    switch (readerArtifact.kind) {
+      case 'ComponentReaderArtifact': {
+        // @ts-expect-error We should find a way to encode this in the type system:
+        // if we have a ComponentReaderArtifact, we will necessarily have a
+        // TClientFieldValue which is a React.FC<...>
+        return getOrCreateCachedComponent(
+          environment,
+          readerArtifact.fieldName,
+          {
+            kind: 'FragmentReference',
+            readerWithRefetchQueries: wrapResolvedValue({
+              kind: 'ReaderWithRefetchQueries',
+              readerArtifact: readerArtifact,
+              nestedRefetchQueries:
+                artifact.readerWithRefetchQueries.nestedRefetchQueries,
+            }),
+            root,
+            variables,
+            networkRequest: fakeNetworkRequest,
+          } as const,
+          fakeNetworkRequestOptions,
+        );
+      }
+      case 'EagerReaderArtifact': {
+        return readerArtifact.resolver({
+          data: fragmentResult,
+          parameters: variables,
+          ...(readerArtifact.hasUpdatable
+            ? {
+                startUpdate: getOrCreateCachedStartUpdate(
+                  environment,
+                  fragment,
+                  artifact.readerWithRefetchQueries.readerArtifact.fieldName,
+                ),
+              }
+            : undefined),
+        });
+      }
+      default: {
+        const _: never = readerArtifact;
+        _;
+        throw new Error('Expected case');
+      }
+    }
+  }
+  return null;
+}