From f7b99688801aaf43e2d067404d32c998f9498548 Mon Sep 17 00:00:00 2001
From: mirnawong1 <89008547+mirnawong1@users.noreply.github.com>
Date: Mon, 22 Jan 2024 16:24:41 +0000
Subject: [PATCH 1/3] Update index.js

update timeout so the the image hovers more consistently
---
 website/src/components/lightbox/index.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/website/src/components/lightbox/index.js b/website/src/components/lightbox/index.js
index a846c51b150..875ed6ff063 100644
--- a/website/src/components/lightbox/index.js
+++ b/website/src/components/lightbox/index.js
@@ -12,7 +12,7 @@ function Lightbox({ src, collapsed = false, alignment = "center", alt = undefine
     if (isHovered && !isScrolling) {
       timeoutId = setTimeout(() => {
         setExpandImage(true);
-      }, 300);
+      }, 200);
     }
     return () => clearTimeout(timeoutId);
   }, [isHovered, isScrolling]);

From fe519e8685505f12580e00394bfe98b0fd312164 Mon Sep 17 00:00:00 2001
From: mirnawong1 <mirna.wong@fishtownanalytics.com>
Date: Tue, 30 Jan 2024 20:20:45 +0000
Subject: [PATCH 2/3] remove hover

---
 website/src/components/detailsToggle/index.js | 41 +------------------
 website/src/components/faqs/index.js          | 15 +------
 2 files changed, 2 insertions(+), 54 deletions(-)

diff --git a/website/src/components/detailsToggle/index.js b/website/src/components/detailsToggle/index.js
index 514ca52ba13..9f69d60aba6 100644
--- a/website/src/components/detailsToggle/index.js
+++ b/website/src/components/detailsToggle/index.js
@@ -3,47 +3,12 @@ import styles from './styles.module.css';
 
 function detailsToggle({ children, alt_header = null }) {
   const [isOn, setOn] = useState(false);
-  const [isScrolling, setIsScrolling] = useState(false); // New state to track scrolling
   const [hoverTimeout, setHoverTimeout] = useState(null);
 
   const handleToggleClick = () => {
-    setOn(current => !current); // Toggle the current state
+    setOn(current => !current);
   };
 
-  const handleMouseEnter = () => {
-    if (isOn || isScrolling) return; // Ignore hover if already open or if scrolling
-    const timeout = setTimeout(() => {
-      if (!isScrolling) setOn(true);
-    }, 700); // 
-    setHoverTimeout(timeout);
-  };
-  
-  const handleMouseLeave = () => {
-    if (!isOn) {
-      clearTimeout(hoverTimeout);
-      setOn(false);
-    }
-  };
-
-  const handleScroll = () => {
-    setIsScrolling(true);
-    clearTimeout(hoverTimeout);
-    //setOn(false);
-
-
-    // Reset scrolling state after a  delay
-    setTimeout(() => {
-      setIsScrolling(false);
-    }, 800);
-  };
-
-  useEffect(() => {
-    window.addEventListener('scroll', handleScroll);
-    return () => {
-      window.removeEventListener('scroll', handleScroll);
-    };
-  }, []);
-
   useEffect(() => {
     return () => clearTimeout(hoverTimeout);
   }, [hoverTimeout]);
@@ -53,13 +18,9 @@ function detailsToggle({ children, alt_header = null }) {
       <span 
         className={styles.link} 
         onClick={handleToggleClick}
-        onMouseEnter={handleMouseEnter} 
-        onMouseLeave={handleMouseLeave}
       >
         <span className={`${styles.toggle} ${isOn ? null : styles.toggleUpsideDown}`}></span>&nbsp;
         <span className={styles.headerText}>{alt_header}</span>
-        {/* Visual disclaimer */}
-        <small className={styles.disclaimer}>Hover to view</small>
       </span>
       <div 
         style={{ display: isOn ? 'block' : 'none' }} 
diff --git a/website/src/components/faqs/index.js b/website/src/components/faqs/index.js
index 0741a29cd89..ccacaf66071 100644
--- a/website/src/components/faqs/index.js
+++ b/website/src/components/faqs/index.js
@@ -37,18 +37,6 @@ function FAQ({ path, alt_header = null }) {
     }
   }, [filePath])
 
-  const handleMouseEnter = () => {
-    setHoverTimeout(setTimeout(() => {
-      setOn(true);
-    }, 500));
-  };
-
-  const handleMouseLeave = () => {
-  if (!isOn) {
-      clearTimeout(hoverTimeout);
-      setOn(false);
-  }
-};
 
   useEffect(() => {
     return () => {
@@ -66,11 +54,10 @@ function FAQ({ path, alt_header = null }) {
   };
 
   return (
-    <div className={styles.faqs} onMouseEnter={handleMouseEnter} onMouseLeave={handleMouseLeave}>
+    <div className={styles.faqs}>
       <span className={styles.link} onClick={toggleOn}>
         <span className={styles.toggle} style={{ transform: isOn ? 'rotateX(0deg)' : 'rotateX(180deg)' }}></span>
         <span className={styles.headerText}>{alt_header || (fileContent?.meta && fileContent.meta.title)}</span>
-        <small className={styles.disclaimer}>Hover to view</small>
       </span>
       <div style={{ display: isOn ? 'block' : 'none' }} className={styles.body}>
         {fileContent?.contents}

From 8ec48edc5840b36422bc098a6fa96d2a9dc856eb Mon Sep 17 00:00:00 2001
From: mirnawong1 <mirna.wong@fishtownanalytics.com>
Date: Tue, 30 Jan 2024 20:28:37 +0000
Subject: [PATCH 3/3] remove const

---
 website/src/components/detailsToggle/index.js |  6 +-----
 website/src/components/faqs/index.js          | 17 ++---------------
 2 files changed, 3 insertions(+), 20 deletions(-)

diff --git a/website/src/components/detailsToggle/index.js b/website/src/components/detailsToggle/index.js
index 9f69d60aba6..d337ece096c 100644
--- a/website/src/components/detailsToggle/index.js
+++ b/website/src/components/detailsToggle/index.js
@@ -1,17 +1,13 @@
-import React, { useState, useEffect } from 'react';
+import React, { useState } from 'react';
 import styles from './styles.module.css';
 
 function detailsToggle({ children, alt_header = null }) {
   const [isOn, setOn] = useState(false);
-  const [hoverTimeout, setHoverTimeout] = useState(null);
 
   const handleToggleClick = () => {
     setOn(current => !current);
   };
 
-  useEffect(() => {
-    return () => clearTimeout(hoverTimeout);
-  }, [hoverTimeout]);
 
   return (
     <div className='detailsToggle'>
diff --git a/website/src/components/faqs/index.js b/website/src/components/faqs/index.js
index ccacaf66071..377bc089555 100644
--- a/website/src/components/faqs/index.js
+++ b/website/src/components/faqs/index.js
@@ -6,7 +6,6 @@ function FAQ({ path, alt_header = null }) {
   const [isOn, setOn] = useState(false);
   const [filePath, setFilePath] = useState(path);
   const [fileContent, setFileContent] = useState({});
-  const [hoverTimeout, setHoverTimeout] = useState(null);
 
   // Get all faq file paths from plugin
   const { faqFiles } = usePluginData('docusaurus-build-global-data-plugin');
@@ -37,21 +36,9 @@ function FAQ({ path, alt_header = null }) {
     }
   }, [filePath])
 
-
-  useEffect(() => {
-    return () => {
-      if (hoverTimeout) {
-        clearTimeout(hoverTimeout);
-      }
-    };
-  }, [hoverTimeout]);
-
-  const toggleOn = () => {
-    if (hoverTimeout) {
-      clearTimeout(hoverTimeout);
-    }
+  const toggleOn = function () {
     setOn(!isOn);
-  };
+  }
 
   return (
     <div className={styles.faqs}>