Replace onClick by onMouseDown

Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
pull/21833/head
Šimon Brandner 2021-06-22 09:24:42 +02:00
parent a59deeb491
commit 066ef18db2
No known key found for this signature in database
GPG Key ID: 9760693FDD98A790
1 changed files with 21 additions and 24 deletions

View File

@ -567,11 +567,11 @@ export default class RoomDirectory extends React.Component<IProps, IState> {
let avatarUrl = null; let avatarUrl = null;
if (room.avatar_url) avatarUrl = mediaFromMxc(room.avatar_url).getSquareThumbnailHttp(32); if (room.avatar_url) avatarUrl = mediaFromMxc(room.avatar_url).getSquareThumbnailHttp(32);
// We use onMouseDown instead of onClick, so that we can avoid text getting selected
return [ return [
<div key={ `${room.room_id}_avatar` } <div
onClick={(ev) => this.onRoomClicked(room, ev)} key={ `${room.room_id}_avatar` }
// cancel onMouseDown otherwise shift-clicking highlights text onMouseDown={(ev) => this.onRoomClicked(room, ev)}
onMouseDown={(ev) => {ev.preventDefault();}}
className="mx_RoomDirectory_roomAvatar" className="mx_RoomDirectory_roomAvatar"
> >
<BaseAvatar <BaseAvatar
@ -583,50 +583,47 @@ export default class RoomDirectory extends React.Component<IProps, IState> {
url={avatarUrl} url={avatarUrl}
/> />
</div>, </div>,
<div key={ `${room.room_id}_description` } <div
onClick={(ev) => this.onRoomClicked(room, ev)} key={ `${room.room_id}_description` }
// cancel onMouseDown otherwise shift-clicking highlights text onMouseDown={(ev) => this.onRoomClicked(room, ev)}
onMouseDown={(ev) => {ev.preventDefault();}}
className="mx_RoomDirectory_roomDescription" className="mx_RoomDirectory_roomDescription"
> >
<div <div
className="mx_RoomDirectory_name" className="mx_RoomDirectory_name"
onClick={(ev) => this.onRoomClicked(room, ev)} onMouseDown={(ev) => this.onRoomClicked(room, ev)}
> >
{ name } { name }
</div>&nbsp; </div>&nbsp;
<div <div
className="mx_RoomDirectory_topic" className="mx_RoomDirectory_topic"
onClick={(ev) => this.onRoomClicked(room, ev)} onMouseDown={(ev) => this.onRoomClicked(room, ev)}
dangerouslySetInnerHTML={{ __html: topic }} dangerouslySetInnerHTML={{ __html: topic }}
/> />
<div <div
className="mx_RoomDirectory_alias" className="mx_RoomDirectory_alias"
onClick={(ev) => this.onRoomClicked(room, ev)} onMouseDown={(ev) => this.onRoomClicked(room, ev)}
> >
{ getDisplayAliasForRoom(room) } { getDisplayAliasForRoom(room) }
</div> </div>
</div>, </div>,
<div key={ `${room.room_id}_memberCount` } <div
onClick={(ev) => this.onRoomClicked(room, ev)} key={ `${room.room_id}_memberCount` }
// cancel onMouseDown otherwise shift-clicking highlights text onMouseDown={(ev) => this.onRoomClicked(room, ev)}
onMouseDown={(ev) => {ev.preventDefault();}}
className="mx_RoomDirectory_roomMemberCount" className="mx_RoomDirectory_roomMemberCount"
> >
{ room.num_joined_members } { room.num_joined_members }
</div>, </div>,
<div key={ `${room.room_id}_preview` } <div
onClick={(ev) => this.onRoomClicked(room, ev)} key={ `${room.room_id}_preview` }
onMouseDown={(ev) => this.onRoomClicked(room, ev)}
// cancel onMouseDown otherwise shift-clicking highlights text // cancel onMouseDown otherwise shift-clicking highlights text
onMouseDown={(ev) => {ev.preventDefault();}}
className="mx_RoomDirectory_preview" className="mx_RoomDirectory_preview"
> >
{ previewButton } { previewButton }
</div>, </div>,
<div key={ `${room.room_id}_join` } <div
onClick={(ev) => this.onRoomClicked(room, ev)} key={ `${room.room_id}_join` }
// cancel onMouseDown otherwise shift-clicking highlights text onMouseDown={(ev) => this.onRoomClicked(room, ev)}
onMouseDown={(ev) => {ev.preventDefault();}}
className="mx_RoomDirectory_join" className="mx_RoomDirectory_join"
> >
{ joinOrViewButton } { joinOrViewButton }