Skip to content
This repository has been archived by the owner on Sep 11, 2024. It is now read-only.

Fix bulk invite button getting a negative count #7122

Merged
merged 4 commits into from
Nov 16, 2021
Merged

Fix bulk invite button getting a negative count #7122

Changes from 3 commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
85ac644
Fix bulk invite button getting a negative counter
renancleyson-dev Nov 11, 2021
c270b92
Change invites to be count on membership events
renancleyson-dev Nov 16, 2021
cafd88e
Remove unnecessary bind
renancleyson-dev Nov 16, 2021
ca3944b
Change invitedRooms state to a set of ids
renancleyson-dev Nov 16, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
52 changes: 39 additions & 13 deletions src/components/views/settings/tabs/user/SecurityUserSettingsTab.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -76,7 +76,7 @@ interface IState {
ignoredUserIds: string[];
waitingUnignored: string[];
managingInvites: boolean;
invitedRoomAmt: number;
invitedRooms: Room[];
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Since you're mainly adding and removing elements of this array, I think it could be better to use a Set

}

@replaceableComponent("views.settings.tabs.user.SecurityUserSettingsTab")
Expand All @@ -86,14 +86,14 @@ export default class SecurityUserSettingsTab extends React.Component<IProps, ISt
constructor(props: IProps) {
super(props);

// Get number of rooms we're invited to
// Get rooms we're invited to
const invitedRooms = this.getInvitedRooms();

this.state = {
ignoredUserIds: MatrixClientPeg.get().getIgnoredUsers(),
waitingUnignored: [],
managingInvites: false,
invitedRoomAmt: invitedRooms.length,
invitedRooms,
};
}

Expand All @@ -107,10 +107,12 @@ export default class SecurityUserSettingsTab extends React.Component<IProps, ISt

public componentDidMount(): void {
this.dispatcherRef = dis.register(this.onAction);
MatrixClientPeg.get().on("Room.myMembership", this.onMyMembership);
}

public componentWillUnmount(): void {
dis.unregister(this.dispatcherRef);
MatrixClientPeg.get().removeListener("Room.myMembership", this.onMyMembership);
}

private updateAnalytics = (checked: boolean): void => {
Expand All @@ -119,6 +121,31 @@ export default class SecurityUserSettingsTab extends React.Component<IProps, ISt
PosthogAnalytics.instance.updateAnonymityFromSettings(MatrixClientPeg.get().getUserId());
};

private onMyMembership = (room: Room, membership: string): void => {
const { invitedRooms } = this.state;

if (room.isSpaceRoom()) {
return;
}

if (membership === "invite") {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't think we have a membership enum but it might be worth checking

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I didn't find any membership enum :(
I can declare it, though it might be worth creating a PR only to handle this.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah, probably don'ŧ worry about it, it should be in the js-sdk, anyway

this.addInvitedRoom(room);
} else if (invitedRooms.some(invitedRoom => invitedRoom.roomId === room.roomId)) {
// The user isn't invited anymore
this.removeInvitedRoom(room.roomId);
}
};

private addInvitedRoom = (room: Room): void => {
this.setState(({ invitedRooms }) => ({ invitedRooms: [...invitedRooms, room] }));
};

private removeInvitedRoom = (roomId: string): void => {
this.setState((prevState) => ({
invitedRooms: prevState.invitedRooms.filter(room => room.roomId !== roomId),
}));
};

private onGoToUserProfileClick = (): void => {
dis.dispatch({
action: 'view_user_info',
Expand Down Expand Up @@ -151,7 +178,7 @@ export default class SecurityUserSettingsTab extends React.Component<IProps, ISt
});

// Compile array of invitation room ids
const invitedRoomIds = this.getInvitedRooms().map((room) => {
const invitedRoomIds = this.state.invitedRooms.map((room) => {
return room.roomId;
});

Expand All @@ -164,7 +191,7 @@ export default class SecurityUserSettingsTab extends React.Component<IProps, ISt
// Accept/reject invite
await action(roomId).then(() => {
// No error, update invited rooms button
this.setState({ invitedRoomAmt: this.state.invitedRoomAmt - 1 });
this.removeInvitedRoom(roomId);
}, async (e) => {
// Action failure
if (e.errcode === "M_LIMIT_EXCEEDED") {
Expand Down Expand Up @@ -221,21 +248,20 @@ export default class SecurityUserSettingsTab extends React.Component<IProps, ISt
}

private renderManageInvites(): JSX.Element {
if (this.state.invitedRoomAmt === 0) {
const { invitedRooms } = this.state;

if (invitedRooms.length === 0) {
return null;
}

const invitedRooms = this.getInvitedRooms();
const onClickAccept = this.onAcceptAllInvitesClicked.bind(this, invitedRooms);
const onClickReject = this.onRejectAllInvitesClicked.bind(this, invitedRooms);
return (
<div className='mx_SettingsTab_section mx_SecurityUserSettingsTab_bulkOptions'>
<span className='mx_SettingsTab_subheading'>{ _t('Bulk options') }</span>
<AccessibleButton onClick={onClickAccept} kind='primary' disabled={this.state.managingInvites}>
{ _t("Accept all %(invitedRooms)s invites", { invitedRooms: this.state.invitedRoomAmt }) }
<AccessibleButton onClick={this.onAcceptAllInvitesClicked} kind='primary' disabled={this.state.managingInvites}>
{ _t("Accept all %(invitedRooms)s invites", { invitedRooms: invitedRooms.length }) }
</AccessibleButton>
<AccessibleButton onClick={onClickReject} kind='danger' disabled={this.state.managingInvites}>
{ _t("Reject all %(invitedRooms)s invites", { invitedRooms: this.state.invitedRoomAmt }) }
<AccessibleButton onClick={this.onRejectAllInvitesClicked} kind='danger' disabled={this.state.managingInvites}>
{ _t("Reject all %(invitedRooms)s invites", { invitedRooms: invitedRooms.length }) }
</AccessibleButton>
{ this.state.managingInvites ? <InlineSpinner /> : <div /> }
</div>
Expand Down