@shopify/react-graphql/build/ts/async/component.js

Tools for creating type-safe and asynchronous GraphQL components for React

import { useIdleCallback } from '@shopify/react-idle';
import { useQuery } from '../hooks';
import { createAsyncQuery } from './query';
export function createAsyncQueryComponent(options) {
    const asyncQuery = createAsyncQuery(options);
    const { resolver, usePreload, usePrefetch, useKeepFresh } = asyncQuery;
    function AsyncQuery(options) {
        const result = useQuery(asyncQuery, options);
        return options.children(result);
    }
    function Preload() {
        useIdleCallback(usePreload());
        return null;
    }
    function Prefetch(options) {
        useIdleCallback(usePrefetch(options));
        return null;
    }
    function KeepFresh(options) {
        useIdleCallback(useKeepFresh(options));
        return null;
    }
    // Once we upgrade past TS 3.1, this will no longer be necessary,
    // because you can statically assign values to functions and TS
    // will know to augment its type
    const FinalComponent = AsyncQuery;
    Reflect.defineProperty(FinalComponent, 'resolver', {
        value: resolver,
        writable: false,
    });
    Reflect.defineProperty(FinalComponent, 'Preload', {
        value: Preload,
        writable: false,
    });
    Reflect.defineProperty(FinalComponent, 'Prefetch', {
        value: Prefetch,
        writable: false,
    });
    Reflect.defineProperty(FinalComponent, 'KeepFresh', {
        value: KeepFresh,
        writable: false,
    });
    Reflect.defineProperty(FinalComponent, 'usePreload', {
        value: usePreload,
        writable: false,
    });
    Reflect.defineProperty(FinalComponent, 'usePrefetch', {
        value: usePrefetch,
        writable: false,
    });
    Reflect.defineProperty(FinalComponent, 'useKeepFresh', {
        value: useKeepFresh,
        writable: false,
    });
    return FinalComponent;
}