houdini-core 2.0.0-go.0

package/runtime/plugins/fetch.ts

@@ -0,0 +1,337 @@
+import type { ClientPlugin, ClientPluginContext } from 'houdini/runtime/documentStore'
+import { ArtifactKind, DataSource } from 'houdini/runtime/types'
+import type { RequestPayload, FetchContext } from 'houdini/runtime/types'
+
+export const fetch = (target?: RequestHandler | string): ClientPlugin => {
+	return () => {
+		return {
+			async network(ctx, { client, initialValue, resolve, marshalVariables }) {
+				// there is no fetch for a fragment
+				if (ctx.artifact.kind === ArtifactKind.Fragment) {
+					return resolve(ctx, initialValue)
+				}
+
+				// figure out which fetch to use
+				const fetch = ctx.fetch ?? globalThis.fetch
+
+				// build up the params object
+				const fetchParams: FetchParams = {
+					name: ctx.name,
+					text: ctx.text,
+					hash: ctx.hash,
+					variables: { ...marshalVariables(ctx) },
+				}
+
+				// before we move onto the next plugin, we need to strip the variables as they go through
+				for (const variable of ctx.artifact.stripVariables) {
+					delete fetchParams.variables[variable]
+				}
+
+				let fetchFn = defaultFetch(client.url, ctx.fetchParams)
+				// the provided parameter either specifies the URL or is the entire function to
+				// use
+				if (target) {
+					if (typeof target === 'string') {
+						fetchFn = defaultFetch(target, ctx.fetchParams)
+					} else {
+						fetchFn = target
+					}
+				}
+
+				const result = await fetchFn({
+					// wrap the user's fetch function so we can identify SSR by checking
+					// the response.url
+					fetch: (url: URL | RequestInfo, args: RequestInit | undefined) => {
+						// figure out if we need to do something special for multipart uploads
+						const newArgs = handleMultipart(fetchParams, args) ?? args
+						// use the new args if they exist, otherwise the old ones are good
+						return fetch(url, {
+							...newArgs,
+							signal: ctx.abortController.signal,
+						})
+					},
+					metadata: ctx.metadata,
+					session: ctx.session || {},
+					...fetchParams,
+				})
+
+				// return the result
+				resolve(ctx, {
+					fetching: false,
+					variables: ctx.variables ?? {},
+					data: result.data,
+					errors: !result.errors || result.errors.length === 0 ? null : result.errors,
+					partial: false,
+					stale: false,
+					source: DataSource.Network,
+				})
+			},
+		}
+	}
+}
+
+const defaultFetch = (
+	url: string,
+	params?: Required<ClientPluginContext>['fetchParams']
+): RequestHandler => {
+	// if there is no configured url, we can't use this plugin
+	if (!url) {
+		throw new Error(
+			'Could not find configured client url. Please specify one in your HoudiniClient constructor.'
+		)
+	}
+
+	return async ({ fetch, name, text, variables }) => {
+		// regular fetch (Server & Client)
+		const result = await fetch(url, {
+			method: 'POST',
+			body: JSON.stringify({ operationName: name, query: text, variables }),
+			...params,
+			headers: {
+				Accept: 'application/graphql+json, application/json',
+				'Content-Type': 'application/json',
+				...params?.headers,
+			},
+		})
+
+		// Avoid parsing the response if it's not JSON, as that will throw a SyntaxError
+		if (
+			!result.ok &&
+			!result.headers.get('content-type')?.startsWith('application/json') &&
+			!result.headers.get('content-type')?.startsWith('application/graphql+json')
+		) {
+			throw new Error(
+				`Failed to fetch: server returned invalid response with error ${result.status}: ${result.statusText}`
+			)
+		}
+
+		return await result.json()
+	}
+}
+
+/**
+ * ## Tip 👇
+ *
+ * To define types for your metadata, create a file `src/app.d.ts` containing the followingI:
+ *
+ * ```ts
+ * declare namespace App { *
+ * 	interface Metadata {}
+ * }
+ * ```
+ *
+ */
+export type RequestHandlerArgs = FetchContext & FetchParams
+
+export type RequestHandler<_Data = any> = (
+	args: RequestHandlerArgs
+) => Promise<RequestPayload<_Data>>
+
+export type FetchParams = {
+	name: string
+	text: string
+	hash: string
+	variables: { [key: string]: any }
+}
+
+function handleMultipart(
+	params: FetchParams,
+	args: RequestInit | undefined
+): RequestInit | undefined {
+	// process any files that could be included
+	const { files } = extractFiles({
+		variables: params.variables,
+	})
+
+	// if there are files in the request
+	if (files.size) {
+		const req = args
+		let headers: Record<string, string> = {}
+
+		// filters `content-type: application/json` if received by client.ts
+		if (req?.headers) {
+			const filtered = Object.entries(req?.headers).filter(([key, value]) => {
+				return !(
+					key.toLowerCase() == 'content-type' && value.toLowerCase() == 'application/json'
+				)
+			})
+			headers = Object.fromEntries(filtered)
+		}
+
+		// See the GraphQL multipart request spec:
+		// https://github.com/jaydenseric/graphql-multipart-request-spec
+		const form = new FormData()
+
+		// if we have a body, just use it.
+		if (args && args?.body) {
+			form.set('operations', args?.body as string)
+		} else {
+			form.set(
+				'operations',
+				JSON.stringify({
+					operationName: params.name,
+					query: params.text,
+					variables: params.variables,
+				})
+			)
+		}
+
+		const map: Record<string, Array<string>> = {}
+
+		let i = 0
+		files.forEach((paths) => {
+			map[++i] = paths
+		})
+		form.set('map', JSON.stringify(map))
+
+		i = 0
+		files.forEach((paths, file) => {
+			form.set(`${++i}`, file as Blob, (file as File).name)
+		})
+
+		return { ...req, headers, body: form as any }
+	}
+}
+
+/// This file contains a modified version of the functions found here: https://github.com/jaydenseric/extract-files/blob/master/extractFiles.mjs
+/// The associated license is at the end of the file (per the project's license agreement)
+
+export function isExtractableFile(value: any): value is ExtractableFile {
+	return (
+		(typeof File !== 'undefined' && value instanceof File) ||
+		(typeof Blob !== 'undefined' && value instanceof Blob)
+	)
+}
+
+type ExtractableFile = File | Blob
+
+/** @typedef {import("./isExtractableFile.mjs").default} isExtractableFile */
+
+export function extractFiles(value: any) {
+	if (!arguments.length) throw new TypeError('Argument 1 `value` is required.')
+
+	/**
+	 * Map of values recursed within the input value and their clones, for reusing
+	 * clones of values that are referenced multiple times within the input value.
+	 * @type {Map<Cloneable, Clone>}
+	 */
+	const clones = new Map()
+
+	/**
+	 * Extracted files and their object paths within the input value.
+	 * @type {Extraction<Extractable>["files"]}
+	 */
+	const files = new Map()
+
+	/**
+	 * Recursively clones the value, extracting files.
+	 */
+	function recurse(value: any, path: string | string[], recursed: Set<any>) {
+		if (isExtractableFile(value)) {
+			const filePaths = files.get(value)
+
+			// eslint-disable-next-line @typescript-eslint/no-unused-expressions
+			filePaths ? filePaths.push(path) : files.set(value, [path])
+
+			return null
+		}
+
+		const valueIsList =
+			Array.isArray(value) || (typeof FileList !== 'undefined' && value instanceof FileList)
+		const valueIsPlainObject = isPlainObject(value)
+
+		if (valueIsList || valueIsPlainObject) {
+			let clone = clones.get(value)
+
+			const uncloned = !clone
+
+			if (uncloned) {
+				clone = valueIsList
+					? []
+					: // Replicate if the plain object is an `Object` instance.
+					value instanceof /** @type {any} */ Object
+					? {}
+					: Object.create(null)
+
+				clones.set(value, /** @type {Clone} */ clone)
+			}
+
+			if (!recursed.has(value)) {
+				const pathPrefix = path ? `${path}.` : ''
+				const recursedDeeper = new Set(recursed).add(value)
+
+				if (valueIsList) {
+					let index = 0
+
+					// @ts-ignore
+					for (const item of value) {
+						const itemClone = recurse(item, pathPrefix + index++, recursedDeeper)
+
+						if (uncloned) /** @type {Array<unknown>} */ clone.push(itemClone)
+					}
+				} else
+					for (const key in value) {
+						const propertyClone = recurse(value[key], pathPrefix + key, recursedDeeper)
+
+						if (uncloned)
+							/** @type {Record<PropertyKey, unknown>} */ clone[key] = propertyClone
+					}
+			}
+
+			return clone
+		}
+
+		return value
+	}
+
+	return {
+		clone: recurse(value, '', new Set()),
+		files,
+	}
+}
+
+/**
+ * An extraction result.
+ * @template [Extractable=unknown] Extractable file type.
+ * @typedef {object} Extraction
+ * @prop {unknown} clone Clone of the original value with extracted files
+ *   recursively replaced with `null`.
+ * @prop {Map<Extractable, Array<ObjectPath>>} files Extracted files and their
+ *   object paths within the original value.
+ */
+
+/**
+ * String notation for the path to a node in an object tree.
+ * @typedef {string} ObjectPath
+ * @see [`object-path` on npm](https://npm.im/object-path).
+ * @example
+ * An object path for object property `a`, array index `0`, object property `b`:
+ *
+ * ```
+ * a.0.b
+ * ```
+ */
+
+function isPlainObject(value: any) {
+	if (typeof value !== 'object' || value === null) {
+		return false
+	}
+
+	const prototype = Object.getPrototypeOf(value)
+	return (
+		(prototype === null ||
+			prototype === Object.prototype ||
+			Object.getPrototypeOf(prototype) === null) &&
+		!(Symbol.toStringTag in value) &&
+		!(Symbol.iterator in value)
+	)
+}
+
+// MIT License
+// Copyright Jayden Seric
+
+// Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+// The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

package/runtime/plugins/fetchParams.ts

@@ -0,0 +1,36 @@
+import type { ClientPlugin, ClientPluginContext } from 'houdini/runtime/documentStore'
+import type { DocumentArtifact } from 'houdini/runtime/types'
+
+export type FetchParamFn = (ctx: FetchParamsInput) => Required<ClientPluginContext>['fetchParams']
+
+export const fetchParams: (fn?: FetchParamFn) => ClientPlugin =
+	(fn = () => ({})) =>
+	() => ({
+		start(ctx, { next, marshalVariables }) {
+			next({
+				...ctx,
+				fetchParams: fn({
+					// most of the stuff comes straight from the context
+					config: ctx.config,
+					policy: ctx.policy,
+					metadata: ctx.metadata,
+					session: ctx.session,
+					stuff: ctx.stuff,
+					// a few fields are renamed or modified
+					document: ctx.artifact,
+					variables: marshalVariables(ctx),
+					text: ctx.text,
+					hash: ctx.hash,
+				}),
+			})
+		},
+	})
+
+export type FetchParamsInput = Pick<
+	ClientPluginContext,
+	'config' | 'policy' | 'variables' | 'metadata' | 'session' | 'stuff'
+> & {
+	text: string
+	hash: string
+	document: DocumentArtifact
+}

package/runtime/plugins/fragment.ts

@@ -0,0 +1,80 @@
+import { deepEquals } from 'houdini/runtime'
+import type { Cache } from 'houdini/runtime/cache'
+import { type SubscriptionSpec, ArtifactKind, DataSource } from 'houdini/runtime/types'
+
+import { documentPlugin } from './utils'
+
+// the purpose of the fragment plugin is to provide fine-reactivity for cache updates
+// there are no network requests that get sent. send() always returns the initial value
+export const fragment = (cache: Cache) =>
+	documentPlugin(ArtifactKind.Fragment, function () {
+		// track the bits of state we need to hold onto
+		let subscriptionSpec: SubscriptionSpec | null = null
+
+		// we need to track the last parents and variables used so we can re-subscribe
+		let lastReference: { parent: string; variables: any } | null = null
+
+		return {
+			// establish the cache subscription
+			start(ctx, { next, resolve, variablesChanged, marshalVariables }) {
+				// if there's no parent id, there's nothing to do
+				if (!ctx.stuff.parentID) {
+					return next(ctx)
+				}
+
+				// the object describing the current parent reference
+				const currentReference = {
+					parent: ctx.stuff.parentID,
+					variables: marshalVariables(ctx),
+				}
+
+				// if the variables have changed we need to setup a new subscription with the cache
+				if (
+					!ctx.cacheParams?.disableSubscriptions &&
+					(!deepEquals(lastReference, currentReference) || variablesChanged(ctx))
+				) {
+					// if the variables changed we need to unsubscribe from the old fields and
+					// listen to the new ones
+					if (subscriptionSpec) {
+						cache.unsubscribe(subscriptionSpec, subscriptionSpec.variables?.() || {})
+					}
+
+					// we need to subscribe with the marshaled variables
+					const variables = marshalVariables(ctx)
+
+					// save the new subscription spec
+					subscriptionSpec = {
+						rootType: ctx.artifact.rootType,
+						selection: ctx.artifact.selection,
+						variables: () => variables,
+						parentID: ctx.stuff.parentID,
+						set: (newValue) => {
+							resolve(ctx, {
+								data: newValue,
+								errors: null,
+								fetching: false,
+								partial: false,
+								stale: false,
+								source: DataSource.Cache,
+								variables,
+							})
+						},
+					}
+
+					// make sure we subscribe to the new values
+					cache.subscribe(subscriptionSpec, variables)
+
+					lastReference = currentReference
+				}
+
+				// we're done
+				next(ctx)
+			},
+
+			cleanup() {
+				if (subscriptionSpec) {
+					cache.unsubscribe(subscriptionSpec, subscriptionSpec.variables?.())
+				}
+			},
+		}
+	})

package/runtime/plugins/index.ts

@@ -0,0 +1,9 @@
+export * from './fetch'
+export * from './cache'
+export * from './query'
+export * from './fragment'
+export * from './mutation'
+export * from './subscription'
+export * from './throwOnError'
+export * from './fetchParams'
+export { optimisticKeys } from './optimisticKeys'

package/runtime/plugins/injectedPlugins.ts

@@ -0,0 +1,9 @@
+// the actual contents of this file will be overwritten by the runtime generator
+// to include imports from plugins so that they can register middlewares as
+// part of the generation pipeline
+import type { ClientPlugin } from 'houdini/runtime/documentStore'
+import type { NestedList } from 'houdini/runtime/types'
+
+const plugins: NestedList<ClientPlugin> = []
+
+export default plugins

package/runtime/plugins/mutation.ts

@@ -0,0 +1,98 @@
+import { marshalSelection } from 'houdini/runtime'
+import type { SubscriptionSpec } from 'houdini/runtime'
+import { ArtifactKind } from 'houdini/runtime'
+import type { Cache } from 'houdini/runtime/cache'
+
+import { documentPlugin } from './utils'
+
+export const mutation = (cache: Cache) =>
+	documentPlugin(ArtifactKind.Mutation, () => {
+		return {
+			async start(ctx, { next, marshalVariables }) {
+				// treat a mutation like it has an optimistic layer regardless of
+				// whether there actually _is_ one. This ensures that a query which fires
+				// after this mutation has been sent will overwrite any return values from the mutation
+				//
+				// as far as I can tell, this is an arbitrary decision but it does give a
+				// well-defined ordering to a subtle situation so that seems like a win
+				const layerOptimistic = cache._internal_unstable.storage.createLayer(true)
+
+				// if there is an optimistic response then we need to write the value immediately
+
+				// hold onto the list of subscribers that we updated because of the optimistic response
+				// and make sure they are included in the final set of subscribers to notify
+				let toNotify: SubscriptionSpec[] = []
+
+				// the optimistic response gets passed in the context's stuff bag
+				const optimisticResponse = ctx.stuff.optimisticResponse
+				if (optimisticResponse) {
+					toNotify = cache.write({
+						selection: ctx.artifact.selection,
+						// make sure that any scalar values get processed into something we can cache
+						data: (await marshalSelection({
+							selection: ctx.artifact.selection,
+							data: optimisticResponse,
+							config: ctx.config,
+						}))!,
+						variables: marshalVariables(ctx),
+						layer: layerOptimistic.id,
+					})
+				}
+
+				// update cacheParams
+				ctx.cacheParams = {
+					...ctx.cacheParams,
+					// write to the mutation's layer
+					layer: layerOptimistic,
+					// notify any subscribers that we updated with the optimistic response
+					// in order to address situations where the optimistic update was wrong
+					notifySubscribers: toNotify,
+					// make sure that we notify subscribers for any values that we compare
+					// in order to address any race conditions when comparing the previous value
+					forceNotify: true,
+				}
+
+				// make sure we write to the correct layer in the cache
+				next(ctx)
+			},
+			afterNetwork(ctx, { resolve }) {
+				// before the cache sees the data, we need to clear the layer
+				if (ctx.cacheParams?.layer) {
+					cache.clearLayer(ctx.cacheParams.layer.id)
+				}
+
+				// we're done
+				resolve(ctx)
+			},
+			end(ctx, { resolve, value }) {
+				const hasErrors = value.errors && value.errors.length > 0
+				// if there are errors, we need to clear the layer before resolving
+				if (hasErrors) {
+					// if the mutation failed, roll the layer back and delete it
+					if (ctx.cacheParams?.layer) {
+						cache.clearLayer(ctx.cacheParams.layer.id)
+					}
+				}
+
+				// merge the layer back into the cache
+				if (ctx.cacheParams?.layer) {
+					cache._internal_unstable.storage.resolveLayer(ctx.cacheParams.layer.id)
+				}
+
+				// keep going
+				resolve(ctx)
+			},
+			catch(ctx, { error }) {
+				// if there was an error, we need to clear the mutation
+				if (ctx.cacheParams?.layer) {
+					const { layer } = ctx.cacheParams
+
+					// if the mutation failed, roll the layer back and delete it
+					cache.clearLayer(layer.id)
+					cache._internal_unstable.storage.resolveLayer(layer.id)
+				}
+
+				throw error
+			},
+		}
+	})