From 366251e143869ef1a8127d9ac602e4ae721fdab5 Mon Sep 17 00:00:00 2001
From: Cooper Ransom <cooperransom08@outlook.com>
Date: Fri, 5 Apr 2024 20:36:13 -0400
Subject: [PATCH] Handle mouse scrolling better

---
 src/pages/Discover.tsx | 11 ++++-------
 1 file changed, 4 insertions(+), 7 deletions(-)

diff --git a/src/pages/Discover.tsx b/src/pages/Discover.tsx
index 24653446..1921538e 100644
--- a/src/pages/Discover.tsx
+++ b/src/pages/Discover.tsx
@@ -211,7 +211,6 @@ export function Discover() {
   }, [movieWidth]);
 
   let isScrolling = false;
-
   function handleWheel(e: React.WheelEvent, categorySlug: string) {
     if (isScrolling) {
       return;
@@ -262,12 +261,7 @@ export function Discover() {
             ? `${category} Shows`
             : `${category} Movies`;
     return (
-      <div
-        className="relative overflow-hidden mt-4 rounded-xl"
-        onMouseEnter={handleMouseEnter}
-        onMouseLeave={handleMouseLeave}
-        onWheel={(e) => handleWheel(e, categorySlug)}
-      >
+      <div className="relative overflow-hidden mt-4 rounded-xl">
         <h2 className="text-2xl font-bold text-white sm:text-3xl md:text-2xl mx-auto pl-2">
           {displayCategory}
         </h2>
@@ -281,6 +275,9 @@ export function Discover() {
           ref={(el) => {
             carouselRefs.current[categorySlug] = el;
           }}
+          onMouseEnter={handleMouseEnter}
+          onMouseLeave={handleMouseLeave}
+          onWheel={(e) => handleWheel(e, categorySlug)}
         >
           {medias.slice(0, 20).map((media) => (
             <a