mirror of
https://github.com/element-hq/element-web
synced 2024-11-27 19:56:47 +03:00
Also use getJoinedMemberCount
as its capable of using the room summary member count instead
Leave the useRoomMembers hook for future use as it is very useful.
This commit is contained in:
parent
184c73cca4
commit
ecb0b0113f
2 changed files with 11 additions and 3 deletions
|
@ -43,7 +43,7 @@ import RoomContext from "../../../contexts/RoomContext";
|
||||||
import {UIFeature} from "../../../settings/UIFeature";
|
import {UIFeature} from "../../../settings/UIFeature";
|
||||||
import {ChevronFace, ContextMenuTooltipButton, useContextMenu} from "../../structures/ContextMenu";
|
import {ChevronFace, ContextMenuTooltipButton, useContextMenu} from "../../structures/ContextMenu";
|
||||||
import WidgetContextMenu from "../context_menus/WidgetContextMenu";
|
import WidgetContextMenu from "../context_menus/WidgetContextMenu";
|
||||||
import {useRoomMembers} from "../../../hooks/useRoomMembers";
|
import {useRoomMemberCount} from "../../../hooks/useRoomMembers";
|
||||||
|
|
||||||
interface IProps {
|
interface IProps {
|
||||||
room: Room;
|
room: Room;
|
||||||
|
@ -244,12 +244,12 @@ const RoomSummaryCard: React.FC<IProps> = ({ room, onClose }) => {
|
||||||
</div>
|
</div>
|
||||||
</React.Fragment>;
|
</React.Fragment>;
|
||||||
|
|
||||||
const members = useRoomMembers(room);
|
const memberCount = useRoomMemberCount(room);
|
||||||
|
|
||||||
return <BaseCard header={header} className="mx_RoomSummaryCard" onClose={onClose}>
|
return <BaseCard header={header} className="mx_RoomSummaryCard" onClose={onClose}>
|
||||||
<Group title={_t("About")} className="mx_RoomSummaryCard_aboutGroup">
|
<Group title={_t("About")} className="mx_RoomSummaryCard_aboutGroup">
|
||||||
<Button className="mx_RoomSummaryCard_icon_people" onClick={onRoomMembersClick}>
|
<Button className="mx_RoomSummaryCard_icon_people" onClick={onRoomMembersClick}>
|
||||||
{_t("%(count)s people", { count: members.length })}
|
{_t("%(count)s people", { count: memberCount })}
|
||||||
</Button>
|
</Button>
|
||||||
<Button className="mx_RoomSummaryCard_icon_files" onClick={onRoomFilesClick}>
|
<Button className="mx_RoomSummaryCard_icon_files" onClick={onRoomFilesClick}>
|
||||||
{_t("Show files")}
|
{_t("Show files")}
|
||||||
|
|
|
@ -29,3 +29,11 @@ export const useRoomMembers = (room: Room, throttleWait = 250) => {
|
||||||
}, throttleWait, {leading: true, trailing: true}));
|
}, throttleWait, {leading: true, trailing: true}));
|
||||||
return members;
|
return members;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
export const useRoomMemberCount = (room: Room, throttleWait = 250) => {
|
||||||
|
const [count, setCount] = useState<number>(room.getJoinedMemberCount());
|
||||||
|
useEventEmitter(room.currentState, "RoomState.members", throttle(() => {
|
||||||
|
setCount(room.getJoinedMemberCount());
|
||||||
|
}, throttleWait, {leading: true, trailing: true}));
|
||||||
|
return count;
|
||||||
|
};
|
||||||
|
|
Loading…
Reference in a new issue