[Glitch] Change hover cards to not appear until the mouse stops in web UI

Port b728c0e8ce to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>

app/javascript/flavours/glitch/hooks/useTimeout.ts

@@ -2,19 +2,34 @@ import { useRef, useCallback, useEffect } from 'react';
 
 export const useTimeout = () => {
   const timeoutRef = useRef<ReturnType<typeof setTimeout>>();
+  const callbackRef = useRef<() => void>();
 
   const set = useCallback((callback: () => void, delay: number) => {
     if (timeoutRef.current) {
       clearTimeout(timeoutRef.current);
     }
 
+    callbackRef.current = callback;
     timeoutRef.current = setTimeout(callback, delay);
   }, []);
 
+  const delay = useCallback((delay: number) => {
+    if (timeoutRef.current) {
+      clearTimeout(timeoutRef.current);
+    }
+
+    if (!callbackRef.current) {
+      return;
+    }
+
+    timeoutRef.current = setTimeout(callbackRef.current, delay);
+  }, []);
+
   const cancel = useCallback(() => {
     if (timeoutRef.current) {
       clearTimeout(timeoutRef.current);
       timeoutRef.current = undefined;
+      callbackRef.current = undefined;
     }
   }, []);
 
@@ -25,5 +40,5 @@ export const useTimeout = () => {
     [cancel],
   );
 
-  return [set, cancel] as const;
+  return [set, cancel, delay] as const;
 };