@isograph/react 0.0.0-main-e403ba82 → 0.0.0-main-82cbc3c0

package/src/core/writeData.ts

@@ -0,0 +1,79 @@
+import type { ItemCleanupPair } from '@isograph/isograph-disposable-types/dist';
+import { callSubscriptions } from './subscribe';
+import {
+  type NetworkResponseObject,
+  type EncounteredIds,
+  normalizeData,
+} from './cache';
+import type { IsographEntrypoint, NormalizationAst } from './entrypoint';
+import type {
+  UnknownTReadFromStore,
+  ExtractParameters,
+  FragmentReference,
+} from './FragmentReference';
+import {
+  type IsographEnvironment,
+  ROOT_ID,
+  getOrLoadReaderWithRefetchQueries,
+} from './IsographEnvironment';
+import { logMessage } from './logging';
+import { retainQueryWithoutMakingNetworkRequest } from './makeNetworkRequest';
+import { addNetworkResponseStoreLayer } from './optimisticProxy';
+
+export function writeData<
+  TReadFromStore extends UnknownTReadFromStore,
+  TRawResponseType extends NetworkResponseObject,
+  TClientFieldValue,
+>(
+  environment: IsographEnvironment,
+  entrypoint: IsographEntrypoint<
+    TReadFromStore,
+    TClientFieldValue,
+    NormalizationAst,
+    TRawResponseType
+  >,
+  data: TRawResponseType,
+  variables: ExtractParameters<TReadFromStore>,
+): ItemCleanupPair<FragmentReference<TReadFromStore, TClientFieldValue>> {
+  const encounteredIds: EncounteredIds = new Map();
+  environment.store = addNetworkResponseStoreLayer(environment.store);
+  normalizeData(
+    environment,
+    environment.store,
+    entrypoint.networkRequestInfo.normalizationAst.selections,
+    data,
+    variables,
+    { __link: ROOT_ID, __typename: entrypoint.concreteType },
+    encounteredIds,
+  );
+  logMessage(environment, () => ({
+    kind: 'AfterNormalization',
+    store: environment.store,
+    encounteredIds,
+  }));
+
+  callSubscriptions(environment, encounteredIds);
+
+  const { fieldName, readerArtifactKind, readerWithRefetchQueries } =
+    getOrLoadReaderWithRefetchQueries(
+      environment,
+      entrypoint.readerWithRefetchQueries,
+    );
+  const [networkRequest, disposeNetworkRequest] =
+    retainQueryWithoutMakingNetworkRequest(environment, entrypoint, variables);
+
+  return [
+    {
+      kind: 'FragmentReference',
+      readerWithRefetchQueries,
+      fieldName,
+      readerArtifactKind,
+      root: { __link: ROOT_ID, __typename: entrypoint.concreteType },
+      variables,
+      networkRequest,
+    },
+    () => {
+      disposeNetworkRequest();
+    },
+  ];
+}

package/src/index.ts

@@ -18,15 +18,14 @@ export {
   NOT_SET,
 } from './core/PromiseWrapper';
 export {
-  callSubscriptions,
-  subscribe,
   normalizeData,
-  writeData,
   type NetworkResponseObject,
   type NetworkResponseValue,
   type NetworkResponseScalarValue,
   type EncounteredIds,
 } from './core/cache';
+export { callSubscriptions, subscribe } from './core/subscribe';
+export { writeData } from './core/writeData';
 export { makeNetworkRequest } from './core/makeNetworkRequest';
 export {
   ROOT_ID,
@@ -40,7 +39,6 @@ export {
   type Link,
   type StoreRecord,
   type CacheMap,
-  createIsographEnvironment,
   createIsographStore,
   type FieldCache,
   type Subscriptions,
@@ -159,6 +157,7 @@ export {
 export { useLazyReference } from './react/useLazyReference';
 export { useRerenderOnChange } from './react/useRerenderOnChange';
 export { RenderAfterCommit__DO_NOT_USE } from './react/RenderAfterCommit__DO_NOT_USE';
+export { createIsographEnvironment } from './react/createIsographEnvironment';
 
 export { useClientSideDefer } from './loadable-hooks/useClientSideDefer';
 export {

package/src/loadable-hooks/useConnectionSpecPagination.ts

@@ -9,21 +9,21 @@ import {
 } from '@isograph/reference-counted-pointer';
 import { useState } from 'react';
 import { subscribeToAnyChange } from '../core/cache';
-import { FetchOptions } from '../core/check';
-import {
+import type { FetchOptions } from '../core/check';
+import type {
   FragmentReference,
-  type UnknownTReadFromStore,
+  UnknownTReadFromStore,
 } from '../core/FragmentReference';
 import { getPromiseState, readPromise } from '../core/PromiseWrapper';
 import {
   readButDoNotEvaluate,
   type WithEncounteredRecords,
 } from '../core/read';
-import { LoadableField, type ReaderAst } from '../core/reader';
+import type { LoadableField, ReaderAst } from '../core/reader';
 import { getOrCreateCachedStartUpdate } from '../core/startUpdate';
 import { useIsographEnvironment } from '../react/IsographEnvironmentProvider';
+import { maybeUnwrapNetworkRequest } from '../react/maybeUnwrapNetworkRequest';
 import { useSubscribeToMultiple } from '../react/useReadAndSubscribe';
-import { maybeUnwrapNetworkRequest } from '../react/useResult';
 
 export type UsePaginationReturnValue<
   TReadFromStore extends UnknownTReadFromStore,
@@ -264,7 +264,7 @@ export function useConnectionSpecPagination<
   const mostRecentFragmentReference =
     mostRecentItem?.[0].getItemIfNotDisposed();
 
-  if (mostRecentItem != null && mostRecentFragmentReference === null) {
+  if (mostRecentItem != null && mostRecentFragmentReference == null) {
     throw new Error(
       'FragmentReference is unexpectedly disposed. \
       This is indicative of a bug in Isograph.',

package/src/loadable-hooks/useSkipLimitPagination.ts

@@ -9,21 +9,21 @@ import {
 } from '@isograph/reference-counted-pointer';
 import { useState } from 'react';
 import { subscribeToAnyChange } from '../core/cache';
-import { FetchOptions } from '../core/check';
-import {
+import type { FetchOptions } from '../core/check';
+import type {
   FragmentReference,
-  type UnknownTReadFromStore,
+  UnknownTReadFromStore,
 } from '../core/FragmentReference';
 import { getPromiseState, readPromise } from '../core/PromiseWrapper';
 import {
   readButDoNotEvaluate,
   type WithEncounteredRecords,
 } from '../core/read';
-import { LoadableField, type ReaderAst } from '../core/reader';
+import type { LoadableField, ReaderAst } from '../core/reader';
 import { getOrCreateCachedStartUpdate } from '../core/startUpdate';
 import { useIsographEnvironment } from '../react/IsographEnvironmentProvider';
+import { maybeUnwrapNetworkRequest } from '../react/maybeUnwrapNetworkRequest';
 import { useSubscribeToMultiple } from '../react/useReadAndSubscribe';
-import { maybeUnwrapNetworkRequest } from '../react/useResult';
 
 export type UseSkipLimitReturnValue<
   TReadFromStore extends UnknownTReadFromStore,
@@ -248,7 +248,7 @@ export function useSkipLimitPagination<
   const mostRecentFragmentReference =
     mostRecentItem?.[0].getItemIfNotDisposed();
 
-  if (mostRecentItem != null && mostRecentFragmentReference === null) {
+  if (mostRecentItem != null && mostRecentFragmentReference == null) {
     throw new Error(
       'FragmentReference is unexpectedly disposed. \
       This is indicative of a bug in Isograph.',

package/src/react/createIsographEnvironment.ts

@@ -0,0 +1,23 @@
+import {
+  createIsographEnvironmentCore,
+  type BaseStoreLayerData,
+  type IsographNetworkFunction,
+  type MissingFieldHandler,
+} from '../core/IsographEnvironment';
+import type { LogFunction } from '../core/logging';
+import { componentFunction } from './useReadAndSubscribe';
+
+export function createIsographEnvironment(
+  baseStoreLayerData: BaseStoreLayerData,
+  networkFunction: IsographNetworkFunction,
+  missingFieldHandler?: MissingFieldHandler | null,
+  logFunction?: LogFunction | null,
+) {
+  return createIsographEnvironmentCore(
+    baseStoreLayerData,
+    networkFunction,
+    componentFunction,
+    missingFieldHandler,
+    logFunction,
+  );
+}

package/src/react/maybeUnwrapNetworkRequest.ts

@@ -0,0 +1,17 @@
+import { type PromiseWrapper, getPromiseState } from '../core/PromiseWrapper';
+import type { NetworkRequestReaderOptions } from '../core/read';
+
+export function maybeUnwrapNetworkRequest(
+  networkRequest: PromiseWrapper<void, any>,
+  networkRequestOptions: NetworkRequestReaderOptions,
+) {
+  const state = getPromiseState(networkRequest);
+  if (state.kind === 'Err' && networkRequestOptions.throwOnNetworkError) {
+    throw state.error;
+  } else if (
+    state.kind === 'Pending' &&
+    networkRequestOptions.suspendIfInFlight
+  ) {
+    throw state.promise;
+  }
+}

package/src/react/useLazyReference.ts

@@ -1,8 +1,5 @@
 import { useLazyDisposableState } from '@isograph/react-disposable-state';
-import {
-  getOrCreateCacheForArtifact,
-  type NetworkResponseObject,
-} from '../core/cache';
+import { type NetworkResponseObject } from '../core/cache';
 import { FetchOptions, type RequiredFetchOptions } from '../core/check';
 import {
   IsographEntrypoint,
@@ -16,6 +13,7 @@ import {
 } from '../core/FragmentReference';
 import { logMessage } from '../core/logging';
 import { useIsographEnvironment } from './IsographEnvironmentProvider';
+import { getOrCreateCacheForArtifact } from '../core/getOrCreateCacheForArtifact';
 
 export function useLazyReference<
   TReadFromStore extends UnknownTReadFromStore,

package/src/react/useReadAndSubscribe.ts

@@ -1,18 +1,22 @@
 import { useEffect, useState } from 'react';
-import { subscribe } from '../core/cache';
 import {
-  ExtractData,
-  FragmentReference,
+  type ExtractData,
+  type FragmentReference,
   stableIdForFragmentReference,
   type UnknownTReadFromStore,
 } from '../core/FragmentReference';
+import type { IsographComponentFunction } from '../core/IsographEnvironment';
+import { logMessage } from '../core/logging';
+import { readPromise } from '../core/PromiseWrapper';
 import {
-  NetworkRequestReaderOptions,
+  type NetworkRequestReaderOptions,
   readButDoNotEvaluate,
-  WithEncounteredRecords,
+  type WithEncounteredRecords,
 } from '../core/read';
 import type { ReaderAst } from '../core/reader';
+import { subscribe } from '../core/subscribe';
 import { useIsographEnvironment } from './IsographEnvironmentProvider';
+import { maybeUnwrapNetworkRequest } from './maybeUnwrapNetworkRequest';
 import { useRerenderOnChange } from './useRerenderOnChange';
 
 /**
@@ -80,3 +84,47 @@ export function useSubscribeToMultiple<
     ],
   );
 }
+
+export const componentFunction: IsographComponentFunction = (
+  environment,
+  fragmentReference,
+  networkRequestOptions,
+  startUpdate,
+) => {
+  function Component(additionalRuntimeProps: { [key: string]: any }) {
+    maybeUnwrapNetworkRequest(
+      fragmentReference.networkRequest,
+      networkRequestOptions,
+    );
+    const readerWithRefetchQueries = readPromise(
+      fragmentReference.readerWithRefetchQueries,
+    );
+
+    const data = useReadAndSubscribe(
+      fragmentReference,
+      networkRequestOptions,
+      readerWithRefetchQueries.readerArtifact.readerAst,
+    );
+
+    logMessage(environment, () => ({
+      kind: 'ComponentRerendered',
+      componentName: fragmentReference.fieldName,
+      rootLink: fragmentReference.root,
+    }));
+
+    return readerWithRefetchQueries.readerArtifact.resolver(
+      // @ts-expect-error
+      {
+        data,
+        parameters: fragmentReference.variables,
+        startUpdate: readerWithRefetchQueries.readerArtifact.hasUpdatable
+          ? startUpdate
+          : undefined,
+      },
+      additionalRuntimeProps,
+    );
+  }
+  const idString = `(type: ${fragmentReference.root.__typename}, id: ${fragmentReference.root.__link})`;
+  Component.displayName = `${fragmentReference.fieldName} ${idString} @component`;
+  return Component;
+};

package/src/react/useRerenderOnChange.ts

@@ -1,8 +1,8 @@
 import { useEffect } from 'react';
-import { subscribe } from '../core/cache';
-import { FragmentReference } from '../core/FragmentReference';
-import { WithEncounteredRecords } from '../core/read';
+import type { FragmentReference } from '../core/FragmentReference';
+import type { WithEncounteredRecords } from '../core/read';
 import type { ReaderAst } from '../core/reader';
+import { subscribe } from '../core/subscribe';
 import { useIsographEnvironment } from './IsographEnvironmentProvider';
 
 // TODO add unit tests for this. Add integration tests that test

package/src/react/useResult.ts

@@ -1,19 +1,16 @@
 import { getOrCreateCachedComponent } from '../core/componentCache';
-import {
+import type {
   FragmentReference,
-  type UnknownTReadFromStore,
+  UnknownTReadFromStore,
 } from '../core/FragmentReference';
+import { readPromise } from '../core/PromiseWrapper';
 import {
-  getPromiseState,
-  PromiseWrapper,
-  readPromise,
-} from '../core/PromiseWrapper';
-import {
+  type NetworkRequestReaderOptions,
   getNetworkRequestOptionsWithDefaults,
-  NetworkRequestReaderOptions,
 } from '../core/read';
 import { getOrCreateCachedStartUpdate } from '../core/startUpdate';
-import { useIsographEnvironment } from '../react/IsographEnvironmentProvider';
+import { useIsographEnvironment } from './IsographEnvironmentProvider';
+import { maybeUnwrapNetworkRequest } from './maybeUnwrapNetworkRequest';
 import { useReadAndSubscribe } from './useReadAndSubscribe';
 
 export function useResult<
@@ -68,18 +65,3 @@ export function useResult<
     }
   }
 }
-
-export function maybeUnwrapNetworkRequest(
-  networkRequest: PromiseWrapper<void, any>,
-  networkRequestOptions: NetworkRequestReaderOptions,
-) {
-  const state = getPromiseState(networkRequest);
-  if (state.kind === 'Err' && networkRequestOptions.throwOnNetworkError) {
-    throw state.error;
-  } else if (
-    state.kind === 'Pending' &&
-    networkRequestOptions.suspendIfInFlight
-  ) {
-    throw state.promise;
-  }
-}

package/src/tests/garbageCollection.test.ts

@@ -1,18 +1,15 @@
+import { iso } from '@iso';
 import { describe, expect, test } from 'vitest';
 import {
   garbageCollectEnvironment,
   retainQuery,
   type RetainedQuery,
 } from '../core/garbageCollection';
-import {
-  createIsographEnvironment,
-  ROOT_ID,
-  type BaseStoreLayerData,
-} from '../core/IsographEnvironment';
+import { ROOT_ID, type BaseStoreLayerData } from '../core/IsographEnvironment';
 import { wrapResolvedValue } from '../core/PromiseWrapper';
-import { iso } from './__isograph/iso';
 import { meNameSuccessorRetainedQuery } from './meNameSuccessor';
 import { nodeFieldRetainedQuery } from './nodeQuery';
+import { createIsographEnvironment } from '../react/createIsographEnvironment';
 
 const getDefaultStore = (): BaseStoreLayerData => ({
   Query: {

package/src/tests/meNameSuccessor.ts

@@ -1,7 +1,7 @@
 import type { RetainedQuery } from '../core/garbageCollection';
 import { ROOT_ID } from '../core/IsographEnvironment';
 import { wrapResolvedValue } from '../core/PromiseWrapper';
-import { iso } from './__isograph/iso';
+import { iso } from '@iso';
 
 export const meNameField = iso(`
   field Query.meNameSuccessor {

package/src/tests/nodeQuery.ts

@@ -1,7 +1,7 @@
 import { RetainedQuery } from '../core/garbageCollection';
 import { ROOT_ID } from '../core/IsographEnvironment';
 import { wrapResolvedValue } from '../core/PromiseWrapper';
-import { iso } from './__isograph/iso';
+import { iso } from '@iso';
 
 // TODO investigate why this can't be in garbageCollection.test.ts without
 // typescript incorrectly thinking it is referenced in its own initializer

package/src/tests/normalizeData.test.ts

@@ -1,16 +1,18 @@
+import { iso } from '@iso';
 import { beforeEach, describe, expect, test, vi } from 'vitest';
-import { getOrCreateCacheForArtifact, normalizeData } from '../core/cache';
+
 import {
-  createIsographEnvironment,
   createIsographStore,
   ROOT_ID,
   type BaseStoreLayerData,
 } from '../core/IsographEnvironment';
+import { normalizeData } from '../core/cache';
+import { getOrCreateCacheForArtifact } from '../core/getOrCreateCacheForArtifact';
 import {
   readButDoNotEvaluate,
   type WithEncounteredRecords,
 } from '../core/read';
-import { iso } from './__isograph/iso';
+import { createIsographEnvironment } from '../react/createIsographEnvironment';
 import type { Query__subquery__param } from './__isograph/Query/subquery/param_type';
 
 let store: ReturnType<typeof createIsographStore>;

package/src/tests/optimisticProxy.test.ts

@@ -1,7 +1,7 @@
 import { beforeEach, describe, expect, test, vi } from 'vitest';
-import { callSubscriptions, type EncounteredIds } from '../core/cache';
+
+import { type EncounteredIds } from '../core/cache';
 import {
-  createIsographEnvironment,
   createIsographStore,
   type IsographEnvironment,
   type StoreLayerData,
@@ -15,8 +15,10 @@ import {
   type OptimisticStoreLayer,
   type StoreLayer,
 } from '../core/optimisticProxy';
+import { callSubscriptions } from '../core/subscribe';
+import { createIsographEnvironment } from '../react/createIsographEnvironment';
 
-vi.mock(import('../core/cache'), { spy: true });
+vi.mock(import('../core/subscribe'), { spy: true });
 
 const CHANGES = new Map([['Query', new Set(['__ROOT'])]]);
 const NO_CHANGES = new Map();
@@ -813,7 +815,7 @@ describe('optimisticLayer', () => {
     return revertOptimisticStoreLayerAndMaybeReplace(
       environment,
       node,
-      counter === null
+      counter == null
         ? counter
         : (storeLayer) => update(storeLayer, () => counter),
     );
@@ -851,7 +853,7 @@ describe('optimisticLayer', () => {
       },
     };
 
-    return counter != nextCounter ? CHANGES : NO_CHANGES;
+    return counter !== nextCounter ? CHANGES : NO_CHANGES;
   };
 
   function ignoreReadonly(value: StoreLayer): { data: StoreLayerData } {

package/src/tests/startUpdate.test.ts

@@ -1,13 +1,11 @@
+import { iso } from '@iso';
 import { beforeEach, describe, expect, test, vi } from 'vitest';
-import { getOrCreateCacheForArtifact } from '../core/cache';
+
 import type { ExtractUpdatableData } from '../core/FragmentReference';
-import {
-  createIsographEnvironment,
-  ROOT_ID,
-  type BaseStoreLayerData,
-} from '../core/IsographEnvironment';
+import { getOrCreateCacheForArtifact } from '../core/getOrCreateCacheForArtifact';
+import { ROOT_ID, type BaseStoreLayerData } from '../core/IsographEnvironment';
 import { createUpdatableProxy } from '../core/startUpdate';
-import { iso } from './__isograph/iso';
+import { createIsographEnvironment } from '../react/createIsographEnvironment';
 import type { Query__linkedUpdate__param } from './__isograph/Query/linkedUpdate/param_type';
 import type { Query__startUpdate__param } from './__isograph/Query/startUpdate/param_type';
 

package/vitest.config.ts

@@ -26,4 +26,9 @@ export default defineProject({
       },
     }),
   ],
+  resolve: {
+    alias: {
+      '@iso': './tests/__isograph/iso.ts',
+    },
+  },
 });