imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add presence icons; Convert to generic icon component

Browse source 
For https://github.com/vector-im/riot-web/issues/14039
This commit is contained in:
Travis Ralston 2020-06-16 14:43:48 -06:00
parent bcebef7e56
commit e4a51a7c01
7 changed files with 258 additions and 38 deletions
Download patch file Download diff file Expand all files Collapse all files

28
src/components/views/rooms/RoomTile2.tsx
View file

@ -21,7 +21,7 @@ import React, { createRef } from "react";
import { Room } from "matrix-js-sdk/src/models/room";
import classNames from "classnames";
import { RovingTabIndexWrapper } from "../../../accessibility/RovingTabIndex";
import AccessibleButton, {ButtonEvent} from "../../views/elements/AccessibleButton";
import AccessibleButton, { ButtonEvent } from "../../views/elements/AccessibleButton";
import RoomAvatar from "../../views/avatars/RoomAvatar";
import dis from '../../../dispatcher/dispatcher';
import { Key } from "../../../Keyboard";
@ -31,6 +31,7 @@ import { _t } from "../../../languageHandler";
import { ContextMenu, ContextMenuButton } from "../../structures/ContextMenu";
import { DefaultTagID, TagID } from "../../../stores/room-list/models";
import { MessagePreviewStore } from "../../../stores/MessagePreviewStore";
import RoomTileIcon from "./RoomTileIcon";
/*******************************************************************
* CAUTION *
@ -86,12 +87,6 @@ export default class RoomTile2 extends React.Component<IProps, IState> {
ActiveRoomObserver.addListener(this.props.room.roomId, this.onActiveRoomUpdate);
}
private get isPublicRoom(): boolean {
const joinRules = this.props.room.currentState.getStateEvents("m.room.join_rules", "");
const joinRule = joinRules && joinRules.getContent().join_rule;
return joinRule === 'public';
}
public componentWillUnmount() {
if (this.props.room) {
ActiveRoomObserver.removeListener(this.props.room.roomId, this.onActiveRoomUpdate);
@ -187,25 +182,25 @@ export default class RoomTile2 extends React.Component<IProps, IState> {
<ul>
<li>
<AccessibleButton onClick={(e) => this.onTagRoom(e, DefaultTagID.Favourite)}>
<span className="mx_IconizedContextMenu_icon mx_RoomTile2_iconStar" />
<span className="mx_IconizedContextMenu_icon mx_RoomTile2_iconStar"/>
<span>{_t("Favourite")}</span>
</AccessibleButton>
</li>
<li>
<AccessibleButton onClick={(e) => this.onTagRoom(e, DefaultTagID.LowPriority)}>
<span className="mx_IconizedContextMenu_icon mx_RoomTile2_iconArrowDown" />
<span className="mx_IconizedContextMenu_icon mx_RoomTile2_iconArrowDown"/>
<span>{_t("Low Priority")}</span>
</AccessibleButton>
</li>
<li>
<AccessibleButton onClick={(e) => this.onTagRoom(e, DefaultTagID.DM)}>
<span className="mx_IconizedContextMenu_icon mx_RoomTile2_iconUser" />
<span className="mx_IconizedContextMenu_icon mx_RoomTile2_iconUser"/>
<span>{_t("Direct Chat")}</span>
</AccessibleButton>
</li>
<li>
<AccessibleButton onClick={this.onOpenRoomSettings}>
<span className="mx_IconizedContextMenu_icon mx_RoomTile2_iconSettings" />
<span className="mx_IconizedContextMenu_icon mx_RoomTile2_iconSettings"/>
<span>{_t("Settings")}</span>
</AccessibleButton>
</li>
@ -215,7 +210,7 @@ export default class RoomTile2 extends React.Component<IProps, IState> {
<ul>
<li className="mx_RoomTile2_contextMenu_redRow">
<AccessibleButton onClick={this.onLeaveRoomClick}>
<span className="mx_IconizedContextMenu_icon mx_RoomTile2_iconSignOut" />
<span className="mx_IconizedContextMenu_icon mx_RoomTile2_iconSignOut"/>
<span>{_t("Leave Room")}</span>
</AccessibleButton>
</li>
@ -253,7 +248,7 @@ export default class RoomTile2 extends React.Component<IProps, IState> {
'mx_RoomTile2_minimized': this.props.isMinimized,
});
const badge = <NotificationBadge notification={this.state.notificationState} allowNoCount={true} />;
const badge = <NotificationBadge notification={this.state.notificationState} allowNoCount={true}/>;
// TODO: the original RoomTile uses state for the room name. Do we need to?
let name = this.props.room.name;
@ -294,11 +289,6 @@ export default class RoomTile2 extends React.Component<IProps, IState> {
);
if (this.props.isMinimized) nameContainer = null;
let globe = null;
if (this.isPublicRoom && this.props.tag !== DefaultTagID.DM) {
globe = <span className='mx_RoomTile2_publicRoom' />; // sizing and such set by CSS
}
const avatarSize = 32;
return (
<React.Fragment>
@ -316,7 +306,7 @@ export default class RoomTile2 extends React.Component<IProps, IState> {
>
<div className="mx_RoomTile2_avatarContainer">
<RoomAvatar room={this.props.room} width={avatarSize} height={avatarSize}/>
{globe}
<RoomTileIcon room={this.props.room} tag={this.props.tag}/>
</div>
{nameContainer}
<div className="mx_RoomTile2_badgeContainer">