fix react-toastify mounting error

src/hooks/useError.js

@@ -0,0 +1,25 @@
+import { useEffect } from "react";
+import { toast } from "react-toastify";
+
+const useError = (message, deps) => {
+  useEffect(() => {
+    if (message) {
+      const toastId = toast.error(message.toString(), {
+        position: "top-right",
+        autoClose: false,
+        hideProgressBar: false,
+        closeOnClick: false,
+        pauseOnHover: true,
+        draggable: false,
+        progress: undefined,
+        theme: "dark",
+      });
+
+      return () => {
+        toast.dismiss(toastId);
+      };
+    }
+  }, deps);
+};
+
+export default useError;

src/hooks/useSuccess.js

@@ -0,0 +1,25 @@
+import { useEffect } from "react";
+import { toast } from "react-toastify";
+
+const useSuccess = (message, deps) => {
+  useEffect(() => {
+    if (message) {
+      const toastId = toast.success(message.toString(), {
+        position: "top-right",
+        autoClose: 3000,
+        hideProgressBar: false,
+        closeOnClick: false,
+        pauseOnHover: false,
+        draggable: false,
+        progress: undefined,
+        theme: "dark",
+      });
+
+      return () => {
+        toast.dismiss(toastId);
+      };
+    }
+  }, deps);
+};
+
+export default useSuccess;