@isograph/react 0.0.0-main-f49c67bb → 0.0.0-main-35c553b5

package/dist/{context.d.ts → IsographEnvironment.d.ts}

@@ -1,10 +1,27 @@
 import { ReactNode } from 'react';
 import * as React from 'react';
+import { ParentCache } from '@isograph/isograph-react-disposable-state';
 export declare const IsographEnvironmentContext: React.Context<IsographEnvironment | null>;
+type ComponentName = string;
+type StringifiedArgs = string;
+type ComponentCache = {
+    [key: DataId]: {
+        [key: ComponentName]: {
+            [key: StringifiedArgs]: React.FC<any>;
+        };
+    };
+};
+export type Subscriptions = Set<() => void>;
+type SuspenseCache = {
+    [index: string]: ParentCache<any>;
+};
 export type IsographEnvironment = {
     store: IsographStore;
     networkFunction: IsographNetworkFunction;
     missingFieldHandler: MissingFieldHandler | null;
+    componentCache: ComponentCache;
+    subscriptions: Subscriptions;
+    suspenseCache: SuspenseCache;
 };
 export type MissingFieldHandler = (storeRecord: StoreRecord, root: DataId, fieldName: string, arguments_: {
     [index: string]: any;
@@ -32,3 +49,8 @@ export type IsographEnvironmentProviderProps = {
 };
 export declare function IsographEnvironmentProvider({ environment, children, }: IsographEnvironmentProviderProps): React.JSX.Element;
 export declare function useIsographEnvironment(): IsographEnvironment;
+export declare function createIsographEnvironment(store: IsographStore, networkFunction: IsographNetworkFunction, missingFieldHandler?: MissingFieldHandler): IsographEnvironment;
+export declare function createIsographStore(): {
+    __ROOT: {};
+};
+export {};

package/dist/{context.js → IsographEnvironment.js}

@@ -23,7 +23,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useIsographEnvironment = exports.IsographEnvironmentProvider = exports.ROOT_ID = exports.IsographEnvironmentContext = void 0;
+exports.createIsographStore = exports.createIsographEnvironment = exports.useIsographEnvironment = exports.IsographEnvironmentProvider = exports.ROOT_ID = exports.IsographEnvironmentContext = void 0;
 const react_1 = require("react");
 const React = __importStar(require("react"));
 const cache_1 = require("./cache");
@@ -32,7 +32,7 @@ exports.ROOT_ID = '__ROOT';
 function IsographEnvironmentProvider({ environment, children, }) {
     const [, setState] = React.useState();
     React.useEffect(() => {
-        return (0, cache_1.subscribe)(() => setState({}));
+        return (0, cache_1.subscribe)(environment, () => setState({}));
     }, []);
     return (React.createElement(exports.IsographEnvironmentContext.Provider, { value: environment }, children));
 }
@@ -46,3 +46,20 @@ function useIsographEnvironment() {
     return context;
 }
 exports.useIsographEnvironment = useIsographEnvironment;
+function createIsographEnvironment(store, networkFunction, missingFieldHandler) {
+    return {
+        store,
+        networkFunction,
+        missingFieldHandler: missingFieldHandler !== null && missingFieldHandler !== void 0 ? missingFieldHandler : null,
+        componentCache: {},
+        subscriptions: new Set(),
+        suspenseCache: {},
+    };
+}
+exports.createIsographEnvironment = createIsographEnvironment;
+function createIsographStore() {
+    return {
+        [exports.ROOT_ID]: {},
+    };
+}
+exports.createIsographStore = createIsographStore;

package/dist/cache.d.ts

@@ -1,7 +1,7 @@
 import { ItemCleanupPair, ParentCache } from '@isograph/react-disposable-state';
 import { PromiseWrapper } from './PromiseWrapper';
 import { IsographEntrypoint, NormalizationLinkedField, NormalizationScalarField, ReaderLinkedField, ReaderScalarField } from './index';
-import { type IsographEnvironment } from './context';
+import { type IsographEnvironment } from './IsographEnvironment';
 declare global {
     interface Window {
         __LOG: boolean;
@@ -16,8 +16,8 @@ export declare function stableCopy<T>(value: T): T;
 type IsoResolver = IsographEntrypoint<any, any, any>;
 export declare function getOrCreateCacheForArtifact<T>(environment: IsographEnvironment, artifact: IsographEntrypoint<any, any, T>, variables: object): ParentCache<PromiseWrapper<T>>;
 export declare function makeNetworkRequest<T>(environment: IsographEnvironment, artifact: IsoResolver, variables: object): ItemCleanupPair<PromiseWrapper<T>>;
-export declare function subscribe(callback: () => void): () => void;
-export declare function onNextChange(): Promise<void>;
+export declare function subscribe(environment: IsographEnvironment, callback: () => void): () => void;
+export declare function onNextChange(environment: IsographEnvironment): Promise<void>;
 export declare function getParentRecordKey(astNode: NormalizationLinkedField | NormalizationScalarField | ReaderLinkedField | ReaderScalarField, variables: {
     [index: string]: string;
 }): string;

package/dist/cache.js

@@ -3,20 +3,19 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.SECOND_SPLIT_KEY = exports.FIRST_SPLIT_KEY = exports.getParentRecordKey = exports.onNextChange = exports.subscribe = exports.makeNetworkRequest = exports.getOrCreateCacheForArtifact = exports.stableCopy = void 0;
 const react_disposable_state_1 = require("@isograph/react-disposable-state");
 const PromiseWrapper_1 = require("./PromiseWrapper");
-const context_1 = require("./context");
-const cache = {};
-function getOrCreateCache(index, factory) {
+const IsographEnvironment_1 = require("./IsographEnvironment");
+function getOrCreateCache(environment, index, factory) {
     if (typeof window !== 'undefined' && window.__LOG) {
         console.log('getting cache for', {
             index,
-            cache: Object.keys(cache),
-            found: !!cache[index],
+            cache: Object.keys(environment.suspenseCache),
+            found: !!environment.suspenseCache[index],
         });
     }
-    if (cache[index] == null) {
-        cache[index] = new react_disposable_state_1.ParentCache(factory);
+    if (environment.suspenseCache[index] == null) {
+        environment.suspenseCache[index] = new react_disposable_state_1.ParentCache(factory);
     }
-    return cache[index];
+    return environment.suspenseCache[index];
 }
 /**
  * Creates a copy of the provided value, ensuring any nested objects have their
@@ -43,7 +42,7 @@ exports.stableCopy = stableCopy;
 function getOrCreateCacheForArtifact(environment, artifact, variables) {
     const cacheKey = artifact.queryText + JSON.stringify(stableCopy(variables));
     const factory = () => makeNetworkRequest(environment, artifact, variables);
-    return getOrCreateCache(cacheKey, factory);
+    return getOrCreateCache(environment, cacheKey, factory);
 }
 exports.getOrCreateCacheForArtifact = getOrCreateCacheForArtifact;
 function makeNetworkRequest(environment, artifact, variables) {
@@ -73,29 +72,28 @@ function normalizeData(environment, normalizationAst, networkResponse, variables
     if (typeof window !== 'undefined' && window.__LOG) {
         console.log('about to normalize', normalizationAst, networkResponse, variables);
     }
-    normalizeDataIntoRecord(environment, normalizationAst, networkResponse, environment.store.__ROOT, context_1.ROOT_ID, variables, nestedRefetchQueries);
+    normalizeDataIntoRecord(environment, normalizationAst, networkResponse, environment.store.__ROOT, IsographEnvironment_1.ROOT_ID, variables, nestedRefetchQueries);
     if (typeof window !== 'undefined' && window.__LOG) {
         console.log('after normalization', { store: environment.store });
     }
-    callSubscriptions();
+    callSubscriptions(environment);
 }
-function subscribe(callback) {
-    subscriptions.add(callback);
-    return () => subscriptions.delete(callback);
+function subscribe(environment, callback) {
+    environment.subscriptions.add(callback);
+    return () => environment.subscriptions.delete(callback);
 }
 exports.subscribe = subscribe;
-function onNextChange() {
+function onNextChange(environment) {
     return new Promise((resolve) => {
-        const unsubscribe = subscribe(() => {
+        const unsubscribe = subscribe(environment, () => {
             unsubscribe();
             resolve();
         });
     });
 }
 exports.onNextChange = onNextChange;
-const subscriptions = new Set();
-function callSubscriptions() {
-    subscriptions.forEach((callback) => callback());
+function callSubscriptions(environment) {
+    environment.subscriptions.forEach((callback) => callback());
 }
 /**
  * Mutate targetParentRecord according to the normalizationAst and networkResponseParentRecord.

package/dist/componentCache.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import { DataId, ReaderArtifact, RefetchQueryArtifactWrapper } from './index';
-import { IsographEnvironment } from '../dist';
+import { ReaderArtifact, RefetchQueryArtifactWrapper } from './index';
+import { IsographEnvironment, DataId } from './IsographEnvironment';
 export declare function getOrCreateCachedComponent(environment: IsographEnvironment, root: DataId, componentName: string, readerArtifact: ReaderArtifact<any, any, any>, variables: {
     [key: string]: string;
 }, resolverRefetchQueries: RefetchQueryArtifactWrapper[]): import("react").FC<any>;

package/dist/componentCache.js

@@ -3,9 +3,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.getOrCreateCachedComponent = void 0;
 const index_1 = require("./index");
 const cache_1 = require("./cache");
-const cachedComponentsById = {};
 function getOrCreateCachedComponent(environment, root, componentName, readerArtifact, variables, resolverRefetchQueries) {
     var _a, _b, _c;
+    const cachedComponentsById = environment.componentCache;
     const stringifiedArgs = JSON.stringify((0, cache_1.stableCopy)(variables));
     cachedComponentsById[root] = (_a = cachedComponentsById[root]) !== null && _a !== void 0 ? _a : {};
     const componentsByName = cachedComponentsById[root];

package/dist/index.d.ts

@@ -1,6 +1,6 @@
-import { DataId, IsographEnvironment, Link, StoreRecord } from './context';
+import { DataId, IsographEnvironment, Link, StoreRecord } from './IsographEnvironment';
 export { makeNetworkRequest, subscribe } from './cache';
-export { IsographEnvironmentContext, ROOT_ID, type DataId, type DataTypeValue, type IsographEnvironment, IsographEnvironmentProvider, type IsographEnvironmentProviderProps, type IsographNetworkFunction, type IsographStore, type Link, type StoreRecord, useIsographEnvironment, } from './context';
+export { IsographEnvironmentContext, ROOT_ID, type DataId, type DataTypeValue, type IsographEnvironment, IsographEnvironmentProvider, type IsographEnvironmentProviderProps, type IsographNetworkFunction, type IsographStore, type Link, type StoreRecord, useIsographEnvironment, createIsographEnvironment, createIsographStore, } from './IsographEnvironment';
 export { iso } from './iso';
 export type IsographEntrypoint<TReadFromStore extends Object, TResolverProps, TResolverResult> = {
     kind: 'Entrypoint';

package/dist/index.js

@@ -1,18 +1,20 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.defaultMissingFieldHandler = exports.readButDoNotEvaluate = exports.read = exports.useRead = exports.useLazyReference = exports.iso = exports.useIsographEnvironment = exports.IsographEnvironmentProvider = exports.ROOT_ID = exports.IsographEnvironmentContext = exports.subscribe = exports.makeNetworkRequest = void 0;
+exports.defaultMissingFieldHandler = exports.readButDoNotEvaluate = exports.read = exports.useRead = exports.useLazyReference = exports.iso = exports.createIsographStore = exports.createIsographEnvironment = exports.useIsographEnvironment = exports.IsographEnvironmentProvider = exports.ROOT_ID = exports.IsographEnvironmentContext = exports.subscribe = exports.makeNetworkRequest = void 0;
 const cache_1 = require("./cache");
 const react_disposable_state_1 = require("@isograph/react-disposable-state");
 const componentCache_1 = require("./componentCache");
-const context_1 = require("./context");
+const IsographEnvironment_1 = require("./IsographEnvironment");
 var cache_2 = require("./cache");
 Object.defineProperty(exports, "makeNetworkRequest", { enumerable: true, get: function () { return cache_2.makeNetworkRequest; } });
 Object.defineProperty(exports, "subscribe", { enumerable: true, get: function () { return cache_2.subscribe; } });
-var context_2 = require("./context");
-Object.defineProperty(exports, "IsographEnvironmentContext", { enumerable: true, get: function () { return context_2.IsographEnvironmentContext; } });
-Object.defineProperty(exports, "ROOT_ID", { enumerable: true, get: function () { return context_2.ROOT_ID; } });
-Object.defineProperty(exports, "IsographEnvironmentProvider", { enumerable: true, get: function () { return context_2.IsographEnvironmentProvider; } });
-Object.defineProperty(exports, "useIsographEnvironment", { enumerable: true, get: function () { return context_2.useIsographEnvironment; } });
+var IsographEnvironment_2 = require("./IsographEnvironment");
+Object.defineProperty(exports, "IsographEnvironmentContext", { enumerable: true, get: function () { return IsographEnvironment_2.IsographEnvironmentContext; } });
+Object.defineProperty(exports, "ROOT_ID", { enumerable: true, get: function () { return IsographEnvironment_2.ROOT_ID; } });
+Object.defineProperty(exports, "IsographEnvironmentProvider", { enumerable: true, get: function () { return IsographEnvironment_2.IsographEnvironmentProvider; } });
+Object.defineProperty(exports, "useIsographEnvironment", { enumerable: true, get: function () { return IsographEnvironment_2.useIsographEnvironment; } });
+Object.defineProperty(exports, "createIsographEnvironment", { enumerable: true, get: function () { return IsographEnvironment_2.createIsographEnvironment; } });
+Object.defineProperty(exports, "createIsographStore", { enumerable: true, get: function () { return IsographEnvironment_2.createIsographStore; } });
 var iso_1 = require("./iso");
 Object.defineProperty(exports, "iso", { enumerable: true, get: function () { return iso_1.iso; } });
 function assertIsEntrypoint(value) {
@@ -24,7 +26,7 @@ function assertIsEntrypoint(value) {
 // We cannot write TEntrypoint extends IsographEntrypoint<never, never, never>, or else
 // any actual Entrypoint we pass will not be valid.
 function useLazyReference(entrypoint, variables) {
-    const environment = (0, context_1.useIsographEnvironment)();
+    const environment = (0, IsographEnvironment_1.useIsographEnvironment)();
     assertIsEntrypoint(entrypoint);
     // Typechecking fails here... TODO investigate
     const cache = (0, cache_1.getOrCreateCacheForArtifact)(environment, entrypoint, variables);
@@ -35,7 +37,7 @@ function useLazyReference(entrypoint, variables) {
         queryReference: {
             kind: 'FragmentReference',
             readerArtifact: entrypoint.readerArtifact,
-            root: context_1.ROOT_ID,
+            root: IsographEnvironment_1.ROOT_ID,
             variables,
             nestedRefetchQueries: entrypoint.nestedRefetchQueries,
         },
@@ -43,7 +45,7 @@ function useLazyReference(entrypoint, variables) {
 }
 exports.useLazyReference = useLazyReference;
 function useRead(fragmentReference) {
-    const environment = (0, context_1.useIsographEnvironment)();
+    const environment = (0, IsographEnvironment_1.useIsographEnvironment)();
     return read(environment, fragmentReference);
 }
 exports.useRead = useRead;
@@ -53,7 +55,7 @@ function read(environment, fragmentReference) {
     if (variant.kind === 'Eager') {
         const data = readData(environment, fragmentReference.readerArtifact.readerAst, fragmentReference.root, (_a = fragmentReference.variables) !== null && _a !== void 0 ? _a : {}, fragmentReference.nestedRefetchQueries);
         if (data.kind === 'MissingData') {
-            throw (0, cache_1.onNextChange)();
+            throw (0, cache_1.onNextChange)(environment);
         }
         else {
             return fragmentReference.readerArtifact.resolver(data.data);
@@ -74,7 +76,7 @@ function readButDoNotEvaluate(environment, reference) {
         console.log('done reading', { response });
     }
     if (response.kind === 'MissingData') {
-        throw (0, cache_1.onNextChange)();
+        throw (0, cache_1.onNextChange)(environment);
     }
     else {
         return response.data;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@isograph/react",
-  "version": "0.0.0-main-f49c67bb",
+  "version": "0.0.0-main-35c553b5",
   "description": "Use Isograph with React",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -15,8 +15,8 @@
     "prepack": "yarn run test && yarn run compile"
   },
   "dependencies": {
-    "@isograph/disposable-types": "0.0.0-main-f49c67bb",
-    "@isograph/react-disposable-state": "0.0.0-main-f49c67bb",
+    "@isograph/disposable-types": "0.0.0-main-35c553b5",
+    "@isograph/react-disposable-state": "0.0.0-main-35c553b5",
     "react": "^18.2.0"
   },
   "devDependencies": {

package/src/{context.tsx → IsographEnvironment.tsx}

@@ -1,14 +1,29 @@
 import { ReactNode, createContext, useContext } from 'react';
 import * as React from 'react';
 import { subscribe } from './cache';
+import { ParentCache } from '@isograph/isograph-react-disposable-state';
 
 export const IsographEnvironmentContext =
   createContext<IsographEnvironment | null>(null);
 
+type ComponentName = string;
+type StringifiedArgs = string;
+type ComponentCache = {
+  [key: DataId]: {
+    [key: ComponentName]: { [key: StringifiedArgs]: React.FC<any> };
+  };
+};
+
+export type Subscriptions = Set<() => void>;
+type SuspenseCache = { [index: string]: ParentCache<any> };
+
 export type IsographEnvironment = {
   store: IsographStore;
   networkFunction: IsographNetworkFunction;
   missingFieldHandler: MissingFieldHandler | null;
+  componentCache: ComponentCache;
+  subscriptions: Subscriptions;
+  suspenseCache: SuspenseCache;
 };
 
 export type MissingFieldHandler = (
@@ -68,7 +83,7 @@ export function IsographEnvironmentProvider({
 }: IsographEnvironmentProviderProps) {
   const [, setState] = React.useState<object | void>();
   React.useEffect(() => {
-    return subscribe(() => setState({}));
+    return subscribe(environment, () => setState({}));
   }, []);
 
   return (
@@ -88,3 +103,24 @@ export function useIsographEnvironment(): IsographEnvironment {
   }
   return context;
 }
+
+export function createIsographEnvironment(
+  store: IsographStore,
+  networkFunction: IsographNetworkFunction,
+  missingFieldHandler?: MissingFieldHandler,
+): IsographEnvironment {
+  return {
+    store,
+    networkFunction,
+    missingFieldHandler: missingFieldHandler ?? null,
+    componentCache: {},
+    subscriptions: new Set(),
+    suspenseCache: {},
+  };
+}
+
+export function createIsographStore() {
+  return {
+    [ROOT_ID]: {},
+  };
+}

package/src/cache.tsx

@@ -21,7 +21,7 @@ import {
   StoreRecord,
   Link,
   type IsographEnvironment,
-} from './context';
+} from './IsographEnvironment';
 
 declare global {
   interface Window {
@@ -29,24 +29,23 @@ declare global {
   }
 }
 
-const cache: { [index: string]: ParentCache<any> } = {};
-
 function getOrCreateCache<T>(
+  environment: IsographEnvironment,
   index: string,
   factory: Factory<T>,
 ): ParentCache<T> {
   if (typeof window !== 'undefined' && window.__LOG) {
     console.log('getting cache for', {
       index,
-      cache: Object.keys(cache),
-      found: !!cache[index],
+      cache: Object.keys(environment.suspenseCache),
+      found: !!environment.suspenseCache[index],
     });
   }
-  if (cache[index] == null) {
-    cache[index] = new ParentCache(factory);
+  if (environment.suspenseCache[index] == null) {
+    environment.suspenseCache[index] = new ParentCache(factory);
   }
 
-  return cache[index];
+  return environment.suspenseCache[index];
 }
 
 /**
@@ -81,7 +80,7 @@ export function getOrCreateCacheForArtifact<T>(
   const cacheKey = artifact.queryText + JSON.stringify(stableCopy(variables));
   const factory: Factory<PromiseWrapper<T>> = () =>
     makeNetworkRequest<T>(environment, artifact, variables);
-  return getOrCreateCache<PromiseWrapper<T>>(cacheKey, factory);
+  return getOrCreateCache<PromiseWrapper<T>>(environment, cacheKey, factory);
 }
 
 export function makeNetworkRequest<T>(
@@ -160,27 +159,28 @@ function normalizeData(
   if (typeof window !== 'undefined' && window.__LOG) {
     console.log('after normalization', { store: environment.store });
   }
-  callSubscriptions();
+  callSubscriptions(environment);
 }
 
-export function subscribe(callback: () => void): () => void {
-  subscriptions.add(callback);
-  return () => subscriptions.delete(callback);
+export function subscribe(
+  environment: IsographEnvironment,
+  callback: () => void,
+): () => void {
+  environment.subscriptions.add(callback);
+  return () => environment.subscriptions.delete(callback);
 }
 
-export function onNextChange(): Promise<void> {
+export function onNextChange(environment: IsographEnvironment): Promise<void> {
   return new Promise((resolve) => {
-    const unsubscribe = subscribe(() => {
+    const unsubscribe = subscribe(environment, () => {
       unsubscribe();
       resolve();
     });
   });
 }
 
-const subscriptions: Set<() => void> = new Set();
-
-function callSubscriptions() {
-  subscriptions.forEach((callback) => callback());
+function callSubscriptions(environment: IsographEnvironment) {
+  environment.subscriptions.forEach((callback) => callback());
 }
 
 /**

package/src/componentCache.ts

@@ -1,19 +1,11 @@
 import {
-  DataId,
   ReaderArtifact,
   RefetchQueryArtifactWrapper,
   readButDoNotEvaluate,
 } from './index';
 import { stableCopy } from './cache';
-import { IsographEnvironment } from '../dist';
+import { IsographEnvironment, DataId } from './IsographEnvironment';
 
-type ComponentName = string;
-type StringifiedArgs = string;
-const cachedComponentsById: {
-  [key: DataId]: {
-    [key: ComponentName]: { [key: StringifiedArgs]: React.FC<any> };
-  };
-} = {};
 export function getOrCreateCachedComponent(
   environment: IsographEnvironment,
   root: DataId,
@@ -22,6 +14,7 @@ export function getOrCreateCachedComponent(
   variables: { [key: string]: string },
   resolverRefetchQueries: RefetchQueryArtifactWrapper[],
 ) {
+  const cachedComponentsById = environment.componentCache;
   const stringifiedArgs = JSON.stringify(stableCopy(variables));
   cachedComponentsById[root] = cachedComponentsById[root] ?? {};
   const componentsByName = cachedComponentsById[root];

package/src/index.tsx

@@ -14,7 +14,7 @@ import {
   ROOT_ID,
   StoreRecord,
   useIsographEnvironment,
-} from './context';
+} from './IsographEnvironment';
 
 export { makeNetworkRequest, subscribe } from './cache';
 export {
@@ -30,7 +30,9 @@ export {
   type Link,
   type StoreRecord,
   useIsographEnvironment,
-} from './context';
+  createIsographEnvironment,
+  createIsographStore,
+} from './IsographEnvironment';
 
 export { iso } from './iso';
 
@@ -285,7 +287,7 @@ export function read<
       fragmentReference.nestedRefetchQueries,
     );
     if (data.kind === 'MissingData') {
-      throw onNextChange();
+      throw onNextChange(environment);
     } else {
       return fragmentReference.readerArtifact.resolver(data.data);
     }
@@ -319,7 +321,7 @@ export function readButDoNotEvaluate<TReadFromStore extends Object>(
     console.log('done reading', { response });
   }
   if (response.kind === 'MissingData') {
-    throw onNextChange();
+    throw onNextChange(environment);
   } else {
     return response.data;
   }