@designerstrust/remix-utils/build/react/use-data-refresh.js

This package contains simple utility functions to use with [Remix.run](https://remix.run).

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.useDataRefresh = void 0;
const react_1 = require("@remix-run/react");
const react_2 = require("react");
/**
 * Trigger a refresh of the current routes loaders.
 *
 * This work by sending a `POST` request with a fetcher.submit to /dev/null in
 * order to force loaders to run again.
 *
 * You need to create `app/routes/dev/null.ts` and define an action that
 * returns null.
 *
 * It returns also a type and state strings with the process of the refresh.
 *
 * @example
 * let { refresh } = useDataRefresh();
 * return <button type="button" onClick={() => refresh}>Reload</button>;
 */
function useDataRefresh() {
    let { submit, type, state } = (0, react_1.useFetcher)();
    let refreshState = (0, react_2.useMemo)(function getRefreshState() {
        if (state === "submitting")
            return "loading";
        return state;
    }, [state]);
    let refreshType = (0, react_2.useMemo)(function getRefreshType() {
        if (type === "init")
            return "init";
        if (type === "actionRedirect")
            return "refreshRedirect";
        if (type === "done")
            return "init";
        return "refresh";
    }, [type]);
    let refresh = (0, react_2.useCallback)(() => {
        submit(null, { action: "/dev/null", method: "post" });
    }, [submit]);
    return (0, react_2.useMemo)(() => {
        return { refresh, type: refreshType, state: refreshState };
    }, [refresh, refreshState, refreshType]);
}
exports.useDataRefresh = useDataRefresh;