From a38c1d85878c0534f80a5ceae2a6c2e8cd44c0e6 Mon Sep 17 00:00:00 2001
From: Luke Vella <me@lukevella.com>
Date: Sat, 31 May 2025 15:30:47 +0100
Subject: [PATCH] =?UTF-8?q?=E2=9A=A1=EF=B8=8F=20Reduce=20state=20updates?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../app/[locale]/(main)/open-source-banner.tsx | 18 ++++++++++++++----
 1 file changed, 14 insertions(+), 4 deletions(-)

diff --git a/apps/landing/src/app/[locale]/(main)/open-source-banner.tsx b/apps/landing/src/app/[locale]/(main)/open-source-banner.tsx
index 05485ded5..95ebb41b4 100644
--- a/apps/landing/src/app/[locale]/(main)/open-source-banner.tsx
+++ b/apps/landing/src/app/[locale]/(main)/open-source-banner.tsx
@@ -5,18 +5,28 @@ import { ArrowUpRightIcon } from "lucide-react";
 import GithubIcon from "@/assets/github.svg";
 import { Trans } from "@/i18n/client/trans";
 import { cn } from "@rallly/ui";
-import { useWindowScroll } from "react-use";
+import React from "react";
 
 export function OpenSourceBanner() {
-  const { y } = useWindowScroll();
+  const [visible, setVisible] = React.useState(true);
+
+  React.useEffect(() => {
+    function setVisibility() {
+      setVisible(window.scrollY < 20);
+    }
+    window.addEventListener("scroll", setVisibility);
+    return () => {
+      window.removeEventListener("scroll", setVisibility);
+    };
+  }, []);
 
   return (
     <div
       className={cn(
         "bg-gray-800 z-50 transition-transform h-11 overflow-hidden hover:underline fixed top-0 w-full flex items-center text-sm rounded-none text-gray-100 justify-center gap-4",
         {
-          "translate-y-0": y <= 0,
-          "-translate-y-full": y > 20,
+          "translate-y-0": visible,
+          "-translate-y-full": !visible,
         },
       )}
     >