fix: prevent Toast auto-dismiss timer from resetting on every parent re-render

src/components/ui/Toast.jsx

@@ -1,12 +1,25 @@
-import React, { useEffect } from "react";
+import React, { useEffect, useRef } from "react";
 import { motion } from "framer-motion";
 
 export const Toast = ({ message, type = "success", onClose }) => {
+  // Keep the latest onClose in a ref so the auto-dismiss timer always calls
+  // the most recent callback without onClose needing to be a reactive
+  // dependency. This prevents the 3-second timer from resetting every time
+  // the parent re-renders and passes a new inline onClose function.
+  const onCloseRef = useRef(onClose);
+
   useEffect(() => {
-    const timer = setTimeout(onClose, 3000);
-    return () => clearTimeout(timer);
+    onCloseRef.current = onClose;
   }, [onClose]);
 
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      onCloseRef.current();
+    }, 3000);
+    return () => clearTimeout(timer);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+
   return (
     <motion.div
       initial={{ opacity: 0, y: 10 }}
@@ -27,4 +40,4 @@ export const Toast = ({ message, type = "success", onClose }) => {
   );
 };
 
-export default Toast;
+export default Toast;