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.
pull/21833/head
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;
};