loosely provide nav handling for testing refactoring

This commit is contained in:
Gigiaj
2025-05-08 17:57:45 -05:00
parent 9e919ea761
commit 3fcf2fef59

View File

@@ -52,6 +52,7 @@ import {
} from '../../hooks/useRoomsNotificationPreferences'; } from '../../hooks/useRoomsNotificationPreferences';
import { RoomNotificationModeSwitcher } from '../../components/RoomNotificationSwitcher'; import { RoomNotificationModeSwitcher } from '../../components/RoomNotificationSwitcher';
import { useCallState } from '../../pages/client/CallProvider'; import { useCallState } from '../../pages/client/CallProvider';
import { useRoomNavigate } from '../../hooks/useRoomNavigate';
type RoomNavItemMenuProps = { type RoomNavItemMenuProps = {
room: Room; room: Room;
@@ -221,10 +222,11 @@ export function RoomNavItem({
const { focusWithinProps } = useFocusWithin({ onFocusWithinChange: setHover }); const { focusWithinProps } = useFocusWithin({ onFocusWithinChange: setHover });
const [menuAnchor, setMenuAnchor] = useState<RectCords>(); const [menuAnchor, setMenuAnchor] = useState<RectCords>();
const unread = useRoomUnread(room.roomId, roomToUnreadAtom); const unread = useRoomUnread(room.roomId, roomToUnreadAtom);
const { activeCallRoomId, isChatOpen, toggleChat, hangUp } = useCallState(); const { activeCallRoomId, setActiveCallRoomId, isChatOpen, toggleChat, hangUp } = useCallState();
const typingMember = useRoomTypingMember(room.roomId).filter( const typingMember = useRoomTypingMember(room.roomId).filter(
(receipt) => receipt.userId !== mx.getUserId() (receipt) => receipt.userId !== mx.getUserId()
); );
const { navigateRoom } = useRoomNavigate();
const handleContextMenu: MouseEventHandler<HTMLElement> = (evt) => { const handleContextMenu: MouseEventHandler<HTMLElement> = (evt) => {
evt.preventDefault(); evt.preventDefault();
@@ -251,6 +253,9 @@ export function RoomNavItem({
if (room.isCallRoom() && activeCallRoomId !== room.roomId) { if (room.isCallRoom() && activeCallRoomId !== room.roomId) {
hangUp(); hangUp();
setActiveCallRoomId(room.roomId);
} else {
navigateRoom(room.roomId);
} }
}; };
@@ -272,57 +277,54 @@ export function RoomNavItem({
{...hoverProps} {...hoverProps}
{...focusWithinProps} {...focusWithinProps}
> >
<NavLink to={linkPath} onClick={handleNavItemClick}> <NavItemContent onClick={handleNavItemClick}>
{' '} <Box as="span" grow="Yes" alignItems="Center" gap="200">
<NavItemContent> <Avatar size="200" radii="400">
<Box as="span" grow="Yes" alignItems="Center" gap="200"> {showAvatar ? (
<Avatar size="200" radii="400"> <RoomAvatar
{showAvatar ? ( roomId={room.roomId}
<RoomAvatar src={
roomId={room.roomId} direct
src={ ? getDirectRoomAvatarUrl(mx, room, 96, useAuthentication)
direct : getRoomAvatarUrl(mx, room, 96, useAuthentication)
? getDirectRoomAvatarUrl(mx, room, 96, useAuthentication) }
: getRoomAvatarUrl(mx, room, 96, useAuthentication) alt={room.name}
} renderFallback={() => (
alt={room.name} <Text as="span" size="H6">
renderFallback={() => ( {nameInitials(room.name)}
<Text as="span" size="H6"> </Text>
{nameInitials(room.name)} )}
</Text> />
)} ) : (
/> <RoomIcon
) : ( style={{ opacity: unread ? config.opacity.P500 : config.opacity.P300 }}
<RoomIcon filled={selected}
style={{ opacity: unread ? config.opacity.P500 : config.opacity.P300 }} size="100"
filled={selected} joinRule={room.getJoinRule()}
size="100" call={room.isCallRoom()}
joinRule={room.getJoinRule()} />
call={room.isCallRoom()}
/>
)}
</Avatar>
<Box as="span" grow="Yes">
<Text priority={unread ? '500' : '300'} as="span" size="Inherit" truncate>
{room.name}
</Text>
</Box>
{!optionsVisible && !unread && !selected && typingMember.length > 0 && (
<Badge size="300" variant="Secondary" fill="Soft" radii="Pill" outlined>
<TypingIndicator size="300" disableAnimation />
</Badge>
)}
{!optionsVisible && unread && (
<UnreadBadgeCenter>
<UnreadBadge highlight={unread.highlight > 0} count={unread.total} />
</UnreadBadgeCenter>
)}
{!optionsVisible && notificationMode !== RoomNotificationMode.Unset && (
<Icon size="50" src={getRoomNotificationModeIcon(notificationMode)} />
)} )}
</Avatar>
<Box as="span" grow="Yes">
<Text priority={unread ? '500' : '300'} as="span" size="Inherit" truncate>
{room.name}
</Text>
</Box> </Box>
</NavItemContent> {!optionsVisible && !unread && !selected && typingMember.length > 0 && (
</NavLink> <Badge size="300" variant="Secondary" fill="Soft" radii="Pill" outlined>
<TypingIndicator size="300" disableAnimation />
</Badge>
)}
{!optionsVisible && unread && (
<UnreadBadgeCenter>
<UnreadBadge highlight={unread.highlight > 0} count={unread.total} />
</UnreadBadgeCenter>
)}
{!optionsVisible && notificationMode !== RoomNotificationMode.Unset && (
<Icon size="50" src={getRoomNotificationModeIcon(notificationMode)} />
)}
</Box>
</NavItemContent>
{optionsVisible && ( {optionsVisible && (
<NavItemOptions> <NavItemOptions>
<PopOut <PopOut