phx-react
Version:
PHX REACT
46 lines • 1.72 kB
JavaScript
;
// components/LoadingProvider.tsx
'use client';
Object.defineProperty(exports, "__esModule", { value: true });
exports.useLoading = void 0;
exports.PHXLoadingProvider = PHXLoadingProvider;
const tslib_1 = require("tslib");
const react_1 = tslib_1.__importDefault(require("react"));
const react_2 = require("react");
const navigation_1 = require("next/navigation");
const LoadingContext = (0, react_2.createContext)({
loading: false,
// eslint-disable-next-line @typescript-eslint/no-empty-function
setLoading: (_v) => { },
progress: 0,
});
const useLoading = () => (0, react_2.useContext)(LoadingContext);
exports.useLoading = useLoading;
function PHXLoadingProvider({ children }) {
const [loading, setLoading] = (0, react_2.useState)(false);
const pathname = (0, navigation_1.usePathname)();
const [progress, setProgress] = (0, react_2.useState)(0);
(0, react_2.useEffect)(() => {
setLoading(false);
setProgress(100);
}, [pathname]);
(0, react_2.useEffect)(() => {
if (loading) {
const timerId = setInterval(() => {
if (progress <= 90) {
const nextProgress = progress + 5;
setProgress(nextProgress);
}
}, 100);
return () => clearInterval(timerId);
}
else {
const timerId = setTimeout(() => {
setProgress(0);
}, 400);
return () => clearTimeout(timerId);
}
}, [loading, progress]);
return react_1.default.createElement(LoadingContext.Provider, { value: { loading, setLoading, progress } }, children);
}
//# sourceMappingURL=loading-provider.js.map