Compare commits
1
Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
26cf1204b5 |
@@ -6,12 +6,13 @@ import {
|
||||
useCallJoined,
|
||||
useCallEmbedPlacementSync,
|
||||
useCallLoadError,
|
||||
useCallStart,
|
||||
} from '../../hooks/useCallEmbed';
|
||||
import { callEmbedAtom } from '../../state/callEmbed';
|
||||
import { ContainerColor } from '../../styles/ContainerColor.css';
|
||||
import { PrescreenControls } from './PrescreenControls';
|
||||
import { usePowerLevelsContext } from '../../hooks/usePowerLevels';
|
||||
import { useRoom } from '../../hooks/useRoom';
|
||||
import { useIsDirectRoom, useRoom } from '../../hooks/useRoom';
|
||||
import { useRoomCreators } from '../../hooks/useRoomCreators';
|
||||
import { useRoomPermissions } from '../../hooks/useRoomPermissions';
|
||||
import { useMatrixClient } from '../../hooks/useMatrixClient';
|
||||
@@ -160,6 +161,16 @@ function CallLoadErrorMessage() {
|
||||
// prescreen, where they can choose to join again.
|
||||
const dismiss = () => setCallEmbed(undefined);
|
||||
|
||||
// [Gitea #301] Try again: start a fresh embed for the same room with the
|
||||
// same mic/camera/sound choices (starting one disposes the hung one).
|
||||
const callEmbed = useCallEmbed();
|
||||
const startCall = useCallStart(useIsDirectRoom());
|
||||
const retry = () => {
|
||||
if (!callEmbed) return;
|
||||
const { room, control } = callEmbed;
|
||||
startCall(room, { microphone: control.microphone, video: control.video, sound: control.sound });
|
||||
};
|
||||
|
||||
return (
|
||||
<Box
|
||||
className={css.CallViewContent}
|
||||
@@ -173,6 +184,9 @@ function CallLoadErrorMessage() {
|
||||
The call failed to load. Check your connection and try again.
|
||||
</Text>
|
||||
<Box gap="200" alignItems="Center">
|
||||
<Button variant="Primary" size="300" radii="400" onClick={retry} disabled={!callEmbed}>
|
||||
<Text size="B400">Try again</Text>
|
||||
</Button>
|
||||
<Button variant="Secondary" fill="Soft" size="300" radii="400" onClick={dismiss}>
|
||||
<Text size="B400">Back</Text>
|
||||
</Button>
|
||||
|
||||
+134
-185
@@ -255,8 +255,6 @@ function HomeCustomSection({
|
||||
return (localName ?? matrixName).toLowerCase().includes(query);
|
||||
});
|
||||
}, [mx, section.rooms, closed, roomsWithUnreadSet, selectedRoomId, filterQuery]);
|
||||
// [Gitea #289] While filtering, a section with no matches is hidden.
|
||||
if (filterQuery.trim() && items.length === 0) return null;
|
||||
// Sections are user-curated and small, so they render plainly — no
|
||||
// virtualizer per section (a late-mounted one never measured its scroller).
|
||||
return (
|
||||
@@ -445,26 +443,6 @@ export function Home() {
|
||||
});
|
||||
}, [mx, sortedRooms, filterQuery]);
|
||||
|
||||
// [Gitea #289] While filtering, hide empty sections; with no match at all,
|
||||
// say so instead of leaving bare headers.
|
||||
const filtering = filterQuery.trim().length > 0;
|
||||
const customSectionMatch = useMemo(() => {
|
||||
if (!filtering) return true;
|
||||
const query = filterQuery.toLowerCase();
|
||||
const localNames = getLocalRoomNamesContent(mx);
|
||||
return customSections.some((section) =>
|
||||
section.rooms.some((rId) =>
|
||||
(localNames.rooms[rId] ?? mx.getRoom(rId)?.name ?? '').toLowerCase().includes(query),
|
||||
),
|
||||
);
|
||||
}, [mx, customSections, filtering, filterQuery]);
|
||||
const noFilterMatch =
|
||||
filtering &&
|
||||
!customSectionMatch &&
|
||||
filteredFavoriteRooms.length === 0 &&
|
||||
filteredRooms.length === 0 &&
|
||||
filteredLowPriorityRooms.length === 0;
|
||||
|
||||
const favVirtualizer = useVirtualizer({
|
||||
count: filteredFavoriteRooms.length,
|
||||
getScrollElement: () => scrollRef.current,
|
||||
@@ -602,7 +580,7 @@ export function Home() {
|
||||
/>
|
||||
</Box>
|
||||
</NavCategory>
|
||||
{favoriteRooms.length > 0 && (!filtering || filteredFavoriteRooms.length > 0) && (
|
||||
{favoriteRooms.length > 0 && (
|
||||
<NavCategory>
|
||||
<NavCategoryHeader>
|
||||
<RoomNavCategoryButton
|
||||
@@ -651,171 +629,142 @@ export function Home() {
|
||||
notificationPreferences={notificationPreferences}
|
||||
/>
|
||||
))}
|
||||
{noFilterMatch && (
|
||||
<NavCategory>
|
||||
<Box
|
||||
direction="Column"
|
||||
alignItems="Center"
|
||||
gap="200"
|
||||
style={{ padding: config.space.S400 }}
|
||||
<NavCategory>
|
||||
<NavCategoryHeader>
|
||||
<RoomNavCategoryButton
|
||||
closed={closedCategories.has(DEFAULT_CATEGORY_ID)}
|
||||
data-category-id={DEFAULT_CATEGORY_ID}
|
||||
onClick={handleCategoryClick}
|
||||
>
|
||||
<Text size="T300" priority="300" align="Center">
|
||||
No rooms match “{filterQuery.trim()}”
|
||||
</Text>
|
||||
<Button
|
||||
size="300"
|
||||
variant="Secondary"
|
||||
fill="Soft"
|
||||
radii="300"
|
||||
onClick={() => setFilterQuery('')}
|
||||
>
|
||||
<Text size="B300">Clear filter</Text>
|
||||
</Button>
|
||||
</Box>
|
||||
</NavCategory>
|
||||
)}
|
||||
{(!filtering || filteredRooms.length > 0) && (
|
||||
<NavCategory>
|
||||
<NavCategoryHeader>
|
||||
<RoomNavCategoryButton
|
||||
closed={closedCategories.has(DEFAULT_CATEGORY_ID)}
|
||||
data-category-id={DEFAULT_CATEGORY_ID}
|
||||
onClick={handleCategoryClick}
|
||||
>
|
||||
Rooms
|
||||
</RoomNavCategoryButton>
|
||||
{!closedCategories.has(DEFAULT_CATEGORY_ID) && (
|
||||
<>
|
||||
<IconButton
|
||||
aria-expanded={!!sortMenuAnchor}
|
||||
aria-haspopup="menu"
|
||||
variant="Background"
|
||||
fill="None"
|
||||
size="300"
|
||||
radii="300"
|
||||
onClick={(evt: React.MouseEvent<HTMLButtonElement>) => {
|
||||
const cords = evt.currentTarget.getBoundingClientRect();
|
||||
setSortMenuAnchor((current) => (current ? undefined : cords));
|
||||
}}
|
||||
aria-label="Sort rooms"
|
||||
>
|
||||
<Icon src={Icons.Sort} size="100" />
|
||||
</IconButton>
|
||||
<PopOut
|
||||
anchor={sortMenuAnchor}
|
||||
position="Bottom"
|
||||
align="End"
|
||||
offset={6}
|
||||
content={
|
||||
<FocusTrap
|
||||
focusTrapOptions={{
|
||||
initialFocus: false,
|
||||
onDeactivate: () => setSortMenuAnchor(undefined),
|
||||
clickOutsideDeactivates: true,
|
||||
isKeyForward: (evt: KeyboardEvent) => evt.key === 'ArrowDown',
|
||||
isKeyBackward: (evt: KeyboardEvent) => evt.key === 'ArrowUp',
|
||||
escapeDeactivates: stopPropagation,
|
||||
}}
|
||||
>
|
||||
<Menu style={{ maxWidth: toRem(180), width: '100vw' }}>
|
||||
<Box
|
||||
direction="Column"
|
||||
gap="100"
|
||||
style={{ padding: config.space.S100 }}
|
||||
Rooms
|
||||
</RoomNavCategoryButton>
|
||||
{!closedCategories.has(DEFAULT_CATEGORY_ID) && (
|
||||
<>
|
||||
<IconButton
|
||||
aria-expanded={!!sortMenuAnchor}
|
||||
aria-haspopup="menu"
|
||||
variant="Background"
|
||||
fill="None"
|
||||
size="300"
|
||||
radii="300"
|
||||
onClick={(evt: React.MouseEvent<HTMLButtonElement>) => {
|
||||
const cords = evt.currentTarget.getBoundingClientRect();
|
||||
setSortMenuAnchor((current) => (current ? undefined : cords));
|
||||
}}
|
||||
aria-label="Sort rooms"
|
||||
>
|
||||
<Icon src={Icons.Sort} size="100" />
|
||||
</IconButton>
|
||||
<PopOut
|
||||
anchor={sortMenuAnchor}
|
||||
position="Bottom"
|
||||
align="End"
|
||||
offset={6}
|
||||
content={
|
||||
<FocusTrap
|
||||
focusTrapOptions={{
|
||||
initialFocus: false,
|
||||
onDeactivate: () => setSortMenuAnchor(undefined),
|
||||
clickOutsideDeactivates: true,
|
||||
isKeyForward: (evt: KeyboardEvent) => evt.key === 'ArrowDown',
|
||||
isKeyBackward: (evt: KeyboardEvent) => evt.key === 'ArrowUp',
|
||||
escapeDeactivates: stopPropagation,
|
||||
}}
|
||||
>
|
||||
<Menu style={{ maxWidth: toRem(180), width: '100vw' }}>
|
||||
<Box
|
||||
direction="Column"
|
||||
gap="100"
|
||||
style={{ padding: config.space.S100 }}
|
||||
>
|
||||
<MenuItem
|
||||
onClick={() => {
|
||||
setHomeRoomSort('recent');
|
||||
setSortMenuAnchor(undefined);
|
||||
}}
|
||||
size="300"
|
||||
after={
|
||||
homeRoomSort === 'recent' ? (
|
||||
<Icon size="100" src={Icons.Check} />
|
||||
) : undefined
|
||||
}
|
||||
radii="300"
|
||||
>
|
||||
<MenuItem
|
||||
onClick={() => {
|
||||
setHomeRoomSort('recent');
|
||||
setSortMenuAnchor(undefined);
|
||||
}}
|
||||
size="300"
|
||||
after={
|
||||
homeRoomSort === 'recent' ? (
|
||||
<Icon size="100" src={Icons.Check} />
|
||||
) : undefined
|
||||
}
|
||||
radii="300"
|
||||
>
|
||||
<Text style={{ flexGrow: 1 }} as="span" size="T300" truncate>
|
||||
Recent Activity
|
||||
</Text>
|
||||
</MenuItem>
|
||||
<MenuItem
|
||||
onClick={() => {
|
||||
setHomeRoomSort('alpha');
|
||||
setSortMenuAnchor(undefined);
|
||||
}}
|
||||
size="300"
|
||||
after={
|
||||
homeRoomSort === 'alpha' ? (
|
||||
<Icon size="100" src={Icons.Check} />
|
||||
) : undefined
|
||||
}
|
||||
radii="300"
|
||||
>
|
||||
<Text style={{ flexGrow: 1 }} as="span" size="T300" truncate>
|
||||
A → Z
|
||||
</Text>
|
||||
</MenuItem>
|
||||
<MenuItem
|
||||
onClick={() => {
|
||||
setHomeRoomSort('unread');
|
||||
setSortMenuAnchor(undefined);
|
||||
}}
|
||||
size="300"
|
||||
after={
|
||||
homeRoomSort === 'unread' ? (
|
||||
<Icon size="100" src={Icons.Check} />
|
||||
) : undefined
|
||||
}
|
||||
radii="300"
|
||||
>
|
||||
<Text style={{ flexGrow: 1 }} as="span" size="T300" truncate>
|
||||
Unread First
|
||||
</Text>
|
||||
</MenuItem>
|
||||
</Box>
|
||||
</Menu>
|
||||
</FocusTrap>
|
||||
}
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
</NavCategoryHeader>
|
||||
<div
|
||||
style={{
|
||||
position: 'relative',
|
||||
height: virtualizer.getTotalSize(),
|
||||
}}
|
||||
>
|
||||
{virtualizer.getVirtualItems().map((vItem) => {
|
||||
const roomId = filteredRooms[vItem.index];
|
||||
const room = mx.getRoom(roomId);
|
||||
if (!room) return null;
|
||||
const selected = selectedRoomId === roomId;
|
||||
<Text style={{ flexGrow: 1 }} as="span" size="T300" truncate>
|
||||
Recent Activity
|
||||
</Text>
|
||||
</MenuItem>
|
||||
<MenuItem
|
||||
onClick={() => {
|
||||
setHomeRoomSort('alpha');
|
||||
setSortMenuAnchor(undefined);
|
||||
}}
|
||||
size="300"
|
||||
after={
|
||||
homeRoomSort === 'alpha' ? (
|
||||
<Icon size="100" src={Icons.Check} />
|
||||
) : undefined
|
||||
}
|
||||
radii="300"
|
||||
>
|
||||
<Text style={{ flexGrow: 1 }} as="span" size="T300" truncate>
|
||||
A → Z
|
||||
</Text>
|
||||
</MenuItem>
|
||||
<MenuItem
|
||||
onClick={() => {
|
||||
setHomeRoomSort('unread');
|
||||
setSortMenuAnchor(undefined);
|
||||
}}
|
||||
size="300"
|
||||
after={
|
||||
homeRoomSort === 'unread' ? (
|
||||
<Icon size="100" src={Icons.Check} />
|
||||
) : undefined
|
||||
}
|
||||
radii="300"
|
||||
>
|
||||
<Text style={{ flexGrow: 1 }} as="span" size="T300" truncate>
|
||||
Unread First
|
||||
</Text>
|
||||
</MenuItem>
|
||||
</Box>
|
||||
</Menu>
|
||||
</FocusTrap>
|
||||
}
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
</NavCategoryHeader>
|
||||
<div
|
||||
style={{
|
||||
position: 'relative',
|
||||
height: virtualizer.getTotalSize(),
|
||||
}}
|
||||
>
|
||||
{virtualizer.getVirtualItems().map((vItem) => {
|
||||
const roomId = filteredRooms[vItem.index];
|
||||
const room = mx.getRoom(roomId);
|
||||
if (!room) return null;
|
||||
const selected = selectedRoomId === roomId;
|
||||
|
||||
return (
|
||||
<VirtualTile
|
||||
virtualItem={vItem}
|
||||
key={roomId}
|
||||
ref={virtualizer.measureElement}
|
||||
>
|
||||
<RoomNavItem
|
||||
room={room}
|
||||
selected={selected}
|
||||
linkPath={getHomeRoomPath(getCanonicalAliasOrRoomId(mx, roomId))}
|
||||
notificationMode={getRoomNotificationMode(
|
||||
notificationPreferences,
|
||||
room.roomId,
|
||||
)}
|
||||
/>
|
||||
</VirtualTile>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</NavCategory>
|
||||
)}
|
||||
{lowPriorityRooms.length > 0 && (!filtering || filteredLowPriorityRooms.length > 0) && (
|
||||
return (
|
||||
<VirtualTile virtualItem={vItem} key={roomId} ref={virtualizer.measureElement}>
|
||||
<RoomNavItem
|
||||
room={room}
|
||||
selected={selected}
|
||||
linkPath={getHomeRoomPath(getCanonicalAliasOrRoomId(mx, roomId))}
|
||||
notificationMode={getRoomNotificationMode(
|
||||
notificationPreferences,
|
||||
room.roomId,
|
||||
)}
|
||||
/>
|
||||
</VirtualTile>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</NavCategory>
|
||||
{lowPriorityRooms.length > 0 && (
|
||||
<NavCategory>
|
||||
<NavCategoryHeader>
|
||||
<RoomNavCategoryButton
|
||||
|
||||
Reference in New Issue
Block a user