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:
Michael Telatynski 2020-12-09 11:07:40 +00:00
parent 184c73cca4
commit ecb0b0113f
2 changed files with 11 additions and 3 deletions

View file

@ -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")}

View file

@ -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;
};