houdini 1.1.7 → 1.2.0-next.0

package/build/runtime-cjs/lib/selection.js

@@ -21,7 +21,15 @@ __export(selection_exports, {
   getFieldsForType: () => getFieldsForType
 });
 module.exports = __toCommonJS(selection_exports);
-function getFieldsForType(selection, __typename) {
+function getFieldsForType(selection, __typename, loading) {
+  if (loading) {
+    if (selection.loadingTypes && selection.loadingTypes.length > 0) {
+      return deepMerge(
+        ...selection.loadingTypes.map((type) => selection.abstractFields?.fields[type])
+      );
+    }
+    return selection.fields ?? {};
+  }
   let targetSelection = selection.fields || {};
   if (selection.abstractFields && __typename) {
     const mappedType = selection.abstractFields.typeMap[__typename];
@@ -33,6 +41,25 @@ function getFieldsForType(selection, __typename) {
   }
   return targetSelection;
 }
+function deepMerge(...objects) {
+  const mergedObj = {};
+  for (let obj of objects) {
+    if (!obj) {
+      continue;
+    }
+    for (let prop in obj) {
+      if (prop in obj) {
+        const val = obj[prop];
+        if (typeof val === "object" && val !== null && !Array.isArray(val)) {
+          mergedObj[prop] = deepMerge(mergedObj[prop] || {}, val);
+        } else {
+          mergedObj[prop] = val;
+        }
+      }
+    }
+  }
+  return mergedObj;
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   getFieldsForType

package/build/runtime-cjs/lib/types.d.ts

@@ -25,6 +25,7 @@ declare global {
             };
             optimisticResponse?: GraphQLObject;
             parentID?: string;
+            silenceLoading?: boolean;
         }
     }
 }
@@ -52,9 +53,12 @@ export type CompiledDocumentKind = ArtifactKinds;
 export type QueryArtifact = BaseCompiledDocument<'HoudiniQuery'> & {
     policy?: CachePolicies;
     partial?: boolean;
+    enableLoadingState?: boolean;
 };
 export type MutationArtifact = BaseCompiledDocument<'HoudiniMutation'>;
-export type FragmentArtifact = BaseCompiledDocument<'HoudiniFragment'>;
+export type FragmentArtifact = BaseCompiledDocument<'HoudiniFragment'> & {
+    enableLoadingState?: boolean;
+};
 export type SubscriptionArtifact = BaseCompiledDocument<'HoudiniSubscription'>;
 export declare const RefetchUpdateMode: {
     readonly append: "append";
@@ -128,12 +132,31 @@ export type GraphQLObject = {
     [key: string]: GraphQLValue;
 };
 export type GraphQLValue = number | string | boolean | null | GraphQLObject | GraphQLValue[] | undefined;
+export type LoadingSpec = {
+    kind: 'continue';
+    list?: {
+        depth: number;
+        count: number;
+    };
+} | {
+    kind: 'value';
+    value?: any;
+    list?: {
+        depth: number;
+        count: number;
+    };
+};
 export type SubscriptionSelection = {
-    fragments?: Record<string, ValueMap>;
+    loadingTypes?: string[];
+    fragments?: Record<string, {
+        arguments: ValueMap;
+        loading?: boolean;
+    }>;
     fields?: {
         [fieldName: string]: {
             type: string;
             nullable?: boolean;
+            required?: boolean;
             keyRaw: string;
             operations?: MutationOperation[];
             list?: {
@@ -141,6 +164,7 @@ export type SubscriptionSelection = {
                 connection: boolean;
                 type: string;
             };
+            loading?: LoadingSpec;
             directives?: {
                 name: string;
                 arguments: ValueMap;
@@ -153,6 +177,7 @@ export type SubscriptionSelection = {
             }>;
             selection?: SubscriptionSelection;
             abstract?: boolean;
+            abstractHasRequired?: boolean;
         };
     };
     abstractFields?: {
@@ -194,9 +219,54 @@ export type RequestPayload<GraphQLObject = any> = {
 };
 export type NestedList<_Result = string> = (_Result | null | NestedList<_Result>)[];
 export type ValueOf<Parent> = Parent[keyof Parent];
-export declare const fragmentKey = " $fragments";
+export declare const fragmentKey: " $fragments";
 export type ValueNode = VariableNode | IntValueNode | FloatValueNode | StringValueNode | BooleanValueNode | NullValueNode | EnumValueNode | ListValueNode | ObjectValueNode;
 export type ValueMap = Record<string, ValueNode>;
+export type FetchParams<_Input> = {
+    variables?: _Input;
+    /**
+     * The policy to use when performing the fetch. If set to CachePolicy.NetworkOnly,
+     * a request will always be sent, even if the variables are the same as the last call
+     * to fetch.
+     */
+    policy?: CachePolicies;
+    /**
+     * An object that will be passed to the fetch function.
+     * You can do what you want with it!
+     */
+    metadata?: App.Metadata;
+};
+export type FetchFn<_Data extends GraphQLObject, _Input = any> = (params?: FetchParams<_Input>) => Promise<QueryResult<_Data, _Input>>;
+export type CursorHandlers<_Data extends GraphQLObject, _Input> = {
+    loadNextPage: (args?: {
+        first?: number;
+        after?: string;
+        fetch?: typeof globalThis.fetch;
+        metadata?: {};
+    }) => Promise<void>;
+    loadPreviousPage: (args?: {
+        last?: number;
+        before?: string;
+        fetch?: typeof globalThis.fetch;
+        metadata?: {};
+    }) => Promise<void>;
+    fetch(args?: FetchParams<_Input> | undefined): Promise<QueryResult<_Data, _Input>>;
+};
+export type OffsetHandlers<_Data extends GraphQLObject, _Input> = {
+    loadNextPage: (args?: {
+        limit?: number;
+        offset?: number;
+        metadata?: {};
+        fetch?: typeof globalThis.fetch;
+    }) => Promise<void>;
+    fetch(args?: FetchParams<_Input> | undefined): Promise<QueryResult<_Data, _Input>>;
+};
+export type PageInfo = {
+    startCursor: string | null;
+    endCursor: string | null;
+    hasNextPage: boolean;
+    hasPreviousPage: boolean;
+};
 interface IntValueNode {
     readonly kind: 'IntValue';
     readonly value: string;
@@ -241,4 +311,6 @@ interface VariableNode {
     readonly kind: 'Variable';
     readonly name: NameNode;
 }
+export declare const PendingValue: unique symbol;
+export type LoadingType = typeof PendingValue;
 export {};

package/build/runtime-cjs/lib/types.js

@@ -26,6 +26,7 @@ __export(types_exports, {
   CompiledSubscriptionKind: () => CompiledSubscriptionKind,
   DataSource: () => DataSource,
   PaginateMode: () => PaginateMode,
+  PendingValue: () => PendingValue,
   RefetchUpdateMode: () => RefetchUpdateMode,
   fragmentKey: () => fragmentKey
 });
@@ -61,6 +62,7 @@ const DataSource = {
   Ssr: "ssr"
 };
 const fragmentKey = " $fragments";
+const PendingValue = Symbol("houdini_loading");
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   ArtifactKind,
@@ -71,6 +73,7 @@ const fragmentKey = " $fragments";
   CompiledSubscriptionKind,
   DataSource,
   PaginateMode,
+  PendingValue,
   RefetchUpdateMode,
   fragmentKey
 });

package/build/runtime-esm/cache/cache.d.ts

@@ -3,7 +3,6 @@ import type { GraphQLObject, GraphQLValue, NestedList, SubscriptionSelection, Su
 import { GarbageCollector } from './gc';
 import type { ListCollection } from './lists';
 import { ListManager } from './lists';
-import { SchemaManager } from './schema';
 import { StaleManager } from './staleManager';
 import type { Layer, LayerID } from './storage';
 import { InMemoryStorage } from './storage';
@@ -57,15 +56,13 @@ declare class CacheInternal {
     cache: Cache;
     lifetimes: GarbageCollector;
     staleManager: StaleManager;
-    schema: SchemaManager;
-    constructor({ storage, subscriptions, lists, cache, lifetimes, staleManager, schema, disabled, config, }: {
+    constructor({ storage, subscriptions, lists, cache, lifetimes, staleManager, disabled, config, }: {
         storage: InMemoryStorage;
         subscriptions: InMemorySubscriptions;
         lists: ListManager;
         cache: Cache;
         lifetimes: GarbageCollector;
         staleManager: StaleManager;
-        schema: SchemaManager;
         disabled: boolean;
         config?: ConfigFile;
     });
@@ -87,12 +84,13 @@ declare class CacheInternal {
         forceNotify?: boolean;
         forceStale?: boolean;
     }): FieldSelection[];
-    getSelection({ selection, parent, variables, stepsFromConnection, ignoreMasking, fullCheck, }: {
+    getSelection({ selection, parent, variables, stepsFromConnection, ignoreMasking, fullCheck, loading: generateLoading, }: {
         selection: SubscriptionSelection;
         parent?: string;
         variables?: {};
         stepsFromConnection?: number | null;
         ignoreMasking?: boolean;
+        loading?: boolean;
         fullCheck?: boolean;
     }): {
         data: GraphQLObject | null;
@@ -104,13 +102,14 @@ declare class CacheInternal {
     id(type: string, id: string): string | null;
     idFields(type: string): string[];
     computeID(type: string, data: any): string;
-    hydrateNestedList({ fields, variables, linkedList, stepsFromConnection, ignoreMasking, fullCheck, }: {
+    hydrateNestedList({ fields, variables, linkedList, stepsFromConnection, ignoreMasking, fullCheck, loading, }: {
         fields: SubscriptionSelection;
         variables?: {};
         linkedList: NestedList;
         stepsFromConnection: number | null;
         ignoreMasking: boolean;
         fullCheck?: boolean;
+        loading?: boolean;
     }): {
         data: NestedList<GraphQLValue>;
         partial: boolean;

package/build/runtime-esm/cache/cache.js

@@ -1,4 +1,4 @@
-import { computeKey } from "../lib";
+import { computeKey, PendingValue } from "../lib";
 import { computeID, defaultConfigValues, keyFieldsForType, getCurrentConfig } from "../lib/config";
 import { deepEquals } from "../lib/deepEquals";
 import { flatten } from "../lib/flatten";
@@ -6,7 +6,6 @@ import { getFieldsForType } from "../lib/selection";
 import { fragmentKey } from "../lib/types";
 import { GarbageCollector } from "./gc";
 import { ListManager } from "./lists";
-import { SchemaManager } from "./schema";
 import { StaleManager } from "./staleManager";
 import { InMemoryStorage } from "./storage";
 import { evaluateKey } from "./stuff";
@@ -21,7 +20,6 @@ class Cache {
       lists: new ListManager(this, rootID),
       lifetimes: new GarbageCollector(this),
       staleManager: new StaleManager(this),
-      schema: new SchemaManager(this),
       disabled: disabled ?? typeof globalThis.window === "undefined"
     });
     if (Object.keys(config).length > 0) {
@@ -132,7 +130,6 @@ class CacheInternal {
   cache;
   lifetimes;
   staleManager;
-  schema;
   constructor({
     storage,
     subscriptions,
@@ -140,7 +137,6 @@ class CacheInternal {
     cache,
     lifetimes,
     staleManager,
-    schema,
     disabled,
     config
   }) {
@@ -150,7 +146,6 @@ class CacheInternal {
     this.cache = cache;
     this.lifetimes = lifetimes;
     this.staleManager = staleManager;
-    this.schema = schema;
     this._config = config;
     this._disabled = disabled;
     try {
@@ -180,7 +175,11 @@ class CacheInternal {
     if (this._disabled) {
       return [];
     }
-    let targetSelection = getFieldsForType(selection, data["__typename"]);
+    let targetSelection = getFieldsForType(
+      selection,
+      data["__typename"],
+      false
+    );
     for (const [field, value] of Object.entries(data)) {
       if (!selection || !targetSelection[field]) {
         continue;
@@ -191,17 +190,9 @@ class CacheInternal {
         selection: fieldSelection,
         operations,
         abstract: isAbstract,
-        updates,
-        nullable
+        updates
       } = targetSelection[field];
       const key = evaluateKey(keyRaw, variables);
-      this.schema.setFieldType({
-        parent,
-        key: keyRaw,
-        type: linkedType,
-        nullable,
-        link: !!fieldSelection
-      });
       if (value && typeof value === "object" && "__typename" in value && value["__typename"]) {
         linkedType = value["__typename"];
       }
@@ -447,32 +438,49 @@ class CacheInternal {
     variables,
     stepsFromConnection = null,
     ignoreMasking,
-    fullCheck = false
+    fullCheck = false,
+    loading: generateLoading
   }) {
     if (parent === null) {
       return { data: null, partial: false, stale: false, hasData: true };
     }
     const target = {};
     if (selection.fragments) {
-      target[fragmentKey] = Object.fromEntries(
-        Object.entries(selection.fragments).map(([key, value]) => [
-          key,
-          {
-            parent,
-            variables: evaluateFragmentVariables(value, variables ?? {})
-          }
-        ])
-      );
+      target[fragmentKey] = {
+        loading: Boolean(generateLoading),
+        values: Object.fromEntries(
+          Object.entries(selection.fragments).filter(([, value]) => !generateLoading || value.loading).map(([key, value]) => [
+            key,
+            {
+              parent,
+              variables: evaluateFragmentVariables(
+                value.arguments,
+                variables ?? {}
+              )
+            }
+          ])
+        )
+      };
     }
     let hasData = !!selection.fragments;
     let partial = false;
     let cascadeNull = false;
     let stale = false;
     const typename = this.storage.get(parent, "__typename").value;
-    let targetSelection = getFieldsForType(selection, typename);
+    let targetSelection = getFieldsForType(selection, typename, !!generateLoading);
     for (const [
       attributeName,
-      { type, keyRaw, selection: fieldSelection, nullable, list, visible, directives }
+      {
+        type,
+        keyRaw,
+        selection: fieldSelection,
+        nullable,
+        list,
+        visible,
+        directives,
+        loading: fieldLoading,
+        abstractHasRequired
+      }
     ] of Object.entries(targetSelection)) {
       if (!visible && !ignoreMasking && !fullCheck) {
         continue;
@@ -495,11 +503,17 @@ class CacheInternal {
       }
       const fieldTarget = visible || ignoreMasking ? target : {};
       const key = evaluateKey(keyRaw, variables);
-      const { value } = this.storage.get(parent, key);
+      if (generateLoading && !fieldLoading) {
+        continue;
+      }
+      let { value } = this.storage.get(parent, key);
       const dt_field = this.staleManager.getFieldTime(parent, key);
       if (dt_field === null) {
         stale = true;
       }
+      if (generateLoading) {
+        value = void 0;
+      }
       let nextStep = stepsFromConnection;
       if (nextStep !== null) {
         if (nextStep >= 2) {
@@ -515,7 +529,10 @@ class CacheInternal {
       if (typeof value === "undefined" && !embeddedCursor) {
         partial = true;
       }
-      if (typeof value === "undefined" || value === null) {
+      if (generateLoading && fieldLoading?.kind === "value") {
+        fieldTarget[attributeName] = PendingValue;
+        hasData = true;
+      } else if (!generateLoading && typeof value === "undefined" || value === null) {
         fieldTarget[attributeName] = null;
         if (typeof value !== "undefined") {
           hasData = true;
@@ -535,7 +552,8 @@ class CacheInternal {
           linkedList: value,
           stepsFromConnection: nextStep,
           ignoreMasking: !!ignoreMasking,
-          fullCheck
+          fullCheck,
+          loading: generateLoading
         });
         fieldTarget[attributeName] = listValue.data;
         if (listValue.partial) {
@@ -554,7 +572,8 @@ class CacheInternal {
           variables,
           stepsFromConnection: nextStep,
           ignoreMasking,
-          fullCheck
+          fullCheck,
+          loading: generateLoading
         });
         fieldTarget[attributeName] = objectFields.data;
         if (objectFields.partial) {
@@ -567,13 +586,27 @@ class CacheInternal {
           hasData = true;
         }
       }
+      if (generateLoading && fieldLoading?.list) {
+        fieldTarget[attributeName] = wrapInLists(
+          Array.from({ length: fieldLoading.list.count }).fill(
+            fieldTarget[attributeName]
+          ),
+          fieldLoading.list.depth - 1
+        );
+      }
       if (fieldTarget[attributeName] === null && !nullable && !embeddedCursor) {
-        cascadeNull = true;
+        if (abstractHasRequired) {
+          target[attributeName] = {
+            __typename: "@required field missing; don't match this"
+          };
+        } else {
+          cascadeNull = true;
+        }
       }
     }
     return {
       data: cascadeNull ? null : target,
-      partial: hasData && partial,
+      partial: !generateLoading && hasData && partial,
       stale: hasData && stale,
       hasData
     };
@@ -600,7 +633,8 @@ class CacheInternal {
     linkedList,
     stepsFromConnection,
     ignoreMasking,
-    fullCheck
+    fullCheck,
+    loading
   }) {
     const result = [];
     let partialData = false;
@@ -614,7 +648,8 @@ class CacheInternal {
           linkedList: entry,
           stepsFromConnection,
           ignoreMasking,
-          fullCheck
+          fullCheck,
+          loading
         });
         result.push(nestedValue.data);
         if (nestedValue.partial) {
@@ -637,7 +672,8 @@ class CacheInternal {
         variables,
         stepsFromConnection,
         ignoreMasking,
-        fullCheck
+        fullCheck,
+        loading
       });
       result.push(data);
       if (partial) {
@@ -744,6 +780,12 @@ function evaluateFragmentVariables(variables, args) {
     Object.entries(variables).map(([key, value]) => [key, fragmentVariableValue(value, args)])
   );
 }
+function wrapInLists(target, count = 0) {
+  if (count === 0) {
+    return target;
+  }
+  return wrapInLists([target], count - 1);
+}
 function fragmentVariableValue(value, args) {
   if (value.kind === "StringValue") {
     return value.value;

package/build/runtime-esm/cache/subscription.js

@@ -17,7 +17,7 @@ class InMemorySubscriptions {
     parentType
   }) {
     const __typename = this.cache._internal_unstable.storage.get(parent, "__typename").value;
-    let targetSelection = getFieldsForType(selection, __typename);
+    let targetSelection = getFieldsForType(selection, __typename, false);
     for (const fieldSelection of Object.values(targetSelection || {})) {
       const {
         keyRaw,
@@ -34,7 +34,7 @@ class InMemorySubscriptions {
       let targetSelection2;
       if (innerSelection) {
         const __typename2 = this.cache._internal_unstable.storage.get(parent, "__typename").value;
-        targetSelection2 = getFieldsForType(innerSelection, __typename2);
+        targetSelection2 = getFieldsForType(innerSelection, __typename2, false);
       }
       this.addFieldSubscription({
         id: parent,
@@ -145,7 +145,7 @@ class InMemorySubscriptions {
           filters
         } = selection;
         const key = evaluateKey(keyRaw, variables);
-        const fieldSelection = innerSelection ? getFieldsForType(innerSelection, parentType) : void 0;
+        const fieldSelection = innerSelection ? getFieldsForType(innerSelection, parentType, false) : void 0;
         this.addFieldSubscription({
           id: parent,
           key,
@@ -175,7 +175,7 @@ class InMemorySubscriptions {
               linkedRecord,
               "__typename"
             ).value;
-            let targetSelection2 = getFieldsForType(childSelection, __typename);
+            let targetSelection2 = getFieldsForType(childSelection, __typename, false);
             this.addMany({
               parent: linkedRecord,
               variables,
@@ -194,7 +194,7 @@ class InMemorySubscriptions {
     visited.push(id);
     const linkedIDs = [];
     const __typename = this.cache._internal_unstable.storage.get(id, "__typename").value;
-    let targetSelection = getFieldsForType(selection, __typename);
+    let targetSelection = getFieldsForType(selection, __typename, false);
     for (const fieldSelection of Object.values(targetSelection || {})) {
       const key = evaluateKey(fieldSelection.keyRaw, variables);
       this.removeSubscribers(id, key, targets);

package/build/runtime-esm/client/documentStore.d.ts

@@ -5,6 +5,9 @@ import { Writable } from '../lib/store';
 import type { DocumentArtifact, QueryResult, GraphQLObject, SubscriptionSpec, CachePolicies } from '../lib/types';
 export declare class DocumentStore<_Data extends GraphQLObject, _Input extends Record<string, any>> extends Writable<QueryResult<_Data, _Input>> {
     #private;
+    pendingPromise: {
+        then: (val: any) => void;
+    } | null;
     constructor({ artifact, plugins, pipeline, client, cache, initialValue, fetching, }: {
         artifact: DocumentArtifact;
         plugins?: ClientHooks[];

package/build/runtime-esm/client/documentStore.js

@@ -15,6 +15,7 @@ class DocumentStore extends Writable {
   #plugins;
   #lastVariables;
   #lastContext = null;
+  pendingPromise = null;
   constructor({
     artifact,
     plugins,
@@ -47,7 +48,15 @@ class DocumentStore extends Writable {
     this.#plugins = pipeline ?? [
       cachePolicy({
         enabled: cache,
-        setFetching: (fetching2) => this.update((state) => ({ ...state, fetching: fetching2 }))
+        setFetching: (fetching2, data) => {
+          this.update((state) => {
+            const newState = { ...state, fetching: fetching2 };
+            if (fetching2 && data) {
+              newState.data = data;
+            }
+            return newState;
+          });
+        }
       })(),
       ...plugins ?? []
     ];
@@ -87,7 +96,7 @@ class DocumentStore extends Writable {
     const draft = context.draft();
     draft.variables = variables ?? null;
     context = context.apply(draft, false);
-    return await new Promise((resolve, reject) => {
+    const promise = new Promise((resolve, reject) => {
       const state = {
         setup,
         currentStep: 0,
@@ -96,12 +105,17 @@ class DocumentStore extends Writable {
         promise: {
           resolved: false,
           resolve,
-          reject
+          reject,
+          then: (...args) => promise.then(...args)
         },
         context
       };
+      if (this.pendingPromise === null) {
+        this.pendingPromise = state.promise;
+      }
       this.#step("forward", state);
     });
+    return await promise;
   }
   async cleanup() {
     for (const plugin of this.#plugins) {
@@ -220,16 +234,15 @@ class DocumentStore extends Writable {
         value
       );
     }
+    if (!ctx.silenceEcho || value.data !== this.state.data) {
+      this.set(value);
+    }
     if (!ctx.promise.resolved) {
       ctx.promise.resolve(value);
       ctx.promise.resolved = true;
     }
     this.#lastContext = ctx.context.draft();
     this.#lastVariables = this.#lastContext.stuff.inputs.marshaled;
-    if (ctx.silenceEcho && value.data === this.state.data) {
-      return;
-    }
-    this.set(value);
   }
 }
 class ClientPluginContextWrapper {

package/build/runtime-esm/client/index.d.ts

@@ -1,11 +1,11 @@
 /// <reference path="../../../../../houdini.d.ts" />
 import type { DocumentArtifact, GraphQLObject, NestedList } from '../lib/types';
-import type { ClientPlugin, ClientHooks } from './documentStore';
+import type { ClientHooks, ClientPlugin } from './documentStore';
 import { DocumentStore } from './documentStore';
-import { type FetchParamFn, type ThrowOnErrorParams } from './plugins';
-export { DocumentStore, type ClientPlugin } from './documentStore';
+import type { FetchParamFn, ThrowOnErrorOperations, ThrowOnErrorParams } from './plugins';
+export { DocumentStore, type ClientPlugin, type SendParams } from './documentStore';
 export { fetch, mutation, query, subscription } from './plugins';
-type ConstructorArgs = {
+export type HoudiniClientConstructorArgs = {
     url: string;
     fetchParams?: FetchParamFn;
     plugins?: NestedList<ClientPlugin>;
@@ -19,9 +19,10 @@ export type ObserveParams<_Data extends GraphQLObject, _Artifact extends Documen
     fetching?: boolean;
 };
 export declare class HoudiniClient {
-    #private;
     url: string;
-    constructor({ url, fetchParams, plugins, pipeline, throwOnError }: ConstructorArgs);
+    readonly plugins: ClientPlugin[];
+    readonly throwOnError_operations: ThrowOnErrorOperations[];
+    constructor({ url, fetchParams, plugins, pipeline, throwOnError, }: HoudiniClientConstructorArgs);
     observe<_Data extends GraphQLObject, _Input extends Record<string, any>>({ artifact, cache, initialValue, fetching, }: ObserveParams<_Data>): DocumentStore<_Data, _Input>;
 }
 export declare function createPluginHooks(plugins: ClientPlugin[]): ClientHooks[];