mirror of https://github.com/vector-im/riot-web
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
parent
184c73cca4
commit
ecb0b0113f
|
@ -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 New Issue