added useModal hook

src/hooks/useModal.tsx

@@ -0,0 +1,50 @@
+import { useRef, useState, useCallback, useMemo } from 'react';
+
+interface State {
+  isShow: boolean;
+}
+
+export const useModal = () => {
+  const [state, setState] = useState<State>({ isShow: false });
+  const [data, setData] = useState<any>(null);
+  const promiseConfig = useRef<any>(null);
+
+  const show = useCallback((data: any) => {
+    setData(data);
+    return new Promise((resolve, reject) => {
+      promiseConfig.current = { resolve, reject };
+      setState({ isShow: true });
+    });
+  }, []);
+
+  const hide = useCallback(() => {
+    setState({ isShow: false });
+    setData(null);
+  }, []);
+
+  const onOk = useCallback(
+    (payload: any) => {
+      const { resolve } = promiseConfig.current || {};
+      hide();
+      resolve?.(payload);
+    },
+    [hide]
+  );
+
+  const onCancel = useCallback(() => {
+    const { reject } = promiseConfig.current || {};
+    hide();
+    reject?.();
+  }, [hide]);
+
+  return useMemo(
+    () => ({
+      show,
+      onOk,
+      onCancel,
+      isShow: state.isShow,
+      data,
+    }),
+    [show, onOk, onCancel, state.isShow, data]
+  );
+};

src/index.ts

@@ -2,6 +2,7 @@
 
 export { useResourceStatus } from './hooks/useResourceStatus';
 export { Spacer } from './common/Spacer';
+export { useModal } from './hooks/useModal';
 import './index.css'
 export { createQortalLink } from './utils/qortal';
 export { IndexCategory } from './state/indexes';