@eleven-am/xquery/useAutoSave.js

XQuery is a sophisticated TypeScript wrapper for TanStack React Query, designed to enhance developer productivity with OpenAPI-generated clients. It enables developers to build and execute queries using fully type-safe factories instead of managing query

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.useAutoSaveAction = useAutoSaveAction;
const useAction_1 = require("./useAction");
const react_1 = require("react");
const useTimer_1 = require("./useTimer");
const usePrevious_1 = require("./usePrevious");
function deepCompare(firstObject, secondObject) {
    if (firstObject === secondObject) {
        return true;
    }
    if (firstObject instanceof Date && secondObject instanceof Date) {
        return firstObject.getTime() === secondObject.getTime();
    }
    if (Array.isArray(firstObject) && Array.isArray(secondObject)) {
        if (firstObject.length !== secondObject.length) {
            return false;
        }
        return firstObject.every((item, index) => deepCompare(item, secondObject[index]));
    }
    if (firstObject && secondObject && typeof firstObject === 'object' && typeof secondObject === 'object') {
        if (firstObject.constructor !== secondObject.constructor) {
            return false;
        }
        const properties = Object.keys(firstObject);
        if (properties.length !== Object.keys(secondObject).length) {
            return false;
        }
        return properties.every((prop) => deepCompare(firstObject[prop], secondObject[prop]));
    }
    return false;
}
function useAutoSaveAction({ delay, options }) {
    const { start, stop } = (0, useTimer_1.useTimer)();
    const { mutate, data: mutateData } = (0, useAction_1.useAction)(options);
    const [data, setData] = (0, react_1.useState)(options.queryOptions.initialData);
    const previousInitialData = (0, usePrevious_1.usePrevious)(options.queryOptions.initialData);
    (0, react_1.useEffect)(() => {
        if (deepCompare(previousInitialData, options.queryOptions.initialData)) {
            setData(options.queryOptions.initialData);
        }
    }, [options.queryOptions.initialData, previousInitialData]);
    (0, react_1.useEffect)(() => {
        if (mutateData) {
            setData(mutateData);
        }
    }, [mutateData]);
    const mutateWithDebounce = (0, react_1.useCallback)((newState) => {
        stop();
        let newData;
        setData((prevState) => {
            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
            // @ts-expect-error
            newData = typeof newState === 'function' ? newState(prevState) : newState;
            return newData;
        });
        start(() => mutate(newData), delay);
    }, [delay, mutate, start, stop]);
    return [data, mutateWithDebounce];
}
//# sourceMappingURL=useAutoSave.js.map