@isograph/react 0.2.0 → 0.3.1

package/src/core/check.ts

@@ -0,0 +1,212 @@
+import { getParentRecordKey } from './cache';
+import { NormalizationAstNodes } from './entrypoint';
+import { Variables } from './FragmentReference';
+import {
+  getLink,
+  IsographEnvironment,
+  Link,
+  StoreRecord,
+} from './IsographEnvironment';
+import { logMessage } from './logging';
+
+export type ShouldFetch = RequiredShouldFetch | 'IfNecessary';
+export type RequiredShouldFetch = 'Yes' | 'No';
+
+export const DEFAULT_SHOULD_FETCH_VALUE: ShouldFetch = 'IfNecessary';
+
+export type FetchOptions<TReadOutData> = {
+  shouldFetch?: ShouldFetch;
+  onComplete?: (data: TReadOutData) => void;
+  onError?: () => void;
+};
+
+export type RequiredFetchOptions<TReadOutData> = {
+  shouldFetch: RequiredShouldFetch;
+} & FetchOptions<TReadOutData>;
+
+export type CheckResult =
+  | {
+      kind: 'EnoughData';
+    }
+  | {
+      kind: 'MissingData';
+      record: Link;
+    };
+
+export function check(
+  environment: IsographEnvironment,
+  normalizationAst: NormalizationAstNodes,
+  variables: Variables,
+  root: Link,
+): CheckResult {
+  const recordsById = (environment.store[root.__typename] ??= {});
+  const newStoreRecord = (recordsById[root.__link] ??= {});
+
+  const checkResult = checkFromRecord(
+    environment,
+    normalizationAst,
+    variables,
+    newStoreRecord,
+    root,
+  );
+  logMessage(environment, () => ({
+    kind: 'EnvironmentCheck',
+    result: checkResult,
+  }));
+  return checkResult;
+}
+
+function checkFromRecord(
+  environment: IsographEnvironment,
+  normalizationAst: NormalizationAstNodes,
+  variables: Variables,
+  record: StoreRecord,
+  recordLink: Link,
+): CheckResult {
+  normalizationAstLoop: for (const normalizationAstNode of normalizationAst) {
+    switch (normalizationAstNode.kind) {
+      case 'Scalar': {
+        const parentRecordKey = getParentRecordKey(
+          normalizationAstNode,
+          variables,
+        );
+        const scalarValue = record[parentRecordKey];
+
+        // null means the value is known to be missing, so it must
+        // be exactly undefined
+        if (scalarValue === undefined) {
+          return {
+            kind: 'MissingData',
+            record: recordLink,
+          };
+        }
+        continue normalizationAstLoop;
+      }
+      case 'Linked': {
+        const parentRecordKey = getParentRecordKey(
+          normalizationAstNode,
+          variables,
+        );
+
+        const linkedValue = record[parentRecordKey];
+
+        if (linkedValue === undefined) {
+          return {
+            kind: 'MissingData',
+            record: recordLink,
+          };
+        } else if (linkedValue === null) {
+          continue;
+        } else if (Array.isArray(linkedValue)) {
+          arrayItemsLoop: for (const item of linkedValue) {
+            const link = getLink(item);
+            if (link === null) {
+              throw new Error(
+                'Unexpected non-link in the Isograph store. ' +
+                  'This is indicative of a bug in Isograph.',
+              );
+            }
+
+            const linkedRecord =
+              environment.store[link.__typename]?.[link.__link];
+
+            if (linkedRecord === undefined) {
+              return {
+                kind: 'MissingData',
+                record: link,
+              };
+            } else if (linkedRecord === null) {
+              continue arrayItemsLoop;
+            } else {
+              // TODO in __DEV__ assert linkedRecord is an object
+              const result = checkFromRecord(
+                environment,
+                normalizationAstNode.selections,
+                variables,
+                linkedRecord,
+                link,
+              );
+
+              if (result.kind === 'MissingData') {
+                return result;
+              }
+            }
+          }
+        } else {
+          const link = getLink(linkedValue);
+          if (link === null) {
+            throw new Error(
+              'Unexpected non-link in the Isograph store. ' +
+                'This is indicative of a bug in Isograph.',
+            );
+          }
+
+          const linkedRecord =
+            environment.store[link.__typename]?.[link.__link];
+
+          if (linkedRecord === undefined) {
+            return {
+              kind: 'MissingData',
+              record: link,
+            };
+          } else if (linkedRecord === null) {
+            continue normalizationAstLoop;
+          } else {
+            // TODO in __DEV__ assert linkedRecord is an object
+            const result = checkFromRecord(
+              environment,
+              normalizationAstNode.selections,
+              variables,
+              linkedRecord,
+              link,
+            );
+
+            if (result.kind === 'MissingData') {
+              return result;
+            }
+          }
+        }
+
+        continue normalizationAstLoop;
+      }
+      case 'InlineFragment': {
+        const existingRecordTypename = record['__typename'];
+
+        if (
+          existingRecordTypename == null ||
+          existingRecordTypename !== normalizationAstNode.type
+        ) {
+          return {
+            kind: 'MissingData',
+            record: recordLink,
+          };
+        }
+
+        const result = checkFromRecord(
+          environment,
+          normalizationAstNode.selections,
+          variables,
+          record,
+          recordLink,
+        );
+
+        if (result.kind === 'MissingData') {
+          return result;
+        }
+
+        continue normalizationAstLoop;
+      }
+      default: {
+        let _: never = normalizationAstNode;
+        _;
+        throw new Error(
+          'Unexpected case. This is indicative of a bug in Isograph.',
+        );
+      }
+    }
+  }
+
+  return {
+    kind: 'EnoughData',
+  };
+}

package/src/core/componentCache.ts

@@ -1,9 +1,13 @@
-import { stableCopy } from './cache';
-import { IsographEnvironment } from './IsographEnvironment';
-import { FragmentReference } from './FragmentReference';
 import { useReadAndSubscribe } from '../react/useReadAndSubscribe';
-import { NetworkRequestReaderOptions } from './read';
+import {
+  FragmentReference,
+  stableIdForFragmentReference,
+} from './FragmentReference';
+import { IsographEnvironment } from './IsographEnvironment';
+import { logMessage } from './logging';
 import { readPromise } from './PromiseWrapper';
+import { NetworkRequestReaderOptions } from './read';
+import { createStartUpdate } from './startUpdate';
 
 export function getOrCreateCachedComponent(
   environment: IsographEnvironment,
@@ -11,51 +15,41 @@ export function getOrCreateCachedComponent(
   fragmentReference: FragmentReference<any, any>,
   networkRequestOptions: NetworkRequestReaderOptions,
 ): React.FC<any> {
-  // cachedComponentsById is a three layer cache: id, then component name, then
-  // stringified args. These three, together, uniquely identify a read at a given
-  // time.
-  const cachedComponentsById = environment.componentCache;
-
-  cachedComponentsById[fragmentReference.root] =
-    cachedComponentsById[fragmentReference.root] ?? {};
-  const componentsByName = cachedComponentsById[fragmentReference.root];
-
-  componentsByName[componentName] = componentsByName[componentName] ?? {};
-  const byArgs = componentsByName[componentName];
+  // We create startUpdate outside of component to make it stable
+  const startUpdate = createStartUpdate(environment, fragmentReference);
 
-  const stringifiedArgs = JSON.stringify(
-    stableCopy(fragmentReference.variables),
-  );
-  byArgs[stringifiedArgs] =
-    byArgs[stringifiedArgs] ??
-    (() => {
-      function Component(additionalRuntimeProps: { [key: string]: any }) {
-        const data = useReadAndSubscribe(
-          fragmentReference,
-          networkRequestOptions,
-        );
+  return (environment.componentCache[
+    stableIdForFragmentReference(fragmentReference, componentName)
+  ] ??= (() => {
+    function Component(additionalRuntimeProps: { [key: string]: any }) {
+      const readerWithRefetchQueries = readPromise(
+        fragmentReference.readerWithRefetchQueries,
+      );
 
-        // @ts-expect-error
-        if (typeof window !== 'undefined' && window.__LOG) {
-          console.log(
-            'Component re-rendered: ' +
-              componentName +
-              ' ' +
-              fragmentReference.root,
-          );
-        }
+      const data = useReadAndSubscribe(
+        fragmentReference,
+        networkRequestOptions,
+        readerWithRefetchQueries.readerArtifact.readerAst,
+      );
 
-        const readerWithRefetchQueries = readPromise(
-          fragmentReference.readerWithRefetchQueries,
-        );
+      logMessage(environment, () => ({
+        kind: 'ComponentRerendered',
+        componentName,
+        rootLink: fragmentReference.root,
+      }));
 
-        return readerWithRefetchQueries.readerArtifact.resolver(
+      return readerWithRefetchQueries.readerArtifact.resolver(
+        {
           data,
-          additionalRuntimeProps,
-        );
-      }
-      Component.displayName = `${componentName} (id: ${fragmentReference.root}) @component`;
-      return Component;
-    })();
-  return byArgs[stringifiedArgs];
+          parameters: fragmentReference.variables,
+          startUpdate: readerWithRefetchQueries.readerArtifact.hasUpdatable
+            ? startUpdate
+            : undefined,
+        },
+        additionalRuntimeProps,
+      );
+    }
+    Component.displayName = `${componentName} (id: ${fragmentReference.root}) @component`;
+    return Component;
+  })());
 }

package/src/core/entrypoint.ts

@@ -1,8 +1,10 @@
+import type { UnknownTReadFromStore } from './FragmentReference';
+import type { TypeName } from './IsographEnvironment';
 import { TopLevelReaderArtifact } from './reader';
 import { Arguments } from './util';
 
 export type ReaderWithRefetchQueries<
-  TReadFromStore extends Object,
+  TReadFromStore extends UnknownTReadFromStore,
   TClientFieldValue,
 > = {
   readonly kind: 'ReaderWithRefetchQueries';
@@ -15,28 +17,34 @@ export type ReaderWithRefetchQueries<
   readonly nestedRefetchQueries: RefetchQueryNormalizationArtifactWrapper[];
 };
 
+export type NetworkRequestInfo<TNormalizationAst> = {
+  readonly kind: 'NetworkRequestInfo';
+  readonly queryText: string;
+  readonly normalizationAst: TNormalizationAst;
+};
 // This type should be treated as an opaque type.
 export type IsographEntrypoint<
-  TReadFromStore extends Object,
+  TReadFromStore extends UnknownTReadFromStore,
   TClientFieldValue,
+  TNormalizationAst extends NormalizationAst | NormalizationAstLoader,
 > = {
   readonly kind: 'Entrypoint';
-  readonly queryText: string;
-  readonly normalizationAst: NormalizationAst;
+  readonly networkRequestInfo: NetworkRequestInfo<TNormalizationAst>;
   readonly readerWithRefetchQueries: ReaderWithRefetchQueries<
     TReadFromStore,
     TClientFieldValue
   >;
+  readonly concreteType: TypeName;
 };
 
 export type IsographEntrypointLoader<
-  TReadFromStore extends Object,
+  TReadFromStore extends UnknownTReadFromStore,
   TClientFieldValue,
 > = {
   readonly kind: 'EntrypointLoader';
   readonly typeAndField: string;
   readonly loader: () => Promise<
-    IsographEntrypoint<TReadFromStore, TClientFieldValue>
+    IsographEntrypoint<TReadFromStore, TClientFieldValue, NormalizationAst>
   >;
 };
 
@@ -44,7 +52,18 @@ export type NormalizationAstNode =
   | NormalizationScalarField
   | NormalizationLinkedField
   | NormalizationInlineFragment;
-export type NormalizationAst = ReadonlyArray<NormalizationAstNode>;
+
+export type NormalizationAstNodes = ReadonlyArray<NormalizationAstNode>;
+
+export type NormalizationAst = {
+  readonly kind: 'NormalizationAst';
+  readonly selections: NormalizationAstNodes;
+};
+
+export type NormalizationAstLoader = {
+  readonly kind: 'NormalizationAstLoader';
+  readonly loader: () => Promise<NormalizationAst>;
+};
 
 export type NormalizationScalarField = {
   readonly kind: 'Scalar';
@@ -56,20 +75,21 @@ export type NormalizationLinkedField = {
   readonly kind: 'Linked';
   readonly fieldName: string;
   readonly arguments: Arguments | null;
-  readonly selections: NormalizationAst;
+  readonly selections: NormalizationAstNodes;
+  readonly concreteType: TypeName | null;
 };
 
 export type NormalizationInlineFragment = {
   readonly kind: 'InlineFragment';
   readonly type: string;
-  readonly selections: NormalizationAst;
+  readonly selections: NormalizationAstNodes;
 };
 
 // This is more like an entrypoint, but one specifically for a refetch query/mutation
 export type RefetchQueryNormalizationArtifact = {
   readonly kind: 'RefetchQuery';
-  readonly queryText: string;
-  readonly normalizationAst: NormalizationAst;
+  readonly networkRequestInfo: NetworkRequestInfo<NormalizationAst>;
+  readonly concreteType: TypeName;
 };
 
 // TODO rename
@@ -79,21 +99,26 @@ export type RefetchQueryNormalizationArtifactWrapper = {
 };
 
 export function assertIsEntrypoint<
-  TReadFromStore extends Object,
+  TReadFromStore extends UnknownTReadFromStore,
   TClientFieldValue,
+  TNormalizationAst extends NormalizationAst | NormalizationAstLoader,
 >(
   value:
-    | IsographEntrypoint<TReadFromStore, TClientFieldValue>
+    | IsographEntrypoint<TReadFromStore, TClientFieldValue, TNormalizationAst>
     | ((_: any) => any)
     // Temporarily, allow any here. Once we automatically provide
     // types to entrypoints, we probably don't need this.
     | any,
-): asserts value is IsographEntrypoint<TReadFromStore, TClientFieldValue> {
+): asserts value is IsographEntrypoint<
+  TReadFromStore,
+  TClientFieldValue,
+  TNormalizationAst
+> {
   if (typeof value === 'function') throw new Error('Not a string');
 }
 
 export type ExtractReadFromStore<Type> =
-  Type extends IsographEntrypoint<infer X, any> ? X : never;
+  Type extends IsographEntrypoint<infer X, any, any> ? X : never;
 export type ExtractResolverResult<Type> =
-  Type extends IsographEntrypoint<any, infer X> ? X : never;
+  Type extends IsographEntrypoint<any, infer X, any> ? X : never;
 export type ExtractProps<Type> = Type extends React.FC<infer X> ? X : never;

package/src/core/garbageCollection.ts

@@ -1,21 +1,23 @@
+import { getParentRecordKey } from './cache';
+import { NormalizationAstNodes } from './entrypoint';
 import { Variables } from './FragmentReference';
 import {
+  assertLink,
   DataId,
   IsographEnvironment,
   IsographStore,
-  ROOT_ID,
   StoreRecord,
-  assertLink,
+  type Link,
+  type TypeName,
 } from './IsographEnvironment';
-import { getParentRecordKey } from './cache';
-import { NormalizationAst } from './entrypoint';
 
 export type RetainedQuery = {
-  readonly normalizationAst: NormalizationAst;
+  readonly normalizationAst: NormalizationAstNodes;
   readonly variables: {};
+  readonly root: Link;
 };
 
-type DidUnretainSomeQuery = boolean;
+export type DidUnretainSomeQuery = boolean;
 export function unretainQuery(
   environment: IsographEnvironment,
   retainedQuery: RetainedQuery,
@@ -42,7 +44,7 @@ export function retainQuery(
 }
 
 export function garbageCollectEnvironment(environment: IsographEnvironment) {
-  const retainedIds = new Set<DataId>([ROOT_ID]);
+  const retainedIds: RetainedIds = {};
 
   for (const query of environment.retainedQueries) {
     recordReachableIds(environment.store, query, retainedIds);
@@ -51,32 +53,62 @@ export function garbageCollectEnvironment(environment: IsographEnvironment) {
     recordReachableIds(environment.store, query, retainedIds);
   }
 
-  for (const dataId in environment.store) {
-    if (!retainedIds.has(dataId)) {
-      delete environment.store[dataId];
+  for (const typeName in environment.store) {
+    const dataById = environment.store[typeName];
+    if (dataById == null) continue;
+    const retainedTypeIds = retainedIds[typeName];
+
+    // delete all objects
+    if (retainedTypeIds == undefined || retainedTypeIds.size == 0) {
+      delete environment.store[typeName];
+      continue;
+    }
+
+    for (const dataId in dataById) {
+      if (!retainedTypeIds.has(dataId)) {
+        delete dataById[dataId];
+      }
+    }
+
+    if (Object.keys(dataById).length === 0) {
+      delete environment.store[typeName];
     }
   }
 }
 
+interface RetainedIds {
+  [typeName: TypeName]: Set<DataId>;
+}
+
 function recordReachableIds(
   store: IsographStore,
   retainedQuery: RetainedQuery,
-  mutableRetainedIds: Set<DataId>,
+  mutableRetainedIds: RetainedIds,
 ) {
-  recordReachableIdsFromRecord(
-    store,
-    store[ROOT_ID],
-    mutableRetainedIds,
-    retainedQuery.normalizationAst,
-    retainedQuery.variables,
-  );
+  const record =
+    store[retainedQuery.root.__typename]?.[retainedQuery.root.__link];
+
+  const retainedRecordsIds = (mutableRetainedIds[
+    retainedQuery.root.__typename
+  ] ??= new Set());
+  retainedRecordsIds.add(retainedQuery.root.__link);
+
+  if (record) {
+    recordReachableIdsFromRecord(
+      store,
+      record,
+      mutableRetainedIds,
+      retainedQuery.normalizationAst,
+      retainedQuery.variables,
+    );
+  }
 }
 
 function recordReachableIdsFromRecord(
   store: IsographStore,
   currentRecord: StoreRecord,
-  mutableRetainedIds: Set<DataId>,
-  selections: NormalizationAst,
+  mutableRetainedIds: RetainedIds,
+  selections: NormalizationAstNodes,
   variables: Variables | null,
 ) {
   for (const selection of selections) {
@@ -85,25 +117,44 @@ function recordReachableIdsFromRecord(
         const linkKey = getParentRecordKey(selection, variables ?? {});
         const linkedFieldOrFields = currentRecord[linkKey];
 
-        const ids = [];
+        const links: Link[] = [];
         if (Array.isArray(linkedFieldOrFields)) {
           for (const maybeLink of linkedFieldOrFields) {
             const link = assertLink(maybeLink);
             if (link != null) {
-              ids.push(link.__link);
+              links.push(link);
             }
           }
         } else {
           const link = assertLink(linkedFieldOrFields);
           if (link != null) {
-            ids.push(link.__link);
+            links.push(link);
           }
         }
 
-        for (const nextRecordId of ids) {
-          const nextRecord = store[nextRecordId];
+        let typeStore =
+          selection.concreteType !== null
+            ? store[selection.concreteType]
+            : null;
+
+        if (typeStore == null && selection.concreteType !== null) {
+          continue;
+        }
+
+        for (const nextRecordLink of links) {
+          let __typename = nextRecordLink.__typename;
+
+          const resolvedTypeStore = typeStore ?? store[__typename];
+
+          if (resolvedTypeStore == null) {
+            continue;
+          }
+
+          const nextRecord = resolvedTypeStore[nextRecordLink.__link];
           if (nextRecord != null) {
-            mutableRetainedIds.add(nextRecordId);
+            const retainedRecordsIds = (mutableRetainedIds[__typename] ??=
+              new Set());
+            retainedRecordsIds.add(nextRecordLink.__link);
             recordReachableIdsFromRecord(
               store,
               nextRecord,