mirrors/cinny
1
0
Fork 0
mirror of https://github.com/cinnyapp/cinny.git synced 2024-12-29 10:56:10 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Load room member even when member drawer is closed (#1825)

Browse source
This commit is contained in:
Ajay Bura 2024-07-23 10:45:17 +05:30 committed by GitHub
parent e6d6b0349e
commit a32c8bf228
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 9 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/app/features/lobby/Lobby.tsx
View file

@ -47,6 +47,7 @@ import {
import { useOrphanSpaces } from '../../state/hooks/roomList'; import { useOrphanSpaces } from '../../state/hooks/roomList';
import { roomToParentsAtom } from '../../state/room/roomToParents'; import { roomToParentsAtom } from '../../state/room/roomToParents';
import { AccountDataEvent } from '../../../types/matrix/accountData'; import { AccountDataEvent } from '../../../types/matrix/accountData';
import { useRoomMembers } from '../../hooks/useRoomMembers';
export function Lobby() { export function Lobby() {
const navigate = useNavigate(); const navigate = useNavigate();
@ -57,6 +58,7 @@ export function Lobby() {
const space = useSpace(); const space = useSpace();
const spacePowerLevels = usePowerLevels(space); const spacePowerLevels = usePowerLevels(space);
const lex = useMemo(() => new ASCIILexicalTable(' '.charCodeAt(0), '~'.charCodeAt(0), 6), []); const lex = useMemo(() => new ASCIILexicalTable(' '.charCodeAt(0), '~'.charCodeAt(0), 6), []);
const members = useRoomMembers(mx, space.roomId);
const scrollRef = useRef<HTMLDivElement>(null); const scrollRef = useRef<HTMLDivElement>(null);
const heroSectionRef = useRef<HTMLDivElement>(null); const heroSectionRef = useRef<HTMLDivElement>(null);
@ -519,7 +521,7 @@ export function Lobby() {
{screenSize === ScreenSize.Desktop && isDrawer && ( {screenSize === ScreenSize.Desktop && isDrawer && (
<> <>
<Line variant="Background" direction="Vertical" size="300" /> <Line variant="Background" direction="Vertical" size="300" />
<MembersDrawer room={space} /> <MembersDrawer room={space} members={members} />
</> </>
)} )}
</Box> </Box>

5
src/app/features/room/MembersDrawer.tsx
View file

@ -35,7 +35,6 @@ import classNames from 'classnames';
import { openProfileViewer } from '../../../client/action/navigation'; import { openProfileViewer } from '../../../client/action/navigation';
import * as css from './MembersDrawer.css'; import * as css from './MembersDrawer.css';
import { useRoomMembers } from '../../hooks/useRoomMembers';
import { useMatrixClient } from '../../hooks/useMatrixClient'; import { useMatrixClient } from '../../hooks/useMatrixClient';
import { Membership } from '../../../types/matrix/room'; import { Membership } from '../../../types/matrix/room';
import { UseStateProvider } from '../../components/UseStateProvider'; import { UseStateProvider } from '../../components/UseStateProvider';
@ -168,13 +167,13 @@ const getRoomMemberStr: SearchItemStrGetter<RoomMember> = (m, query) =>
type MembersDrawerProps = { type MembersDrawerProps = {
room: Room; room: Room;
members: RoomMember[];
}; };
export function MembersDrawer({ room }: MembersDrawerProps) { export function MembersDrawer({ room, members }: MembersDrawerProps) {
const mx = useMatrixClient(); const mx = useMatrixClient();
const scrollRef = useRef<HTMLDivElement>(null); const scrollRef = useRef<HTMLDivElement>(null);
const searchInputRef = useRef<HTMLInputElement>(null); const searchInputRef = useRef<HTMLInputElement>(null);
const scrollTopAnchorRef = useRef<HTMLDivElement>(null); const scrollTopAnchorRef = useRef<HTMLDivElement>(null);
const members = useRoomMembers(mx, room.roomId);
const getPowerLevelTag = usePowerLevelTags(); const getPowerLevelTag = usePowerLevelTags();
const fetchingMembers = members.length < room.getJoinedMemberCount(); const fetchingMembers = members.length < room.getJoinedMemberCount();
const setPeopleDrawer = useSetSetting(settingsAtom, 'isPeopleDrawer'); const setPeopleDrawer = useSetSetting(settingsAtom, 'isPeopleDrawer');

6
src/app/features/room/Room.tsx
View file

@ -12,6 +12,7 @@ import { useRoom } from '../../hooks/useRoom';
import { useKeyDown } from '../../hooks/useKeyDown'; import { useKeyDown } from '../../hooks/useKeyDown';
import { markAsRead } from '../../../client/action/notifications'; import { markAsRead } from '../../../client/action/notifications';
import { useMatrixClient } from '../../hooks/useMatrixClient'; import { useMatrixClient } from '../../hooks/useMatrixClient';
import { useRoomMembers } from '../../hooks/useRoomMembers';
export function Room() { export function Room() {
const { eventId } = useParams(); const { eventId } = useParams();
@ -21,6 +22,7 @@ export function Room() {
const [isDrawer] = useSetting(settingsAtom, 'isPeopleDrawer'); const [isDrawer] = useSetting(settingsAtom, 'isPeopleDrawer');
const screenSize = useScreenSizeContext(); const screenSize = useScreenSizeContext();
const powerLevels = usePowerLevels(room); const powerLevels = usePowerLevels(room);
const members = useRoomMembers(mx, room.roomId);
useKeyDown( useKeyDown(
window, window,
@ -30,7 +32,7 @@ export function Room() {
markAsRead(mx, room.roomId); markAsRead(mx, room.roomId);
} }
}, },
[room.roomId] [mx, room.roomId]
) )
); );
@ -41,7 +43,7 @@ export function Room() {
{screenSize === ScreenSize.Desktop && isDrawer && ( {screenSize === ScreenSize.Desktop && isDrawer && (
<> <>
<Line variant="Background" direction="Vertical" size="300" /> <Line variant="Background" direction="Vertical" size="300" />
<MembersDrawer key={room.roomId} room={room} /> <MembersDrawer key={room.roomId} room={room} members={members} />
</> </>
)} )}
</Box> </Box>