fix: hanging notifications

src/components/Notifications/Notifications.css

@@ -1,7 +1,7 @@
 .notifications {
   position: fixed;
   right: var(--space-5);
-  bottom: var(--space-5);
+  top: var(--space-5);
   z-index: 9999;
 
   display: flex;

src/hooks/useNotifications.tsx

@@ -4,20 +4,17 @@ import { NotificationType, Notification } from '../types';
 export function useNotifications() {
   const [notifications, setNotifications] = useState<Notification[]>([]);
   const hovered = useRef<Set<number>>(new Set());
+  const nextId = useRef(0); // monotonically increasing counter
 
   const notify = useCallback(
     (message: string, type: NotificationType = 'error', dspName?: string) => {
-      const id = Date.now();
+      const id = nextId.current++;
 
       const fullMessage = dspName ? `${dspName}: ${message}` : message;
 
       setNotifications((prev) => [
         ...prev,
-        {
+        { id, message: fullMessage, type },
-          id,
-          message: fullMessage,
-          type,
-        },
       ]);
 
       const removeLater = () => {
@@ -25,7 +22,6 @@ export function useNotifications() {
           setTimeout(removeLater, 1000);
           return;
         }
-
         setNotifications((prev) => prev.filter((n) => n.id !== id));
       };
 
@@ -35,6 +31,7 @@ export function useNotifications() {
   );
 
   const removeNotification = useCallback((id: number) => {
+    hovered.current.delete(id); // prevent leaking stale hover state
     setNotifications((prev) => prev.map((n) => (n.id === id ? { ...n, removing: true } : n)));
 
     setTimeout(() => {
@@ -56,4 +53,4 @@ export function useNotifications() {
     removeNotification,
     hoverNotification,
   };
-}
+}