minh-custom-hooks-release
Version:
My custom hooks for working easier while developing react web app
124 lines • 6.89 kB
JavaScript
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
if (ar || !(i in from)) {
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
ar[i] = from[i];
}
}
return to.concat(ar || Array.prototype.slice.call(from));
};
/* eslint-disable @typescript-eslint/no-explicit-any */
import { useCallback, useEffect, useRef, useState } from 'react';
import { defer, Subject } from 'rxjs';
import { fromPromise } from 'rxjs/internal/observable/innerFrom';
import { DEFAULT_DATA_VALUE, DEFAULT_ERROR_VALUE, DEFAULT_SOURCE$_VALUE, DEFAULT_SUBSCRIPTION_VALUE, } from './useTaskObservable';
export default function useTaskEffectObservable(_a) {
var task = _a.task, observablePreHandler = _a.observablePreHandler, onNext = _a.onNext, onComplete = _a.onComplete, onError = _a.onError, onCancel = _a.onCancel, deps = _a.deps, _b = _a.enabled, enabled = _b === void 0 ? true : _b, loadingAtInit = _a.loadingAtInit;
var _c = useState(null), currentSource$ = _c[0], setCurrentSource$ = _c[1];
var currentSubscription = useRef(null);
var _d = useState(), data = _d[0], setData = _d[1];
var _e = useState(), err = _e[0], setErr = _e[1];
var _f = useState(enabled && loadingAtInit ? "LOADING" /* EnumSubscriptionState.LOADING */ : "IDLE" /* EnumSubscriptionState.IDLE */), taskState = _f[0], setTaskState = _f[1];
var _g = useState(enabled && loadingAtInit ? "LOADING" /* EnumSubscriptionState.LOADING */ : "IDLE" /* EnumSubscriptionState.IDLE */), subscriptionState = _g[0], setSubscriptionState = _g[1];
var run = function () {
var _a;
currentSource$ === null || currentSource$ === void 0 ? void 0 : currentSource$.unsubscribe();
(_a = currentSubscription.current) === null || _a === void 0 ? void 0 : _a.unsubscribe();
var sub$ = new Subject();
if (typeof task === 'function') {
var source$ = defer(function () {
var generateObservable$ = task();
return generateObservable$ instanceof Promise ? fromPromise(generateObservable$) : generateObservable$;
});
if (typeof observablePreHandler === 'function') {
source$ = observablePreHandler(source$);
}
setTaskState("LOADING" /* EnumSubscriptionState.LOADING */);
setSubscriptionState("LOADING" /* EnumSubscriptionState.LOADING */);
currentSubscription.current = source$.subscribe(sub$);
sub$.subscribe({
next: function (v) {
setData(v);
setSubscriptionState("DATARECEIVED" /* EnumSubscriptionState.DATARECEIVED */);
onNext === null || onNext === void 0 ? void 0 : onNext(v);
},
error: function (err) {
setErr(err);
setTaskState("FAILED" /* EnumSubscriptionState.FAILED */);
setSubscriptionState("FAILED" /* EnumSubscriptionState.FAILED */);
onError === null || onError === void 0 ? void 0 : onError(err);
},
complete: function () {
setTaskState("SUCCESS" /* EnumSubscriptionState.SUCCESS */);
setSubscriptionState("SUCCESS" /* EnumSubscriptionState.SUCCESS */);
onComplete === null || onComplete === void 0 ? void 0 : onComplete();
},
});
setCurrentSource$(sub$);
}
else {
throw new Error('Task must be a function observable or promise');
}
};
var cancel = useCallback(function () {
var _a;
(_a = currentSubscription.current) === null || _a === void 0 ? void 0 : _a.unsubscribe();
currentSource$ === null || currentSource$ === void 0 ? void 0 : currentSource$.unsubscribe();
setTaskState("CANCELED" /* EnumSubscriptionState.CANCELED */);
setSubscriptionState("CANCELED" /* EnumSubscriptionState.CANCELED */);
onCancel === null || onCancel === void 0 ? void 0 : onCancel(data);
}, [data, onCancel]);
var createObservable = useCallback(function () {
return currentSource$ === null || currentSource$ === void 0 ? void 0 : currentSource$.asObservable();
}, [currentSource$]);
var complete = useCallback(function () {
currentSource$ === null || currentSource$ === void 0 ? void 0 : currentSource$.complete();
}, [currentSource$]);
var reset = useCallback(function () {
var _a;
setData(DEFAULT_DATA_VALUE);
setErr(DEFAULT_ERROR_VALUE);
setSubscriptionState("IDLE" /* EnumSubscriptionState.IDLE */);
setTaskState("IDLE" /* EnumSubscriptionState.IDLE */);
currentSource$ === null || currentSource$ === void 0 ? void 0 : currentSource$.unsubscribe();
setCurrentSource$(DEFAULT_SOURCE$_VALUE);
(_a = currentSubscription.current) === null || _a === void 0 ? void 0 : _a.unsubscribe();
currentSubscription.current = DEFAULT_SUBSCRIPTION_VALUE;
}, []);
useEffect(function () {
if (enabled) {
run();
}
return function () {
reset();
};
}, __spreadArray(__spreadArray([], (deps !== null && deps !== void 0 ? deps : []), true), [enabled], false));
return {
// data state
data: data,
err: err,
// current state
state: taskState,
subscriptionState: subscriptionState,
// task state
isIdle: taskState === "IDLE" /* EnumSubscriptionState.IDLE */,
isLoading: taskState === "LOADING" /* EnumSubscriptionState.LOADING */,
isSuccess: taskState === "SUCCESS" /* EnumSubscriptionState.SUCCESS */,
isFailed: taskState === "FAILED" /* EnumSubscriptionState.FAILED */,
isCanceled: taskState === "CANCELED" /* EnumSubscriptionState.CANCELED */,
// subscription state
isSubscriptionIdle: subscriptionState === "IDLE" /* EnumSubscriptionState.IDLE */,
isSubscriptionLoading: subscriptionState === "LOADING" /* EnumSubscriptionState.LOADING */,
isSubscriptionDataReceived: subscriptionState === "DATARECEIVED" /* EnumSubscriptionState.DATARECEIVED */,
isSubscriptionSuccess: subscriptionState === "SUCCESS" /* EnumSubscriptionState.SUCCESS */,
isSubscriptionFailed: subscriptionState === "FAILED" /* EnumSubscriptionState.FAILED */,
isSubscriptionCanceled: subscriptionState === "CANCELED" /* EnumSubscriptionState.CANCELED */,
// action
refetch: run,
complete: complete,
cancel: cancel,
subscription: currentSubscription.current,
createObservable: createObservable,
};
}
//# sourceMappingURL=useTaskEffectObservable.js.map