useConfirm
Tue Jul 19 2022 11:20:54 GMT+0000 (Coordinated Universal Time)
Saved by
@avivdaniel
#javascript
#react.js
import { useEffect, useState } from 'react';
interface ConfirmState {
isOpen: boolean;
proceed: any;
cancel: any;
}
interface UseConfirmReturnType extends ConfirmState {
isConfirm: () => Promise<boolean>;
}
export const useConfirm = (): UseConfirmReturnType => {
const [confirm, setConfirm] = useState<ConfirmState>({} as ConfirmState);
const [needsCleanup, setNeedsCleanup] = useState(false);
const isConfirm = () => {
setNeedsCleanup(true);
const promise = new Promise((resolve, reject) => {
setConfirm({
isOpen: true,
proceed: resolve,
cancel: reject,
});
});
return promise.then(
() => {
setConfirm({ ...confirm, isOpen: false });
return true;
},
() => {
setConfirm({ ...confirm, isOpen: false });
return false;
}
);
};
useEffect(() => {
return () => {
if (confirm.cancel && needsCleanup) {
confirm.cancel();
}
};
}, [confirm, needsCleanup]);
return {
...confirm,
isConfirm,
};
};
content_copyCOPY
Comments