@rocketmakers/api-swr/dist/esm/hooks/useQuery.js

Rocketmakers front-end library for parsing a generated Typescript API client into a set of configurable React hooks for fetching and mutating data.

'use client';
/*
 * React hook for querying data on the client
 * --------------------------------------
 * Wraps the SWR hook, see here: https://swr.vercel.app
 */
import * as React from 'react';
import useSwr from 'swr';
import { readCacheKey } from '../utils/caching';
import { useClientFetch } from './useClientFetch';
import { useContentMemo } from './useContentMemo';
/**
 * A wrapper around the `useSwr` hook that includes a custom `fetch` function, `cacheKey` generator and SWR config.
 * @template TFunc - A function that returns a Promise with some data from the API.
 * @template TConfig - A configuration object to be passed to the fetch function.
 * @param {string} endpointId - The `controller.endpoint` ID
 * @param {TFunc} fetcher - The function to use for fetching data.
 * @param {IUseQueryConfig<TFunc, TConfig>} hookConfig - An object containing the `cacheKey`, `params`, `config` and `swrConfig` options.
 * @param {APIProcessingHook} useProcessing - An optional API processing hook to render.
 * @param {GlobalFetchWrapperHook<TConfig>} useGlobalFetchWrapper - An optional fetch wrapper hook to render.
 * @param {SWRConfiguration<unknown | undefined>} globalSwrConfig - Global level SWR config.
 * @returns {SWRResponse<unknown>} - The response from the `useSwr` hook.
 */
export const useQuery = (endpointId, fetcher, hookConfig, useProcessing, useGlobalFetchWrapper, globalSwrConfig) => {
    /** Used to fetch data on the client, calls the root fetcher with the params and config passed into the hook */
    const { clientFetch, error, processingResponse } = useClientFetch(endpointId, 'query', hookConfig === null || hookConfig === void 0 ? void 0 : hookConfig.fetchConfig, fetcher, hookConfig === null || hookConfig === void 0 ? void 0 : hookConfig.params, useProcessing, useGlobalFetchWrapper, hookConfig === null || hookConfig === void 0 ? void 0 : hookConfig.fetchWrapper);
    /** Content memo on the swr config to avoid dependency changes in SWR */
    const swrConfig = useContentMemo(hookConfig === null || hookConfig === void 0 ? void 0 : hookConfig.swrConfig);
    /** Content memo on the global swr config to avoid dependency changes in SWR */
    const globalSwrConfigMemo = useContentMemo(globalSwrConfig);
    /** Reads the cacheKey value from the cacheKey definition sent to the hook */
    const cacheKeyValue = React.useMemo(() => {
        if ((hookConfig === null || hookConfig === void 0 ? void 0 : hookConfig.waitFor) === false) {
            return undefined;
        }
        return readCacheKey(endpointId, hookConfig === null || hookConfig === void 0 ? void 0 : hookConfig.cacheKey, hookConfig === null || hookConfig === void 0 ? void 0 : hookConfig.params);
    }, [hookConfig === null || hookConfig === void 0 ? void 0 : hookConfig.cacheKey, hookConfig === null || hookConfig === void 0 ? void 0 : hookConfig.params, hookConfig === null || hookConfig === void 0 ? void 0 : hookConfig.waitFor, endpointId]);
    /** Protect the root fetcher from causing dependency changes in SWR */
    const rootFetch = React.useCallback(() => clientFetch(), [clientFetch]);
    /** Protect the combined SWR config from causing dependency changes in SWR */
    const combinedSwrConfig = React.useMemo(() => (Object.assign(Object.assign({}, globalSwrConfigMemo), swrConfig)), [globalSwrConfigMemo, swrConfig]);
    /** Returns the native useSwr hook from the SWR library, see here: https://swr.vercel.app */
    return Object.assign(Object.assign({}, useSwr(cacheKeyValue, rootFetch, combinedSwrConfig)), { error, processingResponse });
};