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

Merge branch 'develop' into travis/new-audio

Browse source
This commit is contained in:
Travis Ralston 2021-06-30 13:25:41 -06:00
commit 12d7be2b6a
672 changed files with 5382 additions and 5638 deletions
Download patch file Download diff file Expand all files Collapse all files

18
src/components/views/rooms/AppsDrawer.js
View file

@ -18,7 +18,7 @@ limitations under the License.
import React from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import {Resizable} from "re-resizable";
import { Resizable } from "re-resizable";
import AppTile from '../elements/AppTile';
import dis from '../../../dispatcher/dispatcher';
@ -26,16 +26,16 @@ import * as sdk from '../../../index';
import * as ScalarMessaging from '../../../ScalarMessaging';
import WidgetUtils from '../../../utils/WidgetUtils';
import WidgetEchoStore from "../../../stores/WidgetEchoStore";
import {IntegrationManagers} from "../../../integrations/IntegrationManagers";
import { IntegrationManagers } from "../../../integrations/IntegrationManagers";
import SettingsStore from "../../../settings/SettingsStore";
import ResizeNotifier from "../../../utils/ResizeNotifier";
import ResizeHandle from "../elements/ResizeHandle";
import Resizer from "../../../resizer/resizer";
import PercentageDistributor from "../../../resizer/distributors/percentage";
import {Container, WidgetLayoutStore} from "../../../stores/widgets/WidgetLayoutStore";
import {clamp, percentageOf, percentageWithin} from "../../../utils/numbers";
import {useStateCallback} from "../../../hooks/useStateCallback";
import {replaceableComponent} from "../../../utils/replaceableComponent";
import { Container, WidgetLayoutStore } from "../../../stores/widgets/WidgetLayoutStore";
import { clamp, percentageOf, percentageWithin } from "../../../utils/numbers";
import { useStateCallback } from "../../../hooks/useStateCallback";
import { replaceableComponent } from "../../../utils/replaceableComponent";
import UIStore from "../../../stores/UIStore";
@replaceableComponent("views.rooms.AppsDrawer")
@ -303,7 +303,7 @@ const PersistentVResizer = ({
});
return <Resizable
size={{height: Math.min(height, maxHeight)}}
size={{ height: Math.min(height, maxHeight) }}
minHeight={minHeight}
maxHeight={maxHeight}
onResizeStart={() => {
@ -317,9 +317,9 @@ const PersistentVResizer = ({
resizeNotifier.stopResizing();
}}
handleWrapperClass={handleWrapperClass}
handleClasses={{bottom: handleClass}}
handleClasses={{ bottom: handleClass }}
className={className}
enable={{bottom: true}}
enable={{ bottom: true }}
>
{ children }
</Resizable>;

15
src/components/views/rooms/Autocomplete.tsx
View file

@ -15,15 +15,15 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
import React, {createRef, KeyboardEvent} from 'react';
import React, { createRef, KeyboardEvent } from 'react';
import classNames from 'classnames';
import {flatMap} from "lodash";
import {ICompletion, ISelectionRange, IProviderCompletions} from '../../../autocomplete/Autocompleter';
import {Room} from 'matrix-js-sdk/src/models/room';
import { flatMap } from "lodash";
import { ICompletion, ISelectionRange, IProviderCompletions } from '../../../autocomplete/Autocompleter';
import { Room } from 'matrix-js-sdk/src/models/room';
import SettingsStore from "../../../settings/SettingsStore";
import Autocompleter from '../../../autocomplete/Autocompleter';
import {replaceableComponent} from "../../../utils/replaceableComponent";
import { replaceableComponent } from "../../../utils/replaceableComponent";
const COMPOSER_SELECTED = 0;
const MAX_PROVIDER_MATCHES = 20;
@ -247,7 +247,7 @@ export default class Autocomplete extends React.PureComponent<IProps, IState> {
};
setSelection(selectionOffset: number) {
this.setState({selectionOffset, hide: false});
this.setState({ selectionOffset, hide: false });
if (this.props.onSelectionChange) {
this.props.onSelectionChange(this.state.completionList[selectionOffset - 1], selectionOffset - 1);
}
@ -273,7 +273,7 @@ export default class Autocomplete extends React.PureComponent<IProps, IState> {
const renderedCompletions = this.state.completions.map((completionResult, i) => {
const completions = completionResult.completions.map((completion, j) => {
const selected = position === this.state.selectionOffset;
const className = classNames('mx_Autocomplete_Completion', {selected});
const className = classNames('mx_Autocomplete_Completion', { selected });
const componentPosition = position;
position++;
@ -291,7 +291,6 @@ export default class Autocomplete extends React.PureComponent<IProps, IState> {
});
});
return completions.length > 0 ? (
<div key={i} className="mx_Autocomplete_ProviderSection">
<div className="mx_Autocomplete_provider_name">{ completionResult.provider.getName() }</div>

4
src/components/views/rooms/AuxPanel.tsx
View file

@ -17,7 +17,7 @@ limitations under the License.
import React from 'react';
import classNames from 'classnames';
import { lexicographicCompare } from 'matrix-js-sdk/src/utils';
import { Room } from 'matrix-js-sdk/src/models/room'
import { Room } from 'matrix-js-sdk/src/models/room';
import { MatrixClientPeg } from "../../../MatrixClientPeg";
import AppsDrawer from './AppsDrawer';
@ -126,7 +126,7 @@ export default class AuxPanel extends React.Component<IProps, IState> {
link,
severity,
stateKey,
})
});
}
}
}

66
src/components/views/rooms/BasicMessageComposer.tsx
View file

@ -147,7 +147,7 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
const enabledChange = this.props.disabled !== prevProps.disabled;
const placeholderChanged = this.props.placeholder !== prevProps.placeholder;
if (this.props.placeholder && (placeholderChanged || enabledChange)) {
const {isEmpty} = this.props.model;
const { isEmpty } = this.props.model;
if (isEmpty) {
this.showPlaceholder();
} else {
@ -157,7 +157,7 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
}
private replaceEmoticon = (caretPosition: DocumentPosition) => {
const {model} = this.props;
const { model } = this.props;
const range = model.startRange(caretPosition);
// expand range max 8 characters backwards from caretPosition,
// as a space to look for an emoticon
@ -174,7 +174,7 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
const data = EMOTICON_TO_EMOJI.get(query) || EMOTICON_TO_EMOJI.get(query.toLowerCase());
if (data) {
const {partCreator} = model;
const { partCreator } = model;
const hasPrecedingSpace = emoticonMatch[0][0] === " ";
// we need the range to only comprise of the emoticon
// because we'll replace the whole range with an emoji,
@ -200,7 +200,7 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
const position = selection instanceof Range ? selection.end : selection;
this.setLastCaretFromPosition(position);
}
const {isEmpty} = this.props.model;
const { isEmpty } = this.props.model;
if (this.props.placeholder) {
if (isEmpty) {
this.showPlaceholder();
@ -211,13 +211,13 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
if (isEmpty) {
this.formatBarRef.current.hide();
}
this.setState({autoComplete: this.props.model.autoComplete});
this.setState({ autoComplete: this.props.model.autoComplete });
this.historyManager.tryPush(this.props.model, selection, inputType, diff);
let isTyping = !this.props.model.isEmpty;
// If the user is entering a command, only consider them typing if it is one which sends a message into the room
if (isTyping && this.props.model.parts[0].type === "command") {
const {cmd} = parseCommandString(this.props.model.parts[0].text);
const { cmd } = parseCommandString(this.props.model.parts[0].text);
const command = CommandMap.get(cmd);
if (!command || !command.isEnabled() || command.category !== CommandCategories.messages) {
isTyping = false;
@ -263,10 +263,10 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
const isSafari = ua.includes('safari/') && !ua.includes('chrome/');
if (isSafari) {
this.onInput({inputType: "insertCompositionText"});
this.onInput({ inputType: "insertCompositionText" });
} else {
Promise.resolve().then(() => {
this.onInput({inputType: "insertCompositionText"});
this.onInput({ inputType: "insertCompositionText" });
});
}
};
@ -282,7 +282,7 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
const selection = document.getSelection();
const text = selection.toString();
if (text) {
const {model} = this.props;
const { model } = this.props;
const range = getRangeForSelection(this.editorRef.current, model, selection);
const selectedParts = range.parts.map(p => p.serialize());
event.clipboardData.setData("application/x-element-composer", JSON.stringify(selectedParts));
@ -311,8 +311,8 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
return true;
}
const {model} = this.props;
const {partCreator} = model;
const { model } = this.props;
const { partCreator } = model;
const partsText = event.clipboardData.getData("application/x-element-composer");
let parts;
if (partsText) {
@ -335,13 +335,13 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
}
this.modifiedFlag = true;
const sel = document.getSelection();
const {caret, text} = getCaretOffsetAndText(this.editorRef.current, sel);
const { caret, text } = getCaretOffsetAndText(this.editorRef.current, sel);
this.props.model.update(text, event.inputType, caret);
};
private insertText(textToInsert: string, inputType = "insertText") {
const sel = document.getSelection();
const {caret, text} = getCaretOffsetAndText(this.editorRef.current, sel);
const { caret, text } = getCaretOffsetAndText(this.editorRef.current, sel);
const newText = text.substr(0, caret.offset) + textToInsert + text.substr(caret.offset);
caret.offset += textToInsert.length;
this.modifiedFlag = true;
@ -354,7 +354,7 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
// we need to recalculate it, to be able to know where to insert content after
// losing focus
private setLastCaretFromPosition(position: DocumentPosition) {
const {model} = this.props;
const { model } = this.props;
this._isCaretAtEnd = position.isAtEnd(model);
this.lastCaret = position.asOffset(model);
this.lastSelection = cloneSelection(document.getSelection());
@ -370,7 +370,7 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
const selection = document.getSelection();
if (!this.lastSelection || !selectionEquals(this.lastSelection, selection)) {
this.lastSelection = cloneSelection(selection);
const {caret, text} = getCaretOffsetAndText(this.editorRef.current, selection);
const { caret, text } = getCaretOffsetAndText(this.editorRef.current, selection);
this.lastCaret = caret;
this._isCaretAtEnd = caret.offset === text.length;
}
@ -409,7 +409,7 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
};
private onSelectionChange = () => {
const {isEmpty} = this.props.model;
const { isEmpty } = this.props.model;
this.refreshLastCaretIfNeeded();
const selection = document.getSelection();
@ -446,7 +446,7 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
break;
case MessageComposerAction.EditRedo:
if (this.historyManager.canRedo()) {
const {parts, caret} = this.historyManager.redo();
const { parts, caret } = this.historyManager.redo();
// pass matching inputType so historyManager doesn't push echo
// when invoked from rerender callback.
model.reset(parts, caret, "historyRedo");
@ -455,7 +455,7 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
break;
case MessageComposerAction.EditUndo:
if (this.historyManager.canUndo()) {
const {parts, caret} = this.historyManager.undo(this.props.model);
const { parts, caret } = this.historyManager.undo(this.props.model);
// pass matching inputType so historyManager doesn't push echo
// when invoked from rerender callback.
model.reset(parts, caret, "historyUndo");
@ -525,8 +525,8 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
private async tabCompleteName() {
try {
await new Promise<void>(resolve => this.setState({showVisualBell: false}, resolve));
const {model} = this.props;
await new Promise<void>(resolve => this.setState({ showVisualBell: false }, resolve));
const { model } = this.props;
const caret = this.getCaret();
const position = model.positionForOffset(caret.offset, caret.atNodeEnd);
const range = model.startRange(position);
@ -537,7 +537,7 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
part.type === "command"
);
});
const {partCreator} = model;
const { partCreator } = model;
// await for auto-complete to be open
await model.transform(() => {
const addedLen = range.replace([partCreator.pillCandidate(range.text)]);
@ -548,7 +548,7 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
if (model.autoComplete) {
await model.autoComplete.startSelection();
if (!model.autoComplete.hasSelection()) {
this.setState({showVisualBell: true});
this.setState({ showVisualBell: true });
model.autoComplete.close();
}
}
@ -569,7 +569,7 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
private onAutoCompleteSelectionChange = (completion: ICompletion, completionIndex: number) => {
this.modifiedFlag = true;
this.props.model.autoComplete.onComponentSelectionChange(completion);
this.setState({completionIndex});
this.setState({ completionIndex });
};
private configureEmoticonAutoReplace = () => {
@ -599,7 +599,7 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
// not really, but we could not serialize the parts, and just change the autoCompleter
partCreator.setAutoCompleteCreator(getAutoCompleteCreator(
() => this.autocompleteRef.current,
query => new Promise(resolve => this.setState({query}, resolve)),
query => new Promise(resolve => this.setState({ query }, resolve)),
));
// initial render of model
this.updateEditorState(this.getInitialCaretPosition());
@ -666,7 +666,7 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
query={query}
onConfirm={this.onAutoCompleteConfirm}
onSelectionChange={this.onAutoCompleteSelectionChange}
selection={{beginning: true, end: queryLen, start: queryLen}}
selection={{ beginning: true, end: queryLen, start: queryLen }}
room={this.props.room}
/>
</div>);
@ -685,7 +685,7 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
quote: ctrlShortcutLabel(">"),
};
const {completionIndex} = this.state;
const { completionIndex } = this.state;
return (<div className={wrapperClasses}>
{ autoComplete }
@ -719,8 +719,8 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
}
public insertMention(userId: string) {
const {model} = this.props;
const {partCreator} = model;
const { model } = this.props;
const { partCreator } = model;
const member = this.props.room.getMember(userId);
const displayName = member ?
member.rawDisplayName : userId;
@ -737,9 +737,9 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
}
public insertQuotedMessage(event: MatrixEvent) {
const {model} = this.props;
const {partCreator} = model;
const quoteParts = parseEvent(event, partCreator, {isQuotedMessage: true});
const { model } = this.props;
const { partCreator } = model;
const quoteParts = parseEvent(event, partCreator, { isQuotedMessage: true });
// add two newlines
quoteParts.push(partCreator.newline());
quoteParts.push(partCreator.newline());
@ -752,8 +752,8 @@ export default class BasicMessageEditor extends React.Component<IProps, IState>
}
public insertPlaintext(text: string) {
const {model} = this.props;
const {partCreator} = model;
const { model } = this.props;
const { partCreator } = model;
const caret = this.getCaret();
const position = model.positionForOffset(caret.offset, caret.atNodeEnd);
model.transform(() => {

8
src/components/views/rooms/E2EIcon.js
View file

@ -15,11 +15,11 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
import React, {useState} from "react";
import React, { useState } from "react";
import PropTypes from "prop-types";
import classNames from 'classnames';
import {_t, _td} from '../../../languageHandler';
import { _t, _td } from '../../../languageHandler';
import AccessibleButton from "../elements/AccessibleButton";
import Tooltip from "../elements/Tooltip";
@ -42,7 +42,7 @@ const crossSigningRoomTitles = {
[E2E_STATE.VERIFIED]: _td("Everyone in this room is verified"),
};
const E2EIcon = ({isUser, status, className, size, onClick, hideTooltip, bordered}) => {
const E2EIcon = ({ isUser, status, className, size, onClick, hideTooltip, bordered }) => {
const [hover, setHover] = useState(false);
const classes = classNames({
@ -62,7 +62,7 @@ const E2EIcon = ({isUser, status, className, size, onClick, hideTooltip, bordere
let style;
if (size) {
style = {width: `${size}px`, height: `${size}px`};
style = { width: `${size}px`, height: `${size}px` };
}
const onMouseOver = () => setHover(true);

26
src/components/views/rooms/EditMessageComposer.js
View file

@ -88,7 +88,7 @@ function createEditContent(model, editedEvent) {
body: `${plainPrefix} * ${body}`,
};
const formattedBody = htmlSerializeIfNeeded(model, {forceHTML: isReply});
const formattedBody = htmlSerializeIfNeeded(model, { forceHTML: isReply });
if (formattedBody) {
newContent.format = "org.matrix.custom.html";
newContent.formatted_body = formattedBody;
@ -156,7 +156,7 @@ export default class EditMessageComposer extends React.Component {
const previousEvent = findEditableEvent(this._getRoom(), false,
this.props.editState.getEvent().getId());
if (previousEvent) {
dis.dispatch({action: 'edit_event', event: previousEvent});
dis.dispatch({ action: 'edit_event', event: previousEvent });
event.preventDefault();
}
break;
@ -167,10 +167,10 @@ export default class EditMessageComposer extends React.Component {
}
const nextEvent = findEditableEvent(this._getRoom(), true, this.props.editState.getEvent().getId());
if (nextEvent) {
dis.dispatch({action: 'edit_event', event: nextEvent});
dis.dispatch({ action: 'edit_event', event: nextEvent });
} else {
this._clearStoredEditorState();
dis.dispatch({action: 'edit_event', event: null});
dis.dispatch({ action: 'edit_event', event: null });
dis.fire(Action.FocusComposer);
}
event.preventDefault();
@ -189,7 +189,7 @@ export default class EditMessageComposer extends React.Component {
_cancelEdit = () => {
this._clearStoredEditorState();
dis.dispatch({action: "edit_event", event: null});
dis.dispatch({ action: "edit_event", event: null });
dis.fire(Action.FocusComposer);
}
@ -201,7 +201,7 @@ export default class EditMessageComposer extends React.Component {
const json = localStorage.getItem(this._editorStateKey);
if (json) {
try {
const {parts: serializedParts} = JSON.parse(json);
const { parts: serializedParts } = JSON.parse(json);
const parts = serializedParts.map(p => partCreator.deserializePart(p));
return parts;
} catch (e) {
@ -264,7 +264,7 @@ export default class EditMessageComposer extends React.Component {
}
return text + part.text;
}, "");
const {cmd, args} = getCommand(commandText);
const { cmd, args } = getCommand(commandText);
return [cmd, args, commandText];
}
@ -332,11 +332,11 @@ export default class EditMessageComposer extends React.Component {
} else {
// ask the user if their unknown command should be sent as a message
const QuestionDialog = sdk.getComponent("dialogs.QuestionDialog");
const {finished} = Modal.createTrackedDialog("Unknown command", "", QuestionDialog, {
const { finished } = Modal.createTrackedDialog("Unknown command", "", QuestionDialog, {
title: _t("Unknown Command"),
description: <div>
<p>
{ _t("Unrecognised command: %(commandText)s", {commandText}) }
{ _t("Unrecognised command: %(commandText)s", { commandText }) }
</p>
<p>
{ _t("You can use <code>/help</code> to list available commands. " +
@ -361,13 +361,13 @@ export default class EditMessageComposer extends React.Component {
this._cancelPreviousPendingEdit();
const prom = this.context.sendMessage(roomId, editContent);
this._clearStoredEditorState();
dis.dispatch({action: "message_sent"});
dis.dispatch({ action: "message_sent" });
CountlyAnalytics.instance.trackSendMessage(startTime, prom, roomId, true, false, editContent);
}
}
// close the event editing and focus composer
dis.dispatch({action: "edit_event", event: null});
dis.dispatch({ action: "edit_event", event: null });
dis.fire(Action.FocusComposer);
};
@ -404,7 +404,7 @@ export default class EditMessageComposer extends React.Component {
}
_createEditorModel() {
const {editState} = this.props;
const { editState } = this.props;
const room = this._getRoom();
const partCreator = new CommandPartCreator(room, this.context);
let parts;
@ -421,7 +421,7 @@ export default class EditMessageComposer extends React.Component {
}
_getInitialCaretPosition() {
const {editState} = this.props;
const { editState } = this.props;
let caretPosition;
if (editState.hasEditorState() && editState.getCaret()) {
// if restoring state from a previous editor,

4
src/components/views/rooms/EntityTile.tsx
View file

@ -33,7 +33,7 @@ export enum PowerStatus {
const PowerLabel: Record<PowerStatus, string> = {
[PowerStatus.Admin]: _td("Admin"),
[PowerStatus.Moderator]: _td("Mod"),
}
};
const PRESENCE_CLASS = {
"offline": "mx_EntityTile_offline",
@ -116,7 +116,7 @@ export default class EntityTile extends React.PureComponent<IProps, IState> {
mainClassNames[presenceClass] = true;
let nameEl;
const {name} = this.props;
const { name } = this.props;
if (!this.props.suppressOnHover) {
const activeAgo = this.props.presenceLastActiveAgo ?

34
src/components/views/rooms/EventTile.tsx
View file

@ -15,7 +15,7 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
import React from 'react';
import React, { createRef } from 'react';
import classNames from "classnames";
import { EventType } from "matrix-js-sdk/src/@types/event";
import { EventStatus, MatrixEvent } from "matrix-js-sdk/src/models/event";
@ -176,12 +176,19 @@ const MAX_READ_AVATARS = 5;
// | '--------------------------------------' |
// '----------------------------------------------------------'
interface IReadReceiptProps {
export interface IReadReceiptProps {
userId: string;
roomMember: RoomMember;
ts: number;
}
export enum TileShape {
Notif = "notif",
FileGrid = "file_grid",
Reply = "reply",
ReplyPreview = "reply_preview",
}
interface IProps {
// the MatrixEvent to show
mxEvent: MatrixEvent;
@ -248,7 +255,7 @@ interface IProps {
// It could also be done by subclassing EventTile, but that'd be quite
// boiilerplatey. So just make the necessary render decisions conditional
// for now.
tileShape?: 'notif' | 'file_grid' | 'reply' | 'reply_preview';
tileShape?: TileShape;
// show twelve hour timestamps
isTwelveHour?: boolean;
@ -306,10 +313,11 @@ interface IState {
export default class EventTile extends React.Component<IProps, IState> {
private suppressReadReceiptAnimation: boolean;
private isListeningForReceipts: boolean;
private ref: React.RefObject<unknown>;
private tile = React.createRef();
private replyThread = React.createRef();
public readonly ref = createRef<HTMLElement>();
static defaultProps = {
// no-op function because onHeightChanged is optional yet some sub-components assume its existence
onHeightChanged: function() {},
@ -345,8 +353,6 @@ export default class EventTile extends React.Component<IProps, IState> {
// to determine if we've already subscribed and use a combination of other flags to find
// out if we should even be subscribed at all.
this.isListeningForReceipts = false;
this.ref = React.createRef();
}
/**
@ -723,7 +729,7 @@ export default class EventTile extends React.Component<IProps, IState> {
{ avatars }
</span>
</div>
)
);
}
onSenderProfileClick = event => {
@ -870,7 +876,7 @@ export default class EventTile extends React.Component<IProps, IState> {
// This shouldn't happen: the caller should check we support this type
// before trying to instantiate us
if (!tileHandler) {
const {mxEvent} = this.props;
const { mxEvent } = this.props;
console.warn(`Event type not supported: type:${mxEvent.getType()} isState:${mxEvent.isState()}`);
return <div className="mx_EventTile mx_EventTile_info mx_MNoticeBody">
<div className="mx_EventTile_line">
@ -1017,7 +1023,7 @@ export default class EventTile extends React.Component<IProps, IState> {
_t(
'<requestLink>Re-request encryption keys</requestLink> from your other sessions.',
{},
{'requestLink': (sub) => <a onClick={this.onRequestKeysClick}>{ sub }</a>},
{ 'requestLink': (sub) => <a onClick={this.onRequestKeysClick}>{ sub }</a> },
);
const TooltipButton = sdk.getComponent('elements.TooltipButton');
@ -1207,7 +1213,7 @@ export default class EventTile extends React.Component<IProps, IState> {
avatar,
])
)
);
}
}
}
@ -1290,11 +1296,11 @@ class E2ePadlock extends React.Component<IE2ePadlockProps, IE2ePadlockState> {
}
onHoverStart = () => {
this.setState({hover: true});
this.setState({ hover: true });
};
onHoverEnd = () => {
this.setState({hover: false});
this.setState({ hover: false });
};
render() {
@ -1332,11 +1338,11 @@ class SentReceipt extends React.PureComponent<ISentReceiptProps, ISentReceiptSta
}
onHoverStart = () => {
this.setState({hover: true});
this.setState({ hover: true });
};
onHoverEnd = () => {
this.setState({hover: false});
this.setState({ hover: false });
};
render() {

4
src/components/views/rooms/ExtraTile.tsx
View file

@ -46,11 +46,11 @@ export default class ExtraTile extends React.Component<IProps, IState> {
}
private onTileMouseEnter = () => {
this.setState({hover: true});
this.setState({ hover: true });
};
private onTileMouseLeave = () => {
this.setState({hover: false});
this.setState({ hover: false });
};
public render(): React.ReactElement {

10
src/components/views/rooms/LinkPreviewWidget.js
View file

@ -15,18 +15,18 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
import React, {createRef} from 'react';
import React, { createRef } from 'react';
import PropTypes from 'prop-types';
import { AllHtmlEntities } from 'html-entities';
import {linkifyElement} from '../../../HtmlUtils';
import { linkifyElement } from '../../../HtmlUtils';
import SettingsStore from "../../../settings/SettingsStore";
import {MatrixClientPeg} from "../../../MatrixClientPeg";
import { MatrixClientPeg } from "../../../MatrixClientPeg";
import * as sdk from "../../../index";
import Modal from "../../../Modal";
import * as ImageUtils from "../../../ImageUtils";
import { _t } from "../../../languageHandler";
import {replaceableComponent} from "../../../utils/replaceableComponent";
import {mediaFromMxc} from "../../../customisations/Media";
import { replaceableComponent } from "../../../utils/replaceableComponent";
import { mediaFromMxc } from "../../../customisations/Media";
@replaceableComponent("views.rooms.LinkPreviewWidget")
export default class LinkPreviewWidget extends React.Component {

10
src/components/views/rooms/MemberList.tsx
View file

@ -148,7 +148,7 @@ export default class MemberList extends React.Component<IProps, IState> {
const room = cli.getRoom(this.props.roomId);
const membership = room && room.getMyMembership();
if (membership === "join") {
this.setState({loading: true});
this.setState({ loading: true });
try {
await room.loadMembersIfNeeded();
} catch (ex) {/* already logged in RoomView */}
@ -242,7 +242,7 @@ export default class MemberList extends React.Component<IProps, IState> {
}, 500);
private updateListNow(): void {
const members = this.roomMembers()
const members = this.roomMembers();
this.setState({
loading: false,
@ -471,7 +471,7 @@ export default class MemberList extends React.Component<IProps, IState> {
}
private getChildrenJoined = (start: number, end: number): Array<JSX.Element> => {
return this.makeMemberTiles(this.state.filteredJoinedMembers.slice(start, end))
return this.makeMemberTiles(this.state.filteredJoinedMembers.slice(start, end));
};
private getChildCountJoined = (): number => this.state.filteredJoinedMembers.length;
@ -487,7 +487,7 @@ export default class MemberList extends React.Component<IProps, IState> {
private getChildCountInvited = (): number => {
return this.state.filteredInvitedMembers.length + (this.getPending3PidInvites() || []).length;
}
};
render() {
if (this.state.loading) {
@ -582,7 +582,7 @@ export default class MemberList extends React.Component<IProps, IState> {
onInviteButtonClick = (): void => {
if (MatrixClientPeg.get().isGuest()) {
dis.dispatch({action: 'require_registration'});
dis.dispatch({ action: 'require_registration' });
return;
}

2
src/components/views/rooms/MemberTile.tsx
View file

@ -20,7 +20,7 @@ import React from 'react';
import dis from "../../../dispatcher/dispatcher";
import { _t } from '../../../languageHandler';
import { MatrixClientPeg } from "../../../MatrixClientPeg";
import {Action} from "../../../dispatcher/actions";
import { Action } from "../../../dispatcher/actions";
import { replaceableComponent } from "../../../utils/replaceableComponent";
import { RoomMember } from "matrix-js-sdk/src/models/room-member";
import { MatrixEvent } from "matrix-js-sdk/src/models/event";

38
src/components/views/rooms/MessageComposer.tsx
View file

@ -69,7 +69,7 @@ function SendButton(props: ISendButtonProps) {
);
}
const EmojiButton = ({addEmoji}) => {
const EmojiButton = ({ addEmoji }) => {
const [menuDisplayed, button, openMenu, closeMenu] = useContextMenu();
let contextMenu;
@ -132,11 +132,11 @@ class UploadButton extends React.Component<IUploadButtonProps> {
private onUploadClick = () => {
if (MatrixClientPeg.get().isGuest()) {
dis.dispatch({action: 'require_registration'});
dis.dispatch({ action: 'require_registration' });
return;
}
this.uploadInput.current.click();
}
};
private onUploadFileInputChange = (ev: React.ChangeEvent<HTMLInputElement>) => {
if (ev.target.files.length === 0) return;
@ -157,10 +157,10 @@ class UploadButton extends React.Component<IUploadButtonProps> {
// to empty.
// NB. we need to set 'value': the 'files' property is immutable.
ev.target.value = '';
}
};
render() {
const uploadInputStyle = {display: 'none'};
const uploadInputStyle = { display: 'none' };
return (
<AccessibleTooltipButton
className="mx_MessageComposer_button mx_MessageComposer_upload"
@ -237,7 +237,7 @@ export default class MessageComposer extends React.Component<IProps, IState> {
// if we have the member already, do that
const me = this.props.room.getMember(MatrixClientPeg.get().getUserId());
if (me) {
this.setState({me});
this.setState({ me });
return;
}
// Otherwise, wait for member loading to finish and then update the member for the avatar.
@ -245,7 +245,7 @@ export default class MessageComposer extends React.Component<IProps, IState> {
// will return the promise for the existing operation
this.props.room.loadMembersIfNeeded().then(() => {
const me = this.props.room.getMember(MatrixClientPeg.get().getUserId());
this.setState({me});
this.setState({ me });
});
}
@ -261,12 +261,12 @@ export default class MessageComposer extends React.Component<IProps, IState> {
if (ev.getRoomId() !== this.props.room.roomId) return;
if (ev.getType() === 'm.room.tombstone') {
this.setState({tombstone: this.getRoomTombstone()});
this.setState({ tombstone: this.getRoomTombstone() });
}
if (ev.getType() === 'm.room.power_levels') {
this.setState({canSendMessages: this.props.room.maySendMessage()});
this.setState({ canSendMessages: this.props.room.maySendMessage() });
}
}
};
private getRoomTombstone() {
return this.props.room.currentState.getStateEvents('m.room.tombstone', '');
@ -300,7 +300,7 @@ export default class MessageComposer extends React.Component<IProps, IState> {
viaServers: viaServers,
},
});
}
};
private renderPlaceholderText = () => {
if (this.props.replyToEvent) {
@ -316,7 +316,7 @@ export default class MessageComposer extends React.Component<IProps, IState> {
return _t('Send a message…');
}
}
}
};
addEmoji(emoji: string) {
dis.dispatch<ComposerInsertPayload>({
@ -335,24 +335,24 @@ export default class MessageComposer extends React.Component<IProps, IState> {
// XXX: Private function access
this.messageComposerInput._sendMessage();
}
};
onChange = (model) => {
this.setState({
isComposerEmpty: model.isEmpty,
});
}
};
private onVoiceStoreUpdate = () => {
const recording = VoiceRecordingStore.instance.activeRecording;
this.setState({haveRecording: !!recording});
this.setState({ haveRecording: !!recording });
if (recording) {
// We show a little heads up that the recording is about to automatically end soon. The 3s
// display time is completely arbitrary. Note that we don't need to deregister the listener
// because the recording instance will clean that up for us.
recording.on(RecordingState.EndingSoon, ({secondsLeft}) => {
this.setState({recordingTimeLeftSeconds: secondsLeft});
setTimeout(() => this.setState({recordingTimeLeftSeconds: null}), 3000);
recording.on(RecordingState.EndingSoon, ({ secondsLeft }) => {
this.setState({ recordingTimeLeftSeconds: secondsLeft });
setTimeout(() => this.setState({ recordingTimeLeftSeconds: null }), 3000);
});
}
};
@ -442,7 +442,7 @@ export default class MessageComposer extends React.Component<IProps, IState> {
const secondsLeft = Math.round(this.state.recordingTimeLeftSeconds);
if (secondsLeft) {
recordingTooltip = <Tooltip
label={_t("%(seconds)ss left", {seconds: secondsLeft})}
label={_t("%(seconds)ss left", { seconds: secondsLeft })}
alignment={Alignment.Top} yOffset={-50}
/>;
}

8
src/components/views/rooms/MessageComposerFormatBar.js
View file

@ -19,7 +19,7 @@ import PropTypes from 'prop-types';
import { _t } from '../../../languageHandler';
import classNames from 'classnames';
import AccessibleTooltipButton from "../elements/AccessibleTooltipButton";
import {replaceableComponent} from "../../../utils/replaceableComponent";
import { replaceableComponent } from "../../../utils/replaceableComponent";
@replaceableComponent("views.rooms.MessageComposerFormatBar")
export default class MessageComposerFormatBar extends React.PureComponent {
@ -30,7 +30,7 @@ export default class MessageComposerFormatBar extends React.PureComponent {
constructor(props) {
super(props);
this.state = {visible: false};
this.state = { visible: false };
}
render() {
@ -47,7 +47,7 @@ export default class MessageComposerFormatBar extends React.PureComponent {
}
showAt(selectionRect) {
this.setState({visible: true});
this.setState({ visible: true });
const parentRect = this._formatBarRef.parentElement.getBoundingClientRect();
this._formatBarRef.style.left = `${selectionRect.left - parentRect.left}px`;
// 12 is half the height of the bar (e.g. to center it) and 16 is an offset that felt ok.
@ -55,7 +55,7 @@ export default class MessageComposerFormatBar extends React.PureComponent {
}
hide() {
this.setState({visible: false});
this.setState({ visible: false });
}
}

2
src/components/views/rooms/NewRoomIntro.tsx
View file

@ -45,7 +45,7 @@ function hasExpectedEncryptionSettings(matrixClient: MatrixClient, room: Room):
const NewRoomIntro = () => {
const cli = useContext(MatrixClientContext);
const {room, roomId} = useContext(RoomContext);
const { room, roomId } = useContext(RoomContext);
const dmPartner = DMRoomMap.shared().getUserIdForRoomId(roomId);
let body;

6
src/components/views/rooms/NotificationBadge.tsx
View file

@ -21,7 +21,7 @@ import SettingsStore from "../../../settings/SettingsStore";
import AccessibleButton from "../elements/AccessibleButton";
import { XOR } from "../../../@types/common";
import { NOTIFICATION_STATE_UPDATE, NotificationState } from "../../../stores/notifications/NotificationState";
import {replaceableComponent} from "../../../utils/replaceableComponent";
import { replaceableComponent } from "../../../utils/replaceableComponent";
interface IProps {
notification: NotificationState;
@ -86,7 +86,7 @@ export default class NotificationBadge extends React.PureComponent<XOR<IProps, I
}
private countPreferenceChanged = () => {
this.setState({showCounts: SettingsStore.getValue("Notifications.alwaysShowBadgeCounts", this.roomId)});
this.setState({ showCounts: SettingsStore.getValue("Notifications.alwaysShowBadgeCounts", this.roomId) });
};
private onNotificationUpdate = () => {
@ -95,7 +95,7 @@ export default class NotificationBadge extends React.PureComponent<XOR<IProps, I
public render(): React.ReactElement {
/* eslint @typescript-eslint/no-unused-vars: ["error", { "ignoreRestSiblings": true }] */
const {notification, forceCount, roomId, onClick, ...props} = this.props;
const { notification, forceCount, roomId, onClick, ...props } = this.props;
// Don't show a badge if we don't need to
if (notification.isIdle) return null;

16
src/components/views/rooms/ReadReceiptMarker.js
View file

@ -15,14 +15,14 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
import React, {createRef} from 'react';
import React, { createRef } from 'react';
import PropTypes from 'prop-types';
import { _t } from '../../../languageHandler';
import {formatDate} from '../../../DateUtils';
import { formatDate } from '../../../DateUtils';
import NodeAnimator from "../../../NodeAnimator";
import * as sdk from "../../../index";
import {toPx} from "../../../utils/units";
import {replaceableComponent} from "../../../utils/replaceableComponent";
import { toPx } from "../../../utils/units";
import { replaceableComponent } from "../../../utils/replaceableComponent";
@replaceableComponent("views.rooms.ReadReceiptMarker")
export default class ReadReceiptMarker extends React.PureComponent {
@ -173,15 +173,15 @@ export default class ReadReceiptMarker extends React.PureComponent {
if (!this.props.member || this.props.fallbackUserId === this.props.member.rawDisplayName) {
title = _t(
"Seen by %(userName)s at %(dateTime)s",
{userName: this.props.fallbackUserId,
dateTime: dateString},
{ userName: this.props.fallbackUserId,
dateTime: dateString },
);
} else {
title = _t(
"Seen by %(displayName)s (%(userName)s) at %(dateTime)s",
{displayName: this.props.member.rawDisplayName,
{ displayName: this.props.member.rawDisplayName,
userName: this.props.fallbackUserId,
dateTime: dateString},
dateTime: dateString },
);
}
}

6
src/components/views/rooms/ReplyPreview.js
View file

@ -21,9 +21,9 @@ import { _t } from '../../../languageHandler';
import RoomViewStore from '../../../stores/RoomViewStore';
import SettingsStore from "../../../settings/SettingsStore";
import PropTypes from "prop-types";
import {RoomPermalinkCreator} from "../../../utils/permalinks/Permalinks";
import {UIFeature} from "../../../settings/UIFeature";
import {replaceableComponent} from "../../../utils/replaceableComponent";
import { RoomPermalinkCreator } from "../../../utils/permalinks/Permalinks";
import { UIFeature } from "../../../settings/UIFeature";
import { replaceableComponent } from "../../../utils/replaceableComponent";
function cancelQuoting() {
dis.dispatch({

8
src/components/views/rooms/RoomBreadcrumbs.tsx
View file

@ -71,13 +71,13 @@ export default class RoomBreadcrumbs extends React.PureComponent<IProps, IState>
// The second update, on the next available tick, causes the "enter" animation to start
// again and this time we want to show the newest breadcrumb because it'll be hidden
// off screen for the animation.
this.setState({doAnimation: false, skipFirst: true});
setTimeout(() => this.setState({doAnimation: true, skipFirst: false}), 0);
this.setState({ doAnimation: false, skipFirst: true });
setTimeout(() => this.setState({ doAnimation: true, skipFirst: false }), 0);
};
private viewRoom = (room: Room, index: number) => {
Analytics.trackEvent("Breadcrumbs", "click_node", String(index));
defaultDispatcher.dispatch({action: "view_room", room_id: room.roomId});
defaultDispatcher.dispatch({ action: "view_room", room_id: room.roomId });
};
public render(): React.ReactElement {
@ -87,7 +87,7 @@ export default class RoomBreadcrumbs extends React.PureComponent<IProps, IState>
className="mx_RoomBreadcrumbs_crumb"
key={r.roomId}
onClick={() => this.viewRoom(r, i)}
aria-label={_t("Room %(name)s", {name: r.name})}
aria-label={_t("Room %(name)s", { name: r.name })}
title={r.name}
tooltipClassName="mx_RoomBreadcrumbs_Tooltip"
>

4
src/components/views/rooms/RoomDetailList.js
View file

@ -21,8 +21,8 @@ import { _t } from '../../../languageHandler';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import {roomShape} from './RoomDetailRow';
import {replaceableComponent} from "../../../utils/replaceableComponent";
import { roomShape } from './RoomDetailRow';
import { replaceableComponent } from "../../../utils/replaceableComponent";
@replaceableComponent("views.rooms.RoomDetailList")
export default class RoomDetailList extends React.Component {

6
src/components/views/rooms/RoomDetailRow.js
View file

@ -15,12 +15,12 @@ limitations under the License.
*/
import * as sdk from '../../../index';
import React, {createRef} from 'react';
import React, { createRef } from 'react';
import { _t } from '../../../languageHandler';
import { linkifyElement } from '../../../HtmlUtils';
import PropTypes from 'prop-types';
import {replaceableComponent} from "../../../utils/replaceableComponent";
import {mediaFromMxc} from "../../../customisations/Media";
import { replaceableComponent } from "../../../utils/replaceableComponent";
import { mediaFromMxc } from "../../../customisations/Media";
export function getDisplayAliasForRoom(room) {
return room.canonicalAlias || (room.aliases ? room.aliases[0] : "");

2
src/components/views/rooms/RoomHeader.js
View file

@ -74,7 +74,7 @@ export default class RoomHeader extends React.Component {
};
_rateLimitedUpdate = new RateLimitedFunc(function() {
/* eslint-disable babel/no-invalid-this */
/* eslint-disable @babel/no-invalid-this */
this.forceUpdate();
}, 500);

18
src/components/views/rooms/RoomList.tsx
View file

@ -45,9 +45,9 @@ import { objectShallowClone, objectWithOnly } from "../../../utils/objects";
import { IconizedContextMenuOption, IconizedContextMenuOptionList } from "../context_menus/IconizedContextMenu";
import AccessibleButton from "../elements/AccessibleButton";
import { CommunityPrototypeStore } from "../../../stores/CommunityPrototypeStore";
import SpaceStore, {ISuggestedRoom, SUGGESTED_ROOMS} from "../../../stores/SpaceStore";
import {showAddExistingRooms, showCreateNewRoom, showSpaceInvite} from "../../../utils/space";
import {replaceableComponent} from "../../../utils/replaceableComponent";
import SpaceStore, { ISuggestedRoom, SUGGESTED_ROOMS } from "../../../stores/SpaceStore";
import { showAddExistingRooms, showCreateNewRoom, showSpaceInvite } from "../../../utils/space";
import { replaceableComponent } from "../../../utils/replaceableComponent";
import RoomAvatar from "../avatars/RoomAvatar";
interface IProps {
@ -119,7 +119,7 @@ const TAG_AESTHETICS: ITagAestheticsMap = {
defaultHidden: false,
addRoomLabel: _td("Start chat"),
onAddRoom: (dispatcher?: Dispatcher<ActionPayload>) => {
(dispatcher || defaultDispatcher).dispatch({action: 'view_create_chat'});
(dispatcher || defaultDispatcher).dispatch({ action: 'view_create_chat' });
},
},
[DefaultTagID.Untagged]: {
@ -180,7 +180,7 @@ const TAG_AESTHETICS: ITagAestheticsMap = {
e.preventDefault();
e.stopPropagation();
onFinished();
defaultDispatcher.dispatch({action: "view_create_room"});
defaultDispatcher.dispatch({ action: "view_create_room" });
}}
/>
<IconizedContextMenuOption
@ -356,7 +356,7 @@ export default class RoomList extends React.PureComponent<IProps, IState> {
const newSublists = objectWithOnly(newLists, newListIds);
const sublists = objectShallowClone(newSublists, (k, v) => arrayFastClone(v));
this.setState({sublists, isNameFiltering}, () => {
this.setState({ sublists, isNameFiltering }, () => {
this.props.onResize();
});
}
@ -495,7 +495,7 @@ export default class RoomList extends React.PureComponent<IProps, IState> {
resizeNotifier={this.props.resizeNotifier}
alwaysVisible={ALWAYS_VISIBLE_TAGS.includes(orderedTagId)}
onListCollapse={this.props.onListCollapse}
/>
/>;
});
}
@ -542,7 +542,7 @@ export default class RoomList extends React.PureComponent<IProps, IState> {
</AccessibleButton> }
</div>;
} else if (Object.values(this.state.sublists).some(list => list.length > 0)) {
const unfilteredLists = RoomListStore.instance.unfilteredLists
const unfilteredLists = RoomListStore.instance.unfilteredLists;
const unfilteredRooms = unfilteredLists[DefaultTagID.Untagged] || [];
const unfilteredHistorical = unfilteredLists[DefaultTagID.Archived] || [];
const unfilteredFavourite = unfilteredLists[DefaultTagID.Favourite] || [];
@ -572,7 +572,7 @@ export default class RoomList extends React.PureComponent<IProps, IState> {
const sublists = this.renderSublists();
return (
<RovingTabIndexProvider handleHomeEnd={true} onKeyDown={this.props.onKeyDown}>
{({onKeyDownHandler}) => (
{({ onKeyDownHandler }) => (
<div
onFocus={this.props.onFocus}
onBlur={this.props.onBlur}

4
src/components/views/rooms/RoomListNumResults.tsx
View file

@ -14,11 +14,11 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
import React, {useEffect, useState} from "react";
import React, { useEffect, useState } from "react";
import { _t } from "../../../languageHandler";
import RoomListStore, { LISTS_UPDATE_EVENT } from "../../../stores/room-list/RoomListStore";
import {useEventEmitter} from "../../../hooks/useEventEmitter";
import { useEventEmitter } from "../../../hooks/useEventEmitter";
import SpaceStore from "../../../stores/SpaceStore";
interface IProps {

50
src/components/views/rooms/RoomPreviewBar.js
View file

@ -17,14 +17,14 @@ limitations under the License.
import React from 'react';
import PropTypes from 'prop-types';
import * as sdk from '../../../index';
import {MatrixClientPeg} from '../../../MatrixClientPeg';
import { MatrixClientPeg } from '../../../MatrixClientPeg';
import dis from '../../../dispatcher/dispatcher';
import classNames from 'classnames';
import { _t } from '../../../languageHandler';
import SdkConfig from "../../../SdkConfig";
import IdentityAuthClient from '../../../IdentityAuthClient';
import {CommunityPrototypeStore} from "../../../stores/CommunityPrototypeStore";
import {UPDATE_EVENT} from "../../../stores/AsyncStore";
import { CommunityPrototypeStore } from "../../../stores/CommunityPrototypeStore";
import { UPDATE_EVENT } from "../../../stores/AsyncStore";
import { replaceableComponent } from "../../../utils/replaceableComponent";
import InviteReason from "../elements/InviteReason";
@ -114,7 +114,7 @@ export default class RoomPreviewBar extends React.Component {
// invited, fetch the user's account emails and discovery bindings so we
// can check them against the email that was invited.
if (this.props.inviterName && this.props.invitedEmail) {
this.setState({busy: true});
this.setState({ busy: true });
try {
// Gather the account 3PIDs
const account3pids = await MatrixClientPeg.get().getThreePids();
@ -125,7 +125,7 @@ export default class RoomPreviewBar extends React.Component {
// If we have an IS connected, use that to lookup the email and
// check the bound MXID.
if (!MatrixClientPeg.get().getIdentityServerUrl()) {
this.setState({busy: false});
this.setState({ busy: false });
return;
}
const authClient = new IdentityAuthClient();
@ -136,11 +136,11 @@ export default class RoomPreviewBar extends React.Component {
undefined /* callback */,
identityAccessToken,
);
this.setState({invitedEmailMxid: result.mxid});
this.setState({ invitedEmailMxid: result.mxid });
} catch (err) {
this.setState({threePidFetchError: err});
this.setState({ threePidFetchError: err });
}
this.setState({busy: false});
this.setState({ busy: false });
}
}
@ -214,7 +214,7 @@ export default class RoomPreviewBar extends React.Component {
const memberName = kickerMember ?
kickerMember.name : myMember.events.member.getSender();
const reason = myMember.events.member.getContent().reason;
return {memberName, reason};
return { memberName, reason };
}
_joinRule() {
@ -229,7 +229,7 @@ export default class RoomPreviewBar extends React.Component {
_communityProfile() {
if (this.props.room) return CommunityPrototypeStore.instance.getInviteProfile(this.props.room.roomId);
return {displayName: null, avatarMxc: null};
return { displayName: null, avatarMxc: null };
}
_roomName(atStart = false) {
@ -253,7 +253,7 @@ export default class RoomPreviewBar extends React.Component {
}
_getInviteMember() {
const {room} = this.props;
const { room } = this.props;
if (!room) {
return;
}
@ -347,10 +347,10 @@ export default class RoomPreviewBar extends React.Component {
break;
}
case MessageCase.Kicked: {
const {memberName, reason} = this._getKickOrBanInfo();
const { memberName, reason } = this._getKickOrBanInfo();
title = _t("You were kicked from %(roomName)s by %(memberName)s",
{memberName, roomName: this._roomName()});
subTitle = reason ? _t("Reason: %(reason)s", {reason}) : null;
{ memberName, roomName: this._roomName() });
subTitle = reason ? _t("Reason: %(reason)s", { reason }) : null;
if (this._joinRule() === "invite") {
primaryActionLabel = _t("Forget this room");
@ -364,22 +364,22 @@ export default class RoomPreviewBar extends React.Component {
break;
}
case MessageCase.Banned: {
const {memberName, reason} = this._getKickOrBanInfo();
const { memberName, reason } = this._getKickOrBanInfo();
title = _t("You were banned from %(roomName)s by %(memberName)s",
{memberName, roomName: this._roomName()});
subTitle = reason ? _t("Reason: %(reason)s", {reason}) : null;
{ memberName, roomName: this._roomName() });
subTitle = reason ? _t("Reason: %(reason)s", { reason }) : null;
primaryActionLabel = _t("Forget this room");
primaryActionHandler = this.props.onForgetClick;
break;
}
case MessageCase.OtherThreePIDError: {
title = _t("Something went wrong with your invite to %(roomName)s",
{roomName: this._roomName()});
{ roomName: this._roomName() });
const joinRule = this._joinRule();
const errCodeMessage = _t(
"An error (%(errcode)s) was returned while trying to validate your " +
"invite. You could try to pass this information on to a room admin.",
{errcode: this.state.threePidFetchError.errcode || _t("unknown error code")},
{ errcode: this.state.threePidFetchError.errcode || _t("unknown error code") },
);
switch (joinRule) {
case "invite":
@ -478,7 +478,7 @@ export default class RoomPreviewBar extends React.Component {
{ user: inviteMember.name });
subTitle = [
avatar,
_t("<userName/> wants to chat", {}, {userName: () => inviterElement}),
_t("<userName/> wants to chat", {}, { userName: () => inviterElement }),
];
primaryActionLabel = _t("Start chatting");
} else {
@ -486,7 +486,7 @@ export default class RoomPreviewBar extends React.Component {
{ roomName: this._roomName() });
subTitle = [
avatar,
_t("<userName/> invited you", {}, {userName: () => inviterElement}),
_t("<userName/> invited you", {}, { userName: () => inviterElement }),
];
primaryActionLabel = _t("Accept");
}
@ -513,22 +513,22 @@ export default class RoomPreviewBar extends React.Component {
case MessageCase.ViewingRoom: {
if (this.props.canPreview) {
title = _t("You're previewing %(roomName)s. Want to join it?",
{roomName: this._roomName()});
{ roomName: this._roomName() });
} else {
title = _t("%(roomName)s can't be previewed. Do you want to join it?",
{roomName: this._roomName(true)});
{ roomName: this._roomName(true) });
}
primaryActionLabel = _t("Join the discussion");
primaryActionHandler = this.props.onJoinClick;
break;
}
case MessageCase.RoomNotFound: {
title = _t("%(roomName)s does not exist.", {roomName: this._roomName(true)});
title = _t("%(roomName)s does not exist.", { roomName: this._roomName(true) });
subTitle = _t("This room doesn't exist. Are you sure you're at the right place?");
break;
}
case MessageCase.OtherError: {
title = _t("%(roomName)s is not accessible at this time.", {roomName: this._roomName(true)});
title = _t("%(roomName)s is not accessible at this time.", { roomName: this._roomName(true) });
subTitle = [
_t("Try again later, or ask a room admin to check if you have access."),
_t(

40
src/components/views/rooms/RoomSublist.tsx
View file

@ -54,7 +54,7 @@ import ExtraTile from "./ExtraTile";
import { ListNotificationState } from "../../../stores/notifications/ListNotificationState";
import IconizedContextMenu from "../context_menus/IconizedContextMenu";
import { getKeyBindingsManager, RoomListAction } from "../../../KeyBindingsManager";
import {replaceableComponent} from "../../../utils/replaceableComponent";
import { replaceableComponent } from "../../../utils/replaceableComponent";
const SHOW_N_BUTTON_HEIGHT = 28; // As defined by CSS
const RESIZE_HANDLE_HEIGHT = 4; // As defined by CSS
@ -128,7 +128,7 @@ export default class RoomSublist extends React.Component<IProps, IState> {
rooms: arrayFastClone(RoomListStore.instance.orderedLists[this.props.tagId] || []),
};
// Why Object.assign() and not this.state.height? Because TypeScript says no.
this.state = Object.assign(this.state, {height: this.calculateInitialHeight()});
this.state = Object.assign(this.state, { height: this.calculateInitialHeight() });
}
private calculateInitialHeight() {
@ -184,7 +184,7 @@ export default class RoomSublist extends React.Component<IProps, IState> {
// as the rooms can come in one by one we need to reevaluate
// the amount of available rooms to cap the amount of requested visible rooms by the layout
if (RoomSublist.calcNumTiles(prevState.rooms, prevExtraTiles) !== this.numTiles) {
this.setState({height: this.calculateInitialHeight()});
this.setState({ height: this.calculateInitialHeight() });
}
}
@ -329,12 +329,12 @@ export default class RoomSublist extends React.Component<IProps, IState> {
) => {
const newHeight = this.heightAtStart + delta.height;
this.applyHeightChange(newHeight);
this.setState({height: newHeight});
this.setState({ height: newHeight });
};
private onResizeStart = () => {
this.heightAtStart = this.state.height;
this.setState({isResizing: true});
this.setState({ isResizing: true });
};
private onResizeStop = (
@ -345,7 +345,7 @@ export default class RoomSublist extends React.Component<IProps, IState> {
) => {
const newHeight = this.heightAtStart + delta.height;
this.applyHeightChange(newHeight);
this.setState({isResizing: false, height: newHeight});
this.setState({ isResizing: false, height: newHeight });
};
private onShowAllClick = () => {
@ -353,7 +353,7 @@ export default class RoomSublist extends React.Component<IProps, IState> {
const numVisibleTiles = this.numVisibleTiles;
const newHeight = this.layout.tilesToPixelsWithPadding(this.numTiles, this.padding);
this.applyHeightChange(newHeight);
this.setState({height: newHeight}, () => {
this.setState({ height: newHeight }, () => {
// focus the top-most new room
this.focusRoomTile(numVisibleTiles);
});
@ -362,7 +362,7 @@ export default class RoomSublist extends React.Component<IProps, IState> {
private onShowLessClick = () => {
const newHeight = this.layout.tilesToPixelsWithPadding(this.layout.defaultVisibleTiles, this.padding);
this.applyHeightChange(newHeight);
this.setState({height: newHeight});
this.setState({ height: newHeight });
};
private focusRoomTile = (index: number) => {
@ -378,7 +378,7 @@ export default class RoomSublist extends React.Component<IProps, IState> {
ev.preventDefault();
ev.stopPropagation();
const target = ev.target as HTMLButtonElement;
this.setState({contextMenuPosition: target.getBoundingClientRect()});
this.setState({ contextMenuPosition: target.getBoundingClientRect() });
};
private onContextMenu = (ev: React.MouseEvent) => {
@ -397,15 +397,15 @@ export default class RoomSublist extends React.Component<IProps, IState> {
ev.preventDefault();
ev.stopPropagation();
const target = ev.target as HTMLButtonElement;
this.setState({addRoomContextMenuPosition: target.getBoundingClientRect()});
this.setState({ addRoomContextMenuPosition: target.getBoundingClientRect() });
};
private onCloseMenu = () => {
this.setState({contextMenuPosition: null});
this.setState({ contextMenuPosition: null });
};
private onCloseAddRoomMenu = () => {
this.setState({addRoomContextMenuPosition: null});
this.setState({ addRoomContextMenuPosition: null });
};
private onUnreadFirstChanged = async () => {
@ -462,7 +462,7 @@ export default class RoomSublist extends React.Component<IProps, IState> {
if ((isStickyBottom && !isAtBottom) || (isStickyTop && !isAtTop)) {
// is sticky - jump to list
sublist.scrollIntoView({behavior: 'smooth'});
sublist.scrollIntoView({ behavior: 'smooth' });
} else {
// on screen - toggle collapse
const isExpanded = this.state.isExpanded;
@ -470,7 +470,7 @@ export default class RoomSublist extends React.Component<IProps, IState> {
// if the bottom list is collapsed then scroll it in so it doesn't expand off screen
if (!isExpanded && isStickyBottom) {
setImmediate(() => {
sublist.scrollIntoView({behavior: 'smooth'});
sublist.scrollIntoView({ behavior: 'smooth' });
});
}
}
@ -478,9 +478,9 @@ export default class RoomSublist extends React.Component<IProps, IState> {
private toggleCollapsed = () => {
this.layout.isCollapsed = this.state.isExpanded;
this.setState({isExpanded: !this.layout.isCollapsed});
this.setState({ isExpanded: !this.layout.isCollapsed });
if (this.props.onListCollapse) {
this.props.onListCollapse(!this.layout.isCollapsed)
this.props.onListCollapse(!this.layout.isCollapsed);
}
};
@ -655,7 +655,7 @@ export default class RoomSublist extends React.Component<IProps, IState> {
private renderHeader(): React.ReactElement {
return (
<RovingTabIndexWrapper inputRef={this.headerButton}>
{({onFocus, isActive, ref}) => {
{({ onFocus, isActive, ref }) => {
const tabIndex = isActive ? 0 : -1;
let ariaLabel = _t("Jump to first unread room.");
@ -801,7 +801,7 @@ export default class RoomSublist extends React.Component<IProps, IState> {
const nonPaddedHeight = this.state.height - RESIZE_HANDLE_HEIGHT - SHOW_N_BUTTON_HEIGHT;
const amountFullyShown = Math.floor(nonPaddedHeight / this.layout.tileHeight);
const numMissing = this.numTiles - amountFullyShown;
const label = _t("Show %(count)s more", {count: numMissing});
const label = _t("Show %(count)s more", { count: numMissing });
let showMoreText = (
<span className='mx_RoomSublist_showNButtonText'>
{label}
@ -879,14 +879,14 @@ export default class RoomSublist extends React.Component<IProps, IState> {
content = (
<React.Fragment>
<Resizable
size={{height: this.state.height} as any}
size={{ height: this.state.height } as any}
minHeight={minTilesPx}
maxHeight={maxTilesPx}
onResizeStart={this.onResizeStart}
onResizeStop={this.onResizeStop}
onResize={this.onResize}
handleWrapperClass={handleWrapperClasses}
handleClasses={{bottom: "mx_RoomSublist_resizerHandle"}}
handleClasses={{ bottom: "mx_RoomSublist_resizerHandle" }}
className="mx_RoomSublist_resizeBox"
enable={handles}
>

34
src/components/views/rooms/RoomTile.tsx
View file

@ -78,7 +78,7 @@ const contextMenuBelow = (elementRect: PartialDOMRect) => {
const left = elementRect.left + window.pageXOffset - 9;
const top = elementRect.bottom + window.pageYOffset + 17;
const chevronFace = ChevronFace.None;
return {left, top, chevronFace};
return { left, top, chevronFace };
};
@replaceableComponent("views.rooms.RoomTile")
@ -112,7 +112,7 @@ export default class RoomTile extends React.PureComponent<IProps, IState> {
private onRoomNameUpdate = (room) => {
this.forceUpdate();
}
};
private onNotificationUpdate = () => {
this.forceUpdate(); // notification state changed - update
@ -120,7 +120,7 @@ export default class RoomTile extends React.PureComponent<IProps, IState> {
private onLocalEchoUpdated = (ev: MatrixEvent, room: Room) => {
if (room?.roomId !== this.props.room.roomId) return;
this.setState({hasUnsentEvents: this.countUnsentEvents() > 0});
this.setState({ hasUnsentEvents: this.countUnsentEvents() > 0 });
};
private onRoomPropertyUpdate = (property: CachedRoomKey) => {
@ -259,25 +259,25 @@ export default class RoomTile extends React.PureComponent<IProps, IState> {
};
private onActiveRoomUpdate = (isActive: boolean) => {
this.setState({selected: isActive});
this.setState({ selected: isActive });
};
private onNotificationsMenuOpenClick = (ev: React.MouseEvent) => {
ev.preventDefault();
ev.stopPropagation();
const target = ev.target as HTMLButtonElement;
this.setState({notificationsMenuPosition: target.getBoundingClientRect()});
this.setState({ notificationsMenuPosition: target.getBoundingClientRect() });
};
private onCloseNotificationsMenu = () => {
this.setState({notificationsMenuPosition: null});
this.setState({ notificationsMenuPosition: null });
};
private onGeneralMenuOpenClick = (ev: React.MouseEvent) => {
ev.preventDefault();
ev.stopPropagation();
const target = ev.target as HTMLButtonElement;
this.setState({generalMenuPosition: target.getBoundingClientRect()});
this.setState({ generalMenuPosition: target.getBoundingClientRect() });
};
private onContextMenu = (ev: React.MouseEvent) => {
@ -295,7 +295,7 @@ export default class RoomTile extends React.PureComponent<IProps, IState> {
};
private onCloseGeneralMenu = () => {
this.setState({generalMenuPosition: null});
this.setState({ generalMenuPosition: null });
};
private onTagRoom = (ev: ButtonEvent, tagId: TagID) => {
@ -321,7 +321,7 @@ export default class RoomTile extends React.PureComponent<IProps, IState> {
if ((ev as React.KeyboardEvent).key === Key.ENTER) {
// Implements https://www.w3.org/TR/wai-aria-practices/#keyboard-interaction-12
this.setState({generalMenuPosition: null}); // hide the menu
this.setState({ generalMenuPosition: null }); // hide the menu
}
};
@ -333,7 +333,7 @@ export default class RoomTile extends React.PureComponent<IProps, IState> {
action: 'leave_room',
room_id: this.props.room.roomId,
});
this.setState({generalMenuPosition: null}); // hide the menu
this.setState({ generalMenuPosition: null }); // hide the menu
};
private onForgetRoomClick = (ev: ButtonEvent) => {
@ -344,7 +344,7 @@ export default class RoomTile extends React.PureComponent<IProps, IState> {
action: 'forget_room',
room_id: this.props.room.roomId,
});
this.setState({generalMenuPosition: null}); // hide the menu
this.setState({ generalMenuPosition: null }); // hide the menu
};
private onOpenRoomSettings = (ev: ButtonEvent) => {
@ -355,7 +355,7 @@ export default class RoomTile extends React.PureComponent<IProps, IState> {
action: 'open_room_settings',
room_id: this.props.room.roomId,
});
this.setState({generalMenuPosition: null}); // hide the menu
this.setState({ generalMenuPosition: null }); // hide the menu
};
private onInviteClick = (ev: ButtonEvent) => {
@ -366,7 +366,7 @@ export default class RoomTile extends React.PureComponent<IProps, IState> {
action: 'view_invite',
roomId: this.props.room.roomId,
});
this.setState({generalMenuPosition: null}); // hide the menu
this.setState({ generalMenuPosition: null }); // hide the menu
};
private async saveNotifState(ev: ButtonEvent, newState: Volume) {
@ -379,7 +379,7 @@ export default class RoomTile extends React.PureComponent<IProps, IState> {
const key = (ev as React.KeyboardEvent).key;
if (key === Key.ENTER) {
// Implements https://www.w3.org/TR/wai-aria-practices/#keyboard-interaction-12
this.setState({notificationsMenuPosition: null}); // hide the menu
this.setState({ notificationsMenuPosition: null }); // hide the menu
}
}
@ -554,7 +554,7 @@ export default class RoomTile extends React.PureComponent<IProps, IState> {
'mx_RoomTile_minimized': this.props.isMinimized,
});
let roomProfile: IRoomProfile = {displayName: null, avatarMxc: null};
let roomProfile: IRoomProfile = { displayName: null, avatarMxc: null };
if (this.props.tag === DefaultTagID.Invite) {
roomProfile = CommunityPrototypeStore.instance.getInviteProfile(this.props.room.roomId);
}
@ -567,7 +567,7 @@ export default class RoomTile extends React.PureComponent<IProps, IState> {
room={this.props.room}
avatarSize={32}
displayBadge={this.props.isMinimized}
oobData={({avatarUrl: roomProfile.avatarMxc})}
oobData={({ avatarUrl: roomProfile.avatarMxc })}
/>;
let badge: React.ReactNode;
@ -659,7 +659,7 @@ export default class RoomTile extends React.PureComponent<IProps, IState> {
return (
<React.Fragment>
<RovingTabIndexWrapper inputRef={this.roomTileRef}>
{({onFocus, isActive, ref}) =>
{({ onFocus, isActive, ref }) =>
<Button
{...props}
onFocus={onFocus}

10
src/components/views/rooms/RoomUpgradeWarningBar.js
View file

@ -20,8 +20,8 @@ import * as sdk from '../../../index';
import Modal from '../../../Modal';
import { _t } from '../../../languageHandler';
import {MatrixClientPeg} from "../../../MatrixClientPeg";
import {replaceableComponent} from "../../../utils/replaceableComponent";
import { MatrixClientPeg } from "../../../MatrixClientPeg";
import { replaceableComponent } from "../../../utils/replaceableComponent";
@replaceableComponent("views.rooms.RoomUpgradeWarningBar")
export default class RoomUpgradeWarningBar extends React.PureComponent {
@ -37,7 +37,7 @@ export default class RoomUpgradeWarningBar extends React.PureComponent {
componentDidMount() {
const tombstone = this.props.room.currentState.getStateEvents("m.room.tombstone", "");
this.setState({upgraded: tombstone && tombstone.getContent().replacement_room});
this.setState({ upgraded: tombstone && tombstone.getContent().replacement_room });
MatrixClientPeg.get().on("RoomState.events", this._onStateEvents);
}
@ -57,12 +57,12 @@ export default class RoomUpgradeWarningBar extends React.PureComponent {
if (event.getType() !== "m.room.tombstone") return;
const tombstone = this.props.room.currentState.getStateEvents("m.room.tombstone", "");
this.setState({upgraded: tombstone && tombstone.getContent().replacement_room});
this.setState({ upgraded: tombstone && tombstone.getContent().replacement_room });
};
onUpgradeClick = () => {
const RoomUpgradeDialog = sdk.getComponent('dialogs.RoomUpgradeDialog');
Modal.createTrackedDialog('Upgrade Room Version', '', RoomUpgradeDialog, {room: this.props.room});
Modal.createTrackedDialog('Upgrade Room Version', '', RoomUpgradeDialog, { room: this.props.room });
};
render() {

6
src/components/views/rooms/SearchResultTile.js
View file

@ -18,10 +18,10 @@ limitations under the License.
import React from 'react';
import PropTypes from 'prop-types';
import * as sdk from '../../../index';
import {haveTileForEvent} from "./EventTile";
import { haveTileForEvent } from "./EventTile";
import SettingsStore from "../../../settings/SettingsStore";
import {UIFeature} from "../../../settings/UIFeature";
import {replaceableComponent} from "../../../utils/replaceableComponent";
import { UIFeature } from "../../../settings/UIFeature";
import { replaceableComponent } from "../../../utils/replaceableComponent";
@replaceableComponent("views.rooms.SearchResultTile")
export default class SearchResultTile extends React.Component {

24
src/components/views/rooms/SendMessageComposer.js
View file

@ -80,7 +80,7 @@ export function createMessageContent(model, permalinkCreator, replyToEvent) {
msgtype: isEmote ? "m.emote" : "m.text",
body: body,
};
const formattedBody = htmlSerializeIfNeeded(model, {forceHTML: !!replyToEvent});
const formattedBody = htmlSerializeIfNeeded(model, { forceHTML: !!replyToEvent });
if (formattedBody) {
content.format = "org.matrix.custom.html";
content.formatted_body = formattedBody;
@ -208,7 +208,7 @@ export default class SendMessageComposer extends React.Component {
this.sendHistoryManager.currentIndex = this.sendHistoryManager.history.length;
return;
}
const {parts, replyEventId} = this.sendHistoryManager.getItem(delta);
const { parts, replyEventId } = this.sendHistoryManager.getItem(delta);
dis.dispatch({
action: 'reply_to_event',
event: replyEventId ? this.props.room.findEventById(replyEventId) : null,
@ -265,7 +265,7 @@ export default class SendMessageComposer extends React.Component {
"key": reaction,
},
});
dis.dispatch({action: "message_sent"});
dis.dispatch({ action: "message_sent" });
}
break;
}
@ -280,7 +280,7 @@ export default class SendMessageComposer extends React.Component {
}
return text + part.text;
}, "");
const {cmd, args} = getCommand(commandText);
const { cmd, args } = getCommand(commandText);
return [cmd, args, commandText];
}
@ -350,11 +350,11 @@ export default class SendMessageComposer extends React.Component {
} else {
// ask the user if their unknown command should be sent as a message
const QuestionDialog = sdk.getComponent("dialogs.QuestionDialog");
const {finished} = Modal.createTrackedDialog("Unknown command", "", QuestionDialog, {
const { finished } = Modal.createTrackedDialog("Unknown command", "", QuestionDialog, {
title: _t("Unknown Command"),
description: <div>
<p>
{ _t("Unrecognised command: %(commandText)s", {commandText}) }
{ _t("Unrecognised command: %(commandText)s", { commandText }) }
</p>
<p>
{ _t("You can use <code>/help</code> to list available commands. " +
@ -383,7 +383,7 @@ export default class SendMessageComposer extends React.Component {
if (shouldSend) {
const startTime = CountlyAnalytics.getTimestamp();
const {roomId} = this.props.room;
const { roomId } = this.props.room;
if (!content) {
content = createMessageContent(this.model, this.props.permalinkCreator, replyToEvent);
}
@ -399,10 +399,10 @@ export default class SendMessageComposer extends React.Component {
event: null,
});
}
dis.dispatch({action: "message_sent"});
dis.dispatch({ action: "message_sent" });
CHAT_EFFECTS.forEach((effect) => {
if (containsEmoji(content, effect.emojis)) {
dis.dispatch({action: `effects.${effect.command}`});
dis.dispatch({ action: `effects.${effect.command}` });
}
});
CountlyAnalytics.instance.trackSendMessage(startTime, prom, roomId, false, !!replyToEvent, content);
@ -415,7 +415,7 @@ export default class SendMessageComposer extends React.Component {
this._editorRef.focus();
this._clearStoredEditorState();
if (SettingsStore.getValue("scrollToBottomOnMessageSent")) {
dis.dispatch({action: "scroll_to_bottom"});
dis.dispatch({ action: "scroll_to_bottom" });
}
}
@ -446,7 +446,7 @@ export default class SendMessageComposer extends React.Component {
const json = localStorage.getItem(this._editorStateKey);
if (json) {
try {
const {parts: serializedParts, replyEventId} = JSON.parse(json);
const { parts: serializedParts, replyEventId } = JSON.parse(json);
const parts = serializedParts.map(p => partCreator.deserializePart(p));
if (replyEventId) {
dis.dispatch({
@ -498,7 +498,7 @@ export default class SendMessageComposer extends React.Component {
};
_onPaste = (event) => {
const {clipboardData} = event;
const { clipboardData } = event;
// Prioritize text on the clipboard over files as Office on macOS puts a bitmap
// in the clipboard as well as the content being copied.
if (clipboardData.files.length && !clipboardData.types.some(t => t === "text/plain")) {

8
src/components/views/rooms/SimpleRoomHeader.js
View file

@ -16,8 +16,7 @@ limitations under the License.
import React from 'react';
import PropTypes from 'prop-types';
import * as sdk from '../../../index';
import {replaceableComponent} from "../../../utils/replaceableComponent";
import { replaceableComponent } from "../../../utils/replaceableComponent";
/*
* A stripped-down room header used for things like the user settings
@ -28,15 +27,14 @@ export default class SimpleRoomHeader extends React.Component {
static propTypes = {
title: PropTypes.string,
// `src` to a TintableSvg. Optional.
// `src` to an image. Optional.
icon: PropTypes.string,
};
render() {
let icon;
if (this.props.icon) {
const TintableSvg = sdk.getComponent('elements.TintableSvg');
icon = <TintableSvg
icon = <img
className="mx_RoomHeader_icon" src={this.props.icon}
width="25" height="25"
/>;

32
src/components/views/rooms/Stickerpicker.js
View file

@ -15,22 +15,22 @@ limitations under the License.
*/
import React from 'react';
import classNames from 'classnames';
import {_t, _td} from '../../../languageHandler';
import { _t, _td } from '../../../languageHandler';
import AppTile from '../elements/AppTile';
import {MatrixClientPeg} from '../../../MatrixClientPeg';
import { MatrixClientPeg } from '../../../MatrixClientPeg';
import * as sdk from '../../../index';
import dis from '../../../dispatcher/dispatcher';
import AccessibleButton from '../elements/AccessibleButton';
import WidgetUtils from '../../../utils/WidgetUtils';
import PersistedElement from "../elements/PersistedElement";
import {IntegrationManagers} from "../../../integrations/IntegrationManagers";
import { IntegrationManagers } from "../../../integrations/IntegrationManagers";
import SettingsStore from "../../../settings/SettingsStore";
import {ContextMenu} from "../../structures/ContextMenu";
import {WidgetType} from "../../../widgets/WidgetType";
import { ContextMenu } from "../../structures/ContextMenu";
import { WidgetType } from "../../../widgets/WidgetType";
import AccessibleTooltipButton from "../elements/AccessibleTooltipButton";
import {Action} from "../../../dispatcher/actions";
import {WidgetMessagingStore} from "../../../stores/widgets/WidgetMessagingStore";
import {replaceableComponent} from "../../../utils/replaceableComponent";
import { Action } from "../../../dispatcher/actions";
import { WidgetMessagingStore } from "../../../stores/widgets/WidgetMessagingStore";
import { replaceableComponent } from "../../../utils/replaceableComponent";
// This should be below the dialog level (4000), but above the rest of the UI (1000-2000).
// We sit in a context menu, so this should be given to the context menu.
@ -103,7 +103,7 @@ export default class Stickerpicker extends React.PureComponent {
console.warn('No widget ID specified, not disabling assets');
}
this.setState({showStickers: false});
this.setState({ showStickers: false });
WidgetUtils.removeStickerpickerWidgets().then(() => {
this.forceUpdate();
}).catch((e) => {
@ -150,7 +150,7 @@ export default class Stickerpicker extends React.PureComponent {
const stickerpickerWidget = WidgetUtils.getStickerpickerWidgets()[0];
if (!stickerpickerWidget) {
Stickerpicker.currentWidget = null;
this.setState({stickerpickerWidget: null, widgetId: null});
this.setState({ stickerpickerWidget: null, widgetId: null });
return;
}
@ -183,12 +183,12 @@ export default class Stickerpicker extends React.PureComponent {
this.forceUpdate();
break;
case "stickerpicker_close":
this.setState({showStickers: false});
this.setState({ showStickers: false });
break;
case Action.AfterRightPanelPhaseChange:
case "show_left_panel":
case "hide_left_panel":
this.setState({showStickers: false});
this.setState({ showStickers: false });
break;
}
}
@ -206,7 +206,7 @@ export default class Stickerpicker extends React.PureComponent {
_errorStickerpickerContent() {
return (
<div style={{"text-align": "center"}} className="error">
<div style={{ "text-align": "center" }} className="error">
<p> { this.state.imError } </p>
</div>
);
@ -342,7 +342,7 @@ export default class Stickerpicker extends React.PureComponent {
*/
_onHideStickersClick(ev) {
if (this.state.showStickers) {
this.setState({showStickers: false});
this.setState({ showStickers: false });
}
}
@ -351,7 +351,7 @@ export default class Stickerpicker extends React.PureComponent {
*/
_onResize() {
if (this.state.showStickers) {
this.setState({showStickers: false});
this.setState({ showStickers: false });
}
}
@ -360,7 +360,7 @@ export default class Stickerpicker extends React.PureComponent {
*/
_onFinished() {
if (this.state.showStickers) {
this.setState({showStickers: false});
this.setState({ showStickers: false });
}
}

20
src/components/views/rooms/ThirdPartyMemberInfo.tsx
View file

@ -15,17 +15,17 @@ limitations under the License.
*/
import React from 'react';
import {MatrixClientPeg} from "../../../MatrixClientPeg";
import {MatrixEvent} from "matrix-js-sdk/src/models/event";
import {Room} from "matrix-js-sdk/src/models/room";
import {_t} from "../../../languageHandler";
import { MatrixClientPeg } from "../../../MatrixClientPeg";
import { MatrixEvent } from "matrix-js-sdk/src/models/event";
import { Room } from "matrix-js-sdk/src/models/room";
import { _t } from "../../../languageHandler";
import dis from "../../../dispatcher/dispatcher";
import * as sdk from "../../../index";
import Modal from "../../../Modal";
import {isValid3pidInvite} from "../../../RoomInvite";
import { isValid3pidInvite } from "../../../RoomInvite";
import RoomAvatar from "../avatars/RoomAvatar";
import RoomName from "../elements/RoomName";
import {replaceableComponent} from "../../../utils/replaceableComponent";
import { replaceableComponent } from "../../../utils/replaceableComponent";
import SettingsStore from "../../../settings/SettingsStore";
interface IProps {
@ -83,7 +83,7 @@ export default class ThirdPartyMemberInfo extends React.Component<IProps, IState
const newDisplayName = ev.getContent().display_name;
const isInvited = isValid3pidInvite(ev);
const newState = {invited: isInvited};
const newState = { invited: isInvited };
if (newDisplayName) newState['displayName'] = newDisplayName;
this.setState(newState);
}
@ -102,7 +102,7 @@ export default class ThirdPartyMemberInfo extends React.Component<IProps, IState
console.error(err);
// Revert echo because of error
this.setState({invited: true});
this.setState({ invited: true });
const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
Modal.createTrackedDialog('Revoke 3pid invite failed', '', ErrorDialog, {
@ -115,7 +115,7 @@ export default class ThirdPartyMemberInfo extends React.Component<IProps, IState
});
// Local echo
this.setState({invited: false});
this.setState({ invited: false });
};
render() {
@ -157,7 +157,7 @@ export default class ThirdPartyMemberInfo extends React.Component<IProps, IState
<div className="mx_MemberInfo_container">
<div className="mx_MemberInfo_profile">
<div className="mx_MemberInfo_profileField">
{_t("Invited by %(sender)s", {sender: this.state.senderName})}
{_t("Invited by %(sender)s", { sender: this.state.senderName })}
</div>
</div>
</div>

2
src/components/views/rooms/TopUnreadMessagesBar.js
View file

@ -20,7 +20,7 @@ import React from 'react';
import PropTypes from 'prop-types';
import { _t } from '../../../languageHandler';
import AccessibleButton from '../elements/AccessibleButton';
import {replaceableComponent} from "../../../utils/replaceableComponent";
import { replaceableComponent } from "../../../utils/replaceableComponent";
@replaceableComponent("views.rooms.TopUnreadMessagesBar")
export default class TopUnreadMessagesBar extends React.Component {

12
src/components/views/rooms/VoiceRecordComposerTile.tsx
View file

@ -16,19 +16,19 @@ limitations under the License.
import AccessibleTooltipButton from "../elements/AccessibleTooltipButton";
import { _t } from "../../../languageHandler";
import React, {ReactNode} from "react";
import React, { ReactNode } from "react";
import {
RecordingState,
VoiceRecording,
} from "../../../voice/VoiceRecording";
import {Room} from "matrix-js-sdk/src/models/room";
import { Room } from "matrix-js-sdk/src/models/room";
import { MatrixClientPeg } from "../../../MatrixClientPeg";
import classNames from "classnames";
import LiveRecordingWaveform from "../audio_messages/LiveRecordingWaveform";
import { replaceableComponent } from "../../../utils/replaceableComponent";
import LiveRecordingClock from "../audio_messages/LiveRecordingClock";
import { VoiceRecordingStore } from "../../../stores/VoiceRecordingStore";
import {UPDATE_EVENT} from "../../../stores/AsyncStore";
import { UPDATE_EVENT } from "../../../stores/AsyncStore";
import RecordingPlayback from "../audio_messages/RecordingPlayback";
import { MsgType } from "matrix-js-sdk/src/@types/event";
import Modal from "../../../Modal";
@ -106,7 +106,7 @@ export default class VoiceRecordComposerTile extends React.PureComponent<IProps,
await VoiceRecordingStore.instance.disposeRecording();
// Reset back to no recording, which means no phase (ie: restart component entirely)
this.setState({recorder: null, recordingPhase: null});
this.setState({ recorder: null, recordingPhase: null });
}
private onCancel = async () => {
@ -160,10 +160,10 @@ export default class VoiceRecordComposerTile extends React.PureComponent<IProps,
// We don't need to remove the listener: the recorder will clean that up for us.
recorder.on(UPDATE_EVENT, (ev: RecordingState) => {
if (ev === RecordingState.EndingSoon) return; // ignore this state: it has no UI purpose here
this.setState({recordingPhase: ev});
this.setState({ recordingPhase: ev });
});
this.setState({recorder, recordingPhase: RecordingState.Started});
this.setState({ recorder, recordingPhase: RecordingState.Started });
} catch (e) {
console.error("Error starting recording: ", e);
accessError();

4
src/components/views/rooms/WhoIsTypingTile.tsx
View file

@ -97,7 +97,7 @@ export default class WhoIsTypingTile extends React.Component<IProps, IState> {
// remove user from usersTyping
const usersTyping = this.state.usersTyping.filter((m) => m.userId !== userId);
if (usersTyping.length !== this.state.usersTyping.length) {
this.setState({usersTyping});
this.setState({ usersTyping });
}
// abort timer if any
this.abortUserTimer(userId);
@ -163,7 +163,7 @@ export default class WhoIsTypingTile extends React.Component<IProps, IState> {
if (timer) {
const delayedStopTypingTimers = Object.assign({}, this.state.delayedStopTypingTimers);
delete delayedStopTypingTimers[userId];
this.setState({delayedStopTypingTimers});
this.setState({ delayedStopTypingTimers });
}
}