auto-claude: subtask-1-2 - Create usePageVisibility hook for tab visibility detection

src/hooks/usePageVisibility.ts

@@ -0,0 +1,23 @@
+import { useState, useEffect } from 'react';
+
+/**
+ * Hook to detect tab visibility using the Page Visibility API
+ * @returns boolean - true when page is visible, false when hidden
+ */
+export const usePageVisibility = (): boolean => {
+  const [isVisible, setIsVisible] = useState<boolean>(!document.hidden);
+
+  useEffect(() => {
+    const handleVisibilityChange = () => {
+      setIsVisible(!document.hidden);
+    };
+
+    document.addEventListener('visibilitychange', handleVisibilityChange);
+
+    return () => {
+      document.removeEventListener('visibilitychange', handleVisibilityChange);
+    };
+  }, []);
+
+  return isVisible;
+};