From 2f9b6edf8c9d35566662fbb31d65394943479883 Mon Sep 17 00:00:00 2001 From: Alois Date: Wed, 3 Jun 2026 08:51:31 +0200 Subject: [PATCH 1/3] (fix): react rerendered the mobile drawer multiple times causing the drawer to pop out multiple times --- .../src/components/messageContextMenu.tsx | 52 ++++++++++++++++--- 1 file changed, 45 insertions(+), 7 deletions(-) diff --git a/packages/chat/src/components/messageContextMenu.tsx b/packages/chat/src/components/messageContextMenu.tsx index dcbc707..fb7d6ff 100644 --- a/packages/chat/src/components/messageContextMenu.tsx +++ b/packages/chat/src/components/messageContextMenu.tsx @@ -11,6 +11,8 @@ import { ContextMenuTrigger, Drawer, DrawerContent, + DrawerDescription, + DrawerTitle, DrawerTrigger, useIsMobile, } from "@tensamin/ui"; @@ -41,6 +43,12 @@ type MenuComponents = { SubContent: (props: { children: ReactNode }) => ReactElement; }; +function blurActiveElement() { + if (document.activeElement instanceof HTMLElement) { + document.activeElement.blur(); + } +} + const desktopMenuComponents: MenuComponents = { Content: ContextMenuContent, Group: ContextMenuGroup, @@ -51,10 +59,20 @@ const desktopMenuComponents: MenuComponents = { SubContent: ContextMenuSubContent, }; -function getMobileMenuComponents(onClose: () => void): MenuComponents { +function getMobileMenuComponents({ + description, + onClose, + title, +}: { + description: string; + onClose: () => void; + title: string; +}): MenuComponents { return { Content: ({ className, children }) => ( + {title} + {description}
{children}
), @@ -62,6 +80,7 @@ function getMobileMenuComponents(onClose: () => void): MenuComponents { Item: ({ children, className, disabled, onClick, variant = "default" }) => { async function handleClick() { await onClick?.(); + blurActiveElement(); onClose(); } @@ -86,8 +105,9 @@ function getMobileMenuComponents(onClose: () => void): MenuComponents { Sub: ({ children }) =>
{children}
, SubTrigger: ({ children, onClick }) => { async function handleClick() { - await onClick?.(); + blurActiveElement(); onClose(); + await onClick?.(); } return ( @@ -198,11 +218,23 @@ export default function MessageContextMenu({ ); const [mainDrawerOpen, setMainDrawerOpen] = useState(false); const [reactionDrawerOpen, setReactionDrawerOpen] = useState(false); - const mainDrawerComponents = getMobileMenuComponents(() => - setMainDrawerOpen(false), + const mainDrawerComponents = useMemo( + () => + getMobileMenuComponents({ + description: "Actions available for this message.", + onClose: () => setMainDrawerOpen(false), + title: "Message actions", + }), + [], ); - const reactionDrawerComponents = getMobileMenuComponents(() => - setReactionDrawerOpen(false), + const reactionDrawerComponents = useMemo( + () => + getMobileMenuComponents({ + description: "Choose a reaction to add to this message.", + onClose: () => setReactionDrawerOpen(false), + title: "Add reaction", + }), + [], ); if (isMobile) { @@ -221,7 +253,13 @@ export default function MessageContextMenu({ - + Add reaction + + Choose a reaction to add to this message. + +
+ +
-- 2.54.0 From 6442de2c301c6fe29c94082c3c83798c8594aab4 Mon Sep 17 00:00:00 2001 From: Alois Date: Wed, 3 Jun 2026 09:13:07 +0200 Subject: [PATCH 2/3] (feat): remove profile popup from mobile --- apps/web/src/components/navbar.tsx | 29 +++++++++++++++-------------- 1 file changed, 15 insertions(+), 14 deletions(-) diff --git a/apps/web/src/components/navbar.tsx b/apps/web/src/components/navbar.tsx index a49a318..1c48c6c 100644 --- a/apps/web/src/components/navbar.tsx +++ b/apps/web/src/components/navbar.tsx @@ -1,13 +1,11 @@ -import { Button, Popover, PopoverContent, PopoverTrigger } from "@tensamin/ui"; import { - ArrowLeft, - ChevronDown, - ChevronUp, - House, - Phone, - Settings, - User, -} from "lucide-react"; + Button, + Popover, + PopoverContent, + PopoverTrigger, + useIsMobile, +} from "@tensamin/ui"; +import { ArrowLeft, House, Phone, Settings, User } from "lucide-react"; import { useLocation, useNavigate, useSearch } from "@tanstack/react-router"; import { joinCall, useCall } from "@tensamin/call/store"; import Wrapper from "@tensamin/user/wrapper"; @@ -33,6 +31,8 @@ export default function Navbar({ forMobile }: { forMobile: boolean }) { call.call_members.some((member) => member === id), ); + const isMobile = useIsMobile(); + const [selectOpen, setSelectOpen] = useState(false); const [userInfoOpen, setUserInfoOpen] = useState(false); @@ -72,8 +72,10 @@ export default function Navbar({ forMobile }: { forMobile: boolean }) { {pathname === "/chat" && id && ( ( - <> + component={(user) => + isMobile ? ( +

{user?.display}

+ ) : (

{user?.display}

- {userInfoOpen ? : } } /> @@ -93,8 +94,8 @@ export default function Navbar({ forMobile }: { forMobile: boolean }) {
- - )} + ) + } loading={} /> )} -- 2.54.0 From 4f58523e025239199a8223532ec83f6ca591672c Mon Sep 17 00:00:00 2001 From: Alois Date: Wed, 3 Jun 2026 09:13:22 +0200 Subject: [PATCH 3/3] (feat): bumb version --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index ae8ec19..1c2b52d 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "tensamin", - "version": "0.0.7", + "version": "0.0.8", "private": true, "workspaces": [ "packages/*", -- 2.54.0