From 0f8d91d997e08b81f6b923d0b61ba589eb51214e Mon Sep 17 00:00:00 2001 From: Athou Date: Fri, 16 Jan 2026 15:53:04 +0100 Subject: [PATCH] close profile menu on scroll (#2019) --- .../src/components/header/ProfileMenu.tsx | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) diff --git a/commafeed-client/src/components/header/ProfileMenu.tsx b/commafeed-client/src/components/header/ProfileMenu.tsx index f49fb829..2d17f0c7 100644 --- a/commafeed-client/src/components/header/ProfileMenu.tsx +++ b/commafeed-client/src/components/header/ProfileMenu.tsx @@ -12,7 +12,7 @@ import { } from "@mantine/core" import { showNotification } from "@mantine/notifications" import dayjs from "dayjs" -import { type ReactNode, useState } from "react" +import { type ReactNode, useEffect, useState } from "react" import { TbChartLine, TbHeartFilled, @@ -29,6 +29,7 @@ import { TbUsers, TbWorldDownload, } from "react-icons/tb" +import { throttle } from "throttle-debounce" import { client } from "@/app/client" import { redirectToAbout, redirectToAdminUsers, redirectToDonate, redirectToMetrics, redirectToSettings } from "@/app/redirect/thunks" import { useAppDispatch, useAppSelector } from "@/app/store" @@ -96,6 +97,14 @@ const viewModeData: ViewModeControlItem[] = [ export function ProfileMenu(props: Readonly) { const [opened, setOpened] = useState(false) + + // close profile menu on scroll + useEffect(() => { + const listener = throttle(100, () => setOpened(false)) + window.addEventListener("scroll", listener) + return () => window.removeEventListener("scroll", listener) + }, []) + const now = useNow() const profile = useAppSelector(state => state.user.profile) const admin = useAppSelector(state => state.user.profile?.admin)