From 9e4d8e7dfee11e151144ac47d4bbc9cbdccba6e0 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Fri, 31 May 2019 15:00:26 +0200 Subject: [PATCH 0001/2751] document settingDefaults --- docs/settings.md | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/docs/settings.md b/docs/settings.md index 1ba8981f84..30818625d2 100644 --- a/docs/settings.md +++ b/docs/settings.md @@ -51,6 +51,17 @@ Settings are the different options a user may set or experience in the applicati } ``` +Settings that support the config level can be set in the config file under the `settingDefaults` key (note that the "theme" setting is special cased to the `default_theme` in the config file): +``` +{ + ... + settingDefaults: { + settingName: true + }, + ... +} +``` + ### Getting values for a setting After importing `SettingsStore`, simply make a call to `SettingsStore.getValue`. The `roomId` parameter should always From 833dcbac644911a845a91e3bef18ffc534461be2 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Thu, 19 Dec 2019 09:25:51 +0000 Subject: [PATCH 0002/2751] Rewire the Sticker button to be an Emoji Picker --- src/components/views/rooms/MessageComposer.js | 37 ++++++++++++++++++- .../views/rooms/SendMessageComposer.js | 14 +++++++ src/components/views/rooms/Stickerpicker.js | 1 + 3 files changed, 50 insertions(+), 2 deletions(-) diff --git a/src/components/views/rooms/MessageComposer.js b/src/components/views/rooms/MessageComposer.js index 580e3b0d81..00cb276923 100644 --- a/src/components/views/rooms/MessageComposer.js +++ b/src/components/views/rooms/MessageComposer.js @@ -22,10 +22,10 @@ import MatrixClientPeg from '../../../MatrixClientPeg'; import sdk from '../../../index'; import dis from '../../../dispatcher'; import RoomViewStore from '../../../stores/RoomViewStore'; -import Stickerpicker from './Stickerpicker'; import { makeRoomPermalink } from '../../../utils/permalinks/Permalinks'; import ContentMessages from '../../../ContentMessages'; import E2EIcon from './E2EIcon'; +import {aboveLeftOf, ContextMenu, ContextMenuButton, useContextMenu} from "../../structures/ContextMenu"; function ComposerAvatar(props) { const MemberStatusMessageAvatar = sdk.getComponent('avatars.MemberStatusMessageAvatar'); @@ -102,6 +102,32 @@ HangupButton.propTypes = { roomId: PropTypes.string.isRequired, }; +const EmojiButton = ({addEmoji}) => { + const [menuDisplayed, button, openMenu, closeMenu] = useContextMenu(); + + let contextMenu; + if (menuDisplayed) { + const buttonRect = button.current.getBoundingClientRect(); + const EmojiPicker = sdk.getComponent('emojipicker.EmojiPicker'); + contextMenu = + + ; + } + + return + + + + + { contextMenu } + ; +}; + class UploadButton extends React.Component { static propTypes = { roomId: PropTypes.string.isRequired, @@ -298,6 +324,13 @@ export default class MessageComposer extends React.Component { } } + addEmoji(emoji) { + dis.dispatch({ + action: "insert_emoji", + emoji, + }); + } + render() { const controls = [ this.state.me ? : null, @@ -321,7 +354,7 @@ export default class MessageComposer extends React.Component { room={this.props.room} placeholder={this.renderPlaceholderText()} permalinkCreator={this.props.permalinkCreator} />, - , + , , callInProgress ? : null, callInProgress ? null : , diff --git a/src/components/views/rooms/SendMessageComposer.js b/src/components/views/rooms/SendMessageComposer.js index af25155588..c2f79c72d7 100644 --- a/src/components/views/rooms/SendMessageComposer.js +++ b/src/components/views/rooms/SendMessageComposer.js @@ -317,6 +317,9 @@ export default class SendMessageComposer extends React.Component { case 'quote': this._insertQuotedMessage(payload.event); break; + case 'insert_emoji': + this._insertEmoji(payload.emoji); + break; } }; @@ -353,6 +356,17 @@ export default class SendMessageComposer extends React.Component { this._editorRef && this._editorRef.focus(); } + _insertEmoji = (emoji) => { + const {model} = this; + const {partCreator} = model; + const caret = this._editorRef.getCaret(); + const position = model.positionForOffset(caret.offset, caret.atNodeEnd); + model.transform(() => { + const addedLen = model.insert([partCreator.plain(emoji)], position); + return model.positionForOffset(caret.offset + addedLen, true); + }); + }; + _onPaste = (event) => { const {clipboardData} = event; if (clipboardData.files.length) { diff --git a/src/components/views/rooms/Stickerpicker.js b/src/components/views/rooms/Stickerpicker.js index 24f256e706..095a0dca31 100644 --- a/src/components/views/rooms/Stickerpicker.js +++ b/src/components/views/rooms/Stickerpicker.js @@ -36,6 +36,7 @@ const STICKERPICKER_Z_INDEX = 3500; // Key to store the widget's AppTile under in PersistedElement const PERSISTED_ELEMENT_KEY = "stickerPicker"; +// TODO figure out where to expose it now that the EmojiPicker has taken its place export default class Stickerpicker extends React.Component { static currentWidget; From 80c2aa51b63d587ab5240b9a1fab5966a6e1d02f Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Fri, 21 Feb 2020 10:41:33 +0000 Subject: [PATCH 0003/2751] Transition BaseAvatar to hooks Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- .eslintignore.errorfiles | 1 - src/components/views/avatars/BaseAvatar.js | 311 ++++++++++----------- 2 files changed, 144 insertions(+), 168 deletions(-) diff --git a/.eslintignore.errorfiles b/.eslintignore.errorfiles index 36b03b121c..e326f15002 100644 --- a/.eslintignore.errorfiles +++ b/.eslintignore.errorfiles @@ -7,7 +7,6 @@ src/components/structures/RoomView.js src/components/structures/ScrollPanel.js src/components/structures/SearchBox.js src/components/structures/UploadBar.js -src/components/views/avatars/BaseAvatar.js src/components/views/avatars/MemberAvatar.js src/components/views/create_room/RoomAlias.js src/components/views/dialogs/DeactivateAccountDialog.js diff --git a/src/components/views/avatars/BaseAvatar.js b/src/components/views/avatars/BaseAvatar.js index 4c34cee853..1b5b28e1e3 100644 --- a/src/components/views/avatars/BaseAvatar.js +++ b/src/components/views/avatars/BaseAvatar.js @@ -2,7 +2,7 @@ Copyright 2015, 2016 OpenMarket Ltd Copyright 2018 New Vector Ltd Copyright 2019 Michael Telatynski <7t3chguy@gmail.com> -Copyright 2019 The Matrix.org Foundation C.I.C. +Copyright 2019, 2020 The Matrix.org Foundation C.I.C. Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. @@ -17,206 +17,183 @@ See the License for the specific language governing permissions and limitations under the License. */ -import React from 'react'; +import React, {useCallback, useContext, useEffect, useMemo, useState} from 'react'; import PropTypes from 'prop-types'; -import createReactClass from 'create-react-class'; import * as AvatarLogic from '../../../Avatar'; import SettingsStore from "../../../settings/SettingsStore"; import AccessibleButton from '../elements/AccessibleButton'; import MatrixClientContext from "../../../contexts/MatrixClientContext"; +import {useEventEmitter} from "../../../hooks/useEventEmitter"; -export default createReactClass({ - displayName: 'BaseAvatar', +const useImageUrl = ({url, urls, idName, name, defaultToInitialLetter}) => { + const [imageUrls, setUrls] = useState([]); + const [urlsIndex, setIndex] = useState(); - propTypes: { - name: PropTypes.string.isRequired, // The name (first initial used as default) - idName: PropTypes.string, // ID for generating hash colours - title: PropTypes.string, // onHover title text - url: PropTypes.string, // highest priority of them all, shortcut to set in urls[0] - urls: PropTypes.array, // [highest_priority, ... , lowest_priority] - width: PropTypes.number, - height: PropTypes.number, - // XXX resizeMethod not actually used. - resizeMethod: PropTypes.string, - defaultToInitialLetter: PropTypes.bool, // true to add default url - inputRef: PropTypes.oneOfType([ - // Either a function - PropTypes.func, - // Or the instance of a DOM native element - PropTypes.shape({ current: PropTypes.instanceOf(Element) }), - ]), - }, - - statics: { - contextType: MatrixClientContext, - }, - - getDefaultProps: function() { - return { - width: 40, - height: 40, - resizeMethod: 'crop', - defaultToInitialLetter: true, - }; - }, - - getInitialState: function() { - return this._getState(this.props); - }, - - componentDidMount() { - this.unmounted = false; - this.context.on('sync', this.onClientSync); - }, - - componentWillUnmount() { - this.unmounted = true; - this.context.removeListener('sync', this.onClientSync); - }, - - componentWillReceiveProps: function(nextProps) { - // work out if we need to call setState (if the image URLs array has changed) - const newState = this._getState(nextProps); - const newImageUrls = newState.imageUrls; - const oldImageUrls = this.state.imageUrls; - if (newImageUrls.length !== oldImageUrls.length) { - this.setState(newState); // detected a new entry - } else { - // check each one to see if they are the same - for (let i = 0; i < newImageUrls.length; i++) { - if (oldImageUrls[i] !== newImageUrls[i]) { - this.setState(newState); // detected a diff - break; - } - } + const onError = () => { + const nextIndex = urlsIndex + 1; + if (nextIndex < imageUrls.length) { + // try the next one + setIndex(nextIndex); } - }, + }; - onClientSync: function(syncState, prevState) { - if (this.unmounted) return; + const defaultImageUrl = useMemo(() => AvatarLogic.defaultAvatarUrlForString(idName || name), [idName, name]); - // Consider the client reconnected if there is no error with syncing. - // This means the state could be RECONNECTING, SYNCING, PREPARED or CATCHUP. - const reconnected = syncState !== "ERROR" && prevState !== syncState; - if (reconnected && - // Did we fall back? - this.state.urlsIndex > 0 - ) { - // Start from the highest priority URL again - this.setState({ - urlsIndex: 0, - }); - } - }, - - _getState: function(props) { + useEffect(() => { // work out the full set of urls to try to load. This is formed like so: - // imageUrls: [ props.url, props.urls, default image ] + // imageUrls: [ props.url, ...props.urls, default image ] - let urls = []; + let _urls = []; if (!SettingsStore.getValue("lowBandwidth")) { - urls = props.urls || []; + _urls = urls || []; - if (props.url) { - urls.unshift(props.url); // put in urls[0] + if (url) { + _urls.unshift(url); // put in urls[0] } } - let defaultImageUrl = null; - if (props.defaultToInitialLetter) { - defaultImageUrl = AvatarLogic.defaultAvatarUrlForString( - props.idName || props.name, - ); - urls.push(defaultImageUrl); // lowest priority + if (defaultToInitialLetter) { + _urls.push(defaultImageUrl); // lowest priority } // deduplicate URLs - urls = Array.from(new Set(urls)); + _urls = Array.from(new Set(_urls)); - return { - imageUrls: urls, - defaultImageUrl: defaultImageUrl, - urlsIndex: 0, - }; - }, + setIndex(0); + setUrls(_urls); + }, [url, ...(urls || [])]); // eslint-disable-line react-hooks/exhaustive-deps - onError: function(ev) { - const nextIndex = this.state.urlsIndex + 1; - if (nextIndex < this.state.imageUrls.length) { - // try the next one - this.setState({ - urlsIndex: nextIndex, - }); + const cli = useContext(MatrixClientContext); + const onClientSync = useCallback((syncState, prevState) => { + // Consider the client reconnected if there is no error with syncing. + // This means the state could be RECONNECTING, SYNCING, PREPARED or CATCHUP. + const reconnected = syncState !== "ERROR" && prevState !== syncState; + if (reconnected && urlsIndex > 0 ) { // Did we fall back? + // Start from the highest priority URL again + setIndex(0); } - }, + }, [urlsIndex]); + useEventEmitter(cli, "sync", onClientSync); - render: function() { - const imageUrl = this.state.imageUrls[this.state.urlsIndex]; + const imageUrl = imageUrls[urlsIndex]; + return [imageUrl, imageUrl === defaultImageUrl, onError]; +}; - const { - name, idName, title, url, urls, width, height, resizeMethod, - defaultToInitialLetter, onClick, inputRef, - ...otherProps - } = this.props; +const BaseAvatar = (props) => { + const { + name, + idName, + title, + url, + urls, + width=40, + height=40, + resizeMethod="crop", // eslint-disable-line no-unused-vars + defaultToInitialLetter=true, + onClick, + inputRef, + ...otherProps + } = props; - if (imageUrl === this.state.defaultImageUrl) { - const initialLetter = AvatarLogic.getInitialLetter(name); - const textNode = ( - - ); - const imgNode = ( - - ); - if (onClick != null) { - return ( - - { textNode } - { imgNode } - - ); - } else { - return ( - - { textNode } - { imgNode } - - ); - } - } + lineHeight: height + "px", + }} + > + { initialLetter } + + ); + const imgNode = ( + + ); + if (onClick != null) { return ( + > + { textNode } + { imgNode } + ); } else { return ( - + + { textNode } + { imgNode } + ); } - }, -}); + } + + if (onClick != null) { + return ( + + ); + } else { + return ( + + ); + } +}; + +BaseAvatar.displayName = "BaseAvatar"; + +BaseAvatar.propTypes = { + name: PropTypes.string.isRequired, // The name (first initial used as default) + idName: PropTypes.string, // ID for generating hash colours + title: PropTypes.string, // onHover title text + url: PropTypes.string, // highest priority of them all, shortcut to set in urls[0] + urls: PropTypes.array, // [highest_priority, ... , lowest_priority] + width: PropTypes.number, + height: PropTypes.number, + // XXX resizeMethod not actually used. + resizeMethod: PropTypes.string, + defaultToInitialLetter: PropTypes.bool, // true to add default url + onClick: PropTypes.func, + inputRef: PropTypes.oneOfType([ + // Either a function + PropTypes.func, + // Or the instance of a DOM native element + PropTypes.shape({ current: PropTypes.instanceOf(Element) }), + ]), +}; + +export default BaseAvatar; From 3302469a2b4368500d20840a1f101781b5ef3711 Mon Sep 17 00:00:00 2001 From: Zoe Date: Mon, 24 Feb 2020 18:04:11 +0000 Subject: [PATCH 0004/2751] Catch errors sooner so users can recover more easily --- res/css/views/rooms/_EventTile.scss | 14 ++++ src/components/structures/MessagePanel.js | 76 ++++++++++--------- .../views/messages/TileErrorBoundary.js | 70 +++++++++++++++++ src/i18n/strings/en_EN.json | 1 + 4 files changed, 126 insertions(+), 35 deletions(-) create mode 100644 src/components/views/messages/TileErrorBoundary.js diff --git a/res/css/views/rooms/_EventTile.scss b/res/css/views/rooms/_EventTile.scss index d292c729dd..68aca63459 100644 --- a/res/css/views/rooms/_EventTile.scss +++ b/res/css/views/rooms/_EventTile.scss @@ -653,3 +653,17 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody { } } } + +.mx_EventTile_tileError { + color: red; + + .mx_EventTile_line span { + padding: 4px 8px; + border-radius: 11px; + box-shadow: 0px 0px 3px red inset; + } + + a { + margin-left: 1em; + } +} \ No newline at end of file diff --git a/src/components/structures/MessagePanel.js b/src/components/structures/MessagePanel.js index b8b11fbb31..e6f8de61a9 100644 --- a/src/components/structures/MessagePanel.js +++ b/src/components/structures/MessagePanel.js @@ -502,6 +502,7 @@ export default class MessagePanel extends React.Component { } _getTilesForEvent(prevEvent, mxEv, last) { + const TileErrorBoundary = sdk.getComponent('messages.TileErrorBoundary'); const EventTile = sdk.getComponent('rooms.EventTile'); const DateSeparator = sdk.getComponent('messages.DateSeparator'); const ret = []; @@ -575,25 +576,27 @@ export default class MessagePanel extends React.Component { ref={this._collectEventNode.bind(this, eventId)} data-scroll-tokens={scrollToken} > - + + + , ); @@ -755,6 +758,7 @@ export default class MessagePanel extends React.Component { } render() { + const ErrorBoundary = sdk.getComponent('elements.ErrorBoundary'); const ScrollPanel = sdk.getComponent("structures.ScrollPanel"); const WhoIsTypingTile = sdk.getComponent("rooms.WhoIsTypingTile"); const Spinner = sdk.getComponent("elements.Spinner"); @@ -787,22 +791,24 @@ export default class MessagePanel extends React.Component { } return ( - - { topSpinner } - { this._getEventTiles() } - { whoIsTyping } - { bottomSpinner } - + + + { topSpinner } + { this._getEventTiles() } + { whoIsTyping } + { bottomSpinner } + + ); } } diff --git a/src/components/views/messages/TileErrorBoundary.js b/src/components/views/messages/TileErrorBoundary.js new file mode 100644 index 0000000000..372d402899 --- /dev/null +++ b/src/components/views/messages/TileErrorBoundary.js @@ -0,0 +1,70 @@ +/* +Copyright 2020 The Matrix.org Foundation C.I.C. + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + +import React from 'react'; +import classNames from 'classnames'; +import { _t } from '../../../languageHandler'; +import * as sdk from '../../../index'; +import Modal from '../../../Modal'; + +export default class TileErrorBoundary extends React.Component { + constructor(props) { + super(props); + + this.state = { + error: null, + }; + } + + static getDerivedStateFromError(error) { + // Side effects are not permitted here, so we only update the state so + // that the next render shows an error message. + return { error }; + } + + _onBugReport = () => { + const BugReportDialog = sdk.getComponent("dialogs.BugReportDialog"); + if (!BugReportDialog) { + return; + } + Modal.createTrackedDialog('Bug Report Dialog', '', BugReportDialog, { + label: 'react-soft-crash-tile', + }); + }; + + render() { + if (this.state.error) { + const classes = { + mx_EventTile: true, + mx_EventTile_info: true, + mx_EventTile_content: true, + mx_EventTile_tileError: true, + }; + return (
+
+ + {_t("An error occurred while rendering this event.")} + + {_t("Submit debug logs")} + + +
+
); + } + + return this.props.children; + } +} diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index 1d030f5118..adce7f9a03 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -1268,6 +1268,7 @@ "You are about to be taken to a third-party site so you can authenticate your account for use with %(integrationsUrl)s. Do you wish to continue?": "You are about to be taken to a third-party site so you can authenticate your account for use with %(integrationsUrl)s. Do you wish to continue?", "Edited at %(date)s. Click to view edits.": "Edited at %(date)s. Click to view edits.", "edited": "edited", + "An error occurred while rendering this event.": "An error occurred while rendering this event.", "Removed or unknown message type": "Removed or unknown message type", "Message removed by %(userId)s": "Message removed by %(userId)s", "Message removed": "Message removed", From 0d03a8791dc6ba1cdb7ec7dd1e0290f09fcc0b7f Mon Sep 17 00:00:00 2001 From: Zoe Date: Tue, 25 Feb 2020 10:20:42 +0000 Subject: [PATCH 0005/2751] style lint --- res/css/views/rooms/_EventTile.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/res/css/views/rooms/_EventTile.scss b/res/css/views/rooms/_EventTile.scss index 68aca63459..9e683c5fe4 100644 --- a/res/css/views/rooms/_EventTile.scss +++ b/res/css/views/rooms/_EventTile.scss @@ -666,4 +666,4 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody { a { margin-left: 1em; } -} \ No newline at end of file +} From adf6dfe4ea831e08730485f85147d9805f711aa8 Mon Sep 17 00:00:00 2001 From: Zoe Date: Tue, 25 Feb 2020 10:30:35 +0000 Subject: [PATCH 0006/2751] Threaded through the event type to the user --- src/components/structures/MessagePanel.js | 2 +- src/components/views/messages/TileErrorBoundary.js | 2 ++ 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/src/components/structures/MessagePanel.js b/src/components/structures/MessagePanel.js index e6f8de61a9..d35b0fce1f 100644 --- a/src/components/structures/MessagePanel.js +++ b/src/components/structures/MessagePanel.js @@ -576,7 +576,7 @@ export default class MessagePanel extends React.Component { ref={this._collectEventNode.bind(this, eventId)} data-scroll-tokens={scrollToken} > - + {_t("An error occurred while rendering this event.")} + { mxEvent && ` [${mxEvent.getType()}]` } {_t("Submit debug logs")} From d0afd65652bbfcc2888b73219310bb02794be8e5 Mon Sep 17 00:00:00 2001 From: thobyv-kismat Date: Sat, 21 Mar 2020 10:12:55 +0100 Subject: [PATCH 0007/2751] fix view community link icon contrast Signed-off-by: thobyv-kismat --- res/css/structures/_TagPanel.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/res/css/structures/_TagPanel.scss b/res/css/structures/_TagPanel.scss index 472831c0d9..c1c5d92d3c 100644 --- a/res/css/structures/_TagPanel.scss +++ b/res/css/structures/_TagPanel.scss @@ -137,7 +137,7 @@ limitations under the License. top: -8px; border-radius: 8px; background-color: $neutral-badge-color; - color: #ffffff; + color: #000; font-weight: 600; font-size: 10px; text-align: center; From 76104edeca3b8ba37d4a24903fa1e0193dad56c2 Mon Sep 17 00:00:00 2001 From: Aaron Raimist Date: Tue, 24 Mar 2020 21:35:17 -0500 Subject: [PATCH 0008/2751] Mark room as read when escape is pressed Signed-off-by: Aaron Raimist --- src/components/structures/RoomView.js | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/src/components/structures/RoomView.js b/src/components/structures/RoomView.js index 5fd5f42f78..9405a26ab2 100644 --- a/src/components/structures/RoomView.js +++ b/src/components/structures/RoomView.js @@ -560,6 +560,12 @@ export default createReactClass({ handled = true; } break; + + case Key.ESCAPE: + this._messagePanel.forgetReadMarker(); + this.jumpToLiveTimeline(); + handled = true; + break; } if (handled) { From c41b39488b46ac772d3b0c0ba5c9c3b060e495e6 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Wed, 25 Mar 2020 23:35:36 +0000 Subject: [PATCH 0009/2751] Automatically redirect to SSO when the user clicks through to Login Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/components/structures/auth/Login.js | 25 ++++++++++++++++++------- 1 file changed, 18 insertions(+), 7 deletions(-) diff --git a/src/components/structures/auth/Login.js b/src/components/structures/auth/Login.js index bfabc34a62..36df08627e 100644 --- a/src/components/structures/auth/Login.js +++ b/src/components/structures/auth/Login.js @@ -53,6 +53,10 @@ _td("Invalid base_url for m.identity_server"); _td("Identity server URL does not appear to be a valid identity server"); _td("General failure"); +const M_LOGIN_CAS = "m.login.cas"; +const M_LOGIN_SSO = "m.login.sso"; +const SSO_FLOWS = [M_LOGIN_SSO, M_LOGIN_CAS]; + /** * A wire component which glues together login UI components and Login logic */ @@ -122,11 +126,11 @@ export default createReactClass({ 'm.login.password': this._renderPasswordStep, // CAS and SSO are the same thing, modulo the url we link to - 'm.login.cas': () => this._renderSsoStep("cas"), - 'm.login.sso': () => this._renderSsoStep("sso"), + [M_LOGIN_CAS]: () => this._renderSsoStep("cas"), + [M_LOGIN_SSO]: () => this._renderSsoStep("sso"), }; - this._initLoginLogic(); + this._initLoginLogic(true); }, componentWillUnmount: function() { @@ -138,7 +142,7 @@ export default createReactClass({ newProps.serverConfig.isUrl === this.props.serverConfig.isUrl) return; // Ensure that we end up actually logging in to the right place - this._initLoginLogic(newProps.serverConfig.hsUrl, newProps.serverConfig.isUrl); + this._initLoginLogic(false, newProps.serverConfig.hsUrl, newProps.serverConfig.isUrl); }, onPasswordLoginError: function(errorText) { @@ -342,12 +346,12 @@ export default createReactClass({ onTryRegisterClick: function(ev) { const step = this._getCurrentFlowStep(); - if (step === 'm.login.sso' || step === 'm.login.cas') { + if (SSO_FLOWS.includes(step)) { // If we're showing SSO it means that registration is also probably disabled, // so intercept the click and instead pretend the user clicked 'Sign in with SSO'. ev.preventDefault(); ev.stopPropagation(); - const ssoKind = step === 'm.login.sso' ? 'sso' : 'cas'; + const ssoKind = step === M_LOGIN_SSO ? 'sso' : 'cas'; PlatformPeg.get().startSingleSignOn(this._loginLogic.createTemporaryClient(), ssoKind); } else { // Don't intercept - just go through to the register page @@ -369,7 +373,7 @@ export default createReactClass({ }); }, - _initLoginLogic: async function(hsUrl, isUrl) { + _initLoginLogic: async function(initial, hsUrl, isUrl) { hsUrl = hsUrl || this.props.serverConfig.hsUrl; isUrl = isUrl || this.props.serverConfig.isUrl; @@ -429,6 +433,13 @@ export default createReactClass({ continue; } + // if this is the initial render and the flow we choose is SSO/CAS then go to it automatically + // we do not do this when the user has changed to the server manually as that may be jarring. + if (initial && SSO_FLOWS.includes(flows[i].type)) { + const tmpCli = this._loginLogic.createTemporaryClient(); + PlatformPeg.get().startSingleSignOn(tmpCli, flows[i].type === M_LOGIN_SSO ? "sso": "cas"); + } + // we just pick the first flow where we support all the // steps. (we don't have a UI for multiple logins so let's skip // that for now). From 04849f7f0d91ed9bee30db744d8397cf9e835800 Mon Sep 17 00:00:00 2001 From: Zoe Date: Thu, 26 Mar 2020 13:47:32 +0000 Subject: [PATCH 0010/2751] incorporated design feedback --- res/css/views/rooms/_EventTile.scss | 3 +-- src/components/views/messages/TileErrorBoundary.js | 6 +++--- src/i18n/strings/en_EN.json | 3 ++- 3 files changed, 6 insertions(+), 6 deletions(-) diff --git a/res/css/views/rooms/_EventTile.scss b/res/css/views/rooms/_EventTile.scss index 2f89c96d57..59f82808dc 100644 --- a/res/css/views/rooms/_EventTile.scss +++ b/res/css/views/rooms/_EventTile.scss @@ -661,11 +661,10 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody { .mx_EventTile_tileError { color: red; + text-align: center; .mx_EventTile_line span { padding: 4px 8px; - border-radius: 11px; - box-shadow: 0px 0px 3px red inset; } a { diff --git a/src/components/views/messages/TileErrorBoundary.js b/src/components/views/messages/TileErrorBoundary.js index a8e7b144f2..e42ddab16a 100644 --- a/src/components/views/messages/TileErrorBoundary.js +++ b/src/components/views/messages/TileErrorBoundary.js @@ -57,10 +57,10 @@ export default class TileErrorBoundary extends React.Component { return (
- {_t("An error occurred while rendering this event.")} - { mxEvent && ` [${mxEvent.getType()}]` } + {_t("Can't load this message")} + { mxEvent && ` (${mxEvent.getType()})` } - {_t("Submit debug logs")} + {_t("Submit logs")}
diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index cf170fce62..40b1cab99d 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -1294,7 +1294,8 @@ "You are about to be taken to a third-party site so you can authenticate your account for use with %(integrationsUrl)s. Do you wish to continue?": "You are about to be taken to a third-party site so you can authenticate your account for use with %(integrationsUrl)s. Do you wish to continue?", "Edited at %(date)s. Click to view edits.": "Edited at %(date)s. Click to view edits.", "edited": "edited", - "An error occurred while rendering this event.": "An error occurred while rendering this event.", + "Can't load this message": "Can't load this message", + "Submit logs": "Submit logs", "Removed or unknown message type": "Removed or unknown message type", "Message removed by %(userId)s": "Message removed by %(userId)s", "Message removed": "Message removed", From b21cf5edc6fa2ef68fbeec2984c165867f2679db Mon Sep 17 00:00:00 2001 From: Osoitz Date: Thu, 26 Mar 2020 16:45:55 +0000 Subject: [PATCH 0011/2751] Translated using Weblate (Basque) Currently translated at 100.0% (2240 of 2240 strings) Translation: Riot Web/matrix-react-sdk Translate-URL: https://translate.riot.im/projects/riot-web/matrix-react-sdk/eu/ --- src/i18n/strings/eu.json | 18 +++++++++++++++++- 1 file changed, 17 insertions(+), 1 deletion(-) diff --git a/src/i18n/strings/eu.json b/src/i18n/strings/eu.json index 5610493999..68162c1010 100644 --- a/src/i18n/strings/eu.json +++ b/src/i18n/strings/eu.json @@ -2275,5 +2275,21 @@ "Esc": "Esc", "Enter": "Sartu", "Space": "Zuriune-barra", - "End": "Amaiera" + "End": "Amaiera", + "Manually verify all remote sessions": "Egiaztatu eskuz urruneko saio guztiak", + "Update your secure storage": "Eguneratu zure biltegi segurua", + "Self signing private key:": "Norberak sinatutako gako pribatua:", + "cached locally": "cache lokalean", + "not found locally": "ez da lokalean aurkitu", + "User signing private key:": "Erabiltzaileak sinatzeko gako pribatua:", + "Secret Storage key format:": "Biltegi sekretuaren gakoaren formatua:", + "outdated": "zaharkitua", + "up to date": "egunean", + "Individually verify each session used by a user to mark it as trusted, not trusting cross-signed devices.": "Egiaztatu erabiltzaile baten saio bakoitza hau fidagarri gisa markatzeko, ez dira zeharka sinatutako gailuak fidagarritzat jotzen.", + "In encrypted rooms, your messages are secured and only you and the recipient have the unique keys to unlock them.": "Gela zifratuetan, zuon mezuak babestuta daude, zuk zeuk eta hartzaileak bakarrik duzue hauek deszifratzeko gako bakanak.", + "Verify all users in a room to ensure it's secure.": "Egiaztatu gela bateko erabiltzaile guztiak segurua dela baieztatzeko.", + "In encrypted rooms, verify all users to ensure it’s secure.": "Gela zifratuetan, egiaztatu erabiltzaile guztiak segurua dela baieztatzeko.", + "Verified": "Egiaztatuta", + "Verification cancelled": "Egiaztaketa ezeztatuta", + "Compare emoji": "Konparatu emojiak" } From 1110735df9eaafcd1b98775ca5dbacce721222c5 Mon Sep 17 00:00:00 2001 From: Kenneth Larsson Date: Thu, 26 Mar 2020 14:58:40 +0000 Subject: [PATCH 0012/2751] Translated using Weblate (Swedish) Currently translated at 68.3% (1529 of 2240 strings) Translation: Riot Web/matrix-react-sdk Translate-URL: https://translate.riot.im/projects/riot-web/matrix-react-sdk/sv/ --- src/i18n/strings/sv.json | 94 +++++++++++++++++++++++++++++++++++++--- 1 file changed, 89 insertions(+), 5 deletions(-) diff --git a/src/i18n/strings/sv.json b/src/i18n/strings/sv.json index e65e4e2099..3edb02df92 100644 --- a/src/i18n/strings/sv.json +++ b/src/i18n/strings/sv.json @@ -953,7 +953,7 @@ "You are an administrator of this community. You will not be able to rejoin without an invite from another administrator.": "Du är administratör för denna community. Du kommer inte kunna gå med igen utan en inbjudan från en annan administratör.", "The file '%(fileName)s' exceeds this homeserver's size limit for uploads": "Filen '%(fileName)s' överstiger denna hemserverns storleksgräns för uppladdningar", "Unable to load! Check your network connectivity and try again.": "Kan inte ladda! Kolla din nätverksuppkoppling och försök igen.", - "Whether or not you're logged in (we don't record your username)": "Huruvida du är inloggad (vi sparar inte ditt användarnamn)", + "Whether or not you're logged in (we don't record your username)": "Om du är inloggad eller inte (vi sparar inte ditt användarnamn)", "Failed to invite users to the room:": "Kunde inte bjuda in användare till rummet:", "Upgrades a room to a new version": "Uppgraderar ett num till en ny version", "Gets or sets the room topic": "Ger eller sätter ämnet för ett rum", @@ -1349,8 +1349,8 @@ "If you don't want to use to discover and be discoverable by existing contacts you know, enter another identity server below.": "Om du inte vill använda för att upptäcka och upptäckas av befintliga kontakter som du känner, ange en annan identitetsserver nedan.", "Identity Server": "Identitetsserver", "You are not currently using an identity server. To discover and be discoverable by existing contacts you know, add one below.": "Du använder för närvarande inte en identitetsserver. Lägg till en nedan om du vill upptäcka och bli upptäckbar av befintliga kontakter som du känner.", - "Disconnecting from your identity server will mean you won't be discoverable by other users and you won't be able to invite others by email or phone.": "Att koppla från din identitetsserver betyder att du inte kan upptäckas av andra användare och att du inte kommer att kunna bjuda in andra via e-post eller telefon.", - "Using an identity server is optional. If you choose not to use an identity server, you won't be discoverable by other users and you won't be able to invite others by email or phone.": "Att använda en identitetsserver är valfritt. Om du väljer att inte använda en identitetsserver kan du inte upptäckas av andra användare och inte heller bjuda in andra via e-post eller telefon.", + "Disconnecting from your identity server will mean you won't be discoverable by other users and you won't be able to invite others by email or phone.": "Att koppla från din identitetsserver betyder att du inte kan upptäckas av andra användare och att du inte kommer att kunna bjuda in andra via epost eller telefon.", + "Using an identity server is optional. If you choose not to use an identity server, you won't be discoverable by other users and you won't be able to invite others by email or phone.": "Att använda en identitetsserver är valfritt. Om du väljer att inte använda en identitetsserver kan du inte upptäckas av andra användare och inte heller bjuda in andra via epost eller telefon.", "Do not use an identity server": "Använd inte en identitetsserver", "Enter a new identity server": "Ange en ny identitetsserver", "Integration Manager": "Integrationshanterare", @@ -1541,10 +1541,94 @@ "Preview": "Förhandsvisa", "The message you are trying to send is too large.": "Meddelandet du försöker skicka är för stort.", "Find others by phone or email": "Hitta andra via telefon eller epost", - "Be found by phone or email": "Bli hittad via telefon eller e-post", + "Be found by phone or email": "Bli hittad via telefon eller epost", "Terms of Service": "Användarvillkor", "To continue you need to accept the terms of this service.": "För att fortsätta måste du acceptera villkoren för denna tjänst.", "Service": "Tjänst", "Summary": "Sammanfattning", - "Document": "Dokument" + "Document": "Dokument", + "The version of Riot": "Version av Riot", + "Whether you're using Riot on a device where touch is the primary input mechanism": "Om du använder Riot på en enhet där pekskärm är den primära inmatningsmekanismen", + "Whether you're using Riot as an installed Progressive Web App": "Om du använder Riot som en installerad progressiv webbapp", + "Your user agent": "Din användaragent", + "The information being sent to us to help make Riot better includes:": "Informationen som skickas till oss för att förbättra Riot inkluderar:", + "There are unknown sessions in this room: if you proceed without verifying them, it will be possible for someone to eavesdrop on your call.": "Det finns okända sessioner i det här rummet: om du fortsätter utan att verifiera dem kommer det att vara möjligt för någon att lyssna på ditt samtal.", + "Review Sessions": "Granska sessioner", + "If you cancel now, you won't complete verifying the other user.": "Om du avbryter nu kommer du inte att verifiera den andra användaren.", + "If you cancel now, you won't complete verifying your other session.": "Om du avbryter nu kommer du inte att verifiera din andra session.", + "If you cancel now, you won't complete your secret storage operation.": "Om du avbryter nu slutför du inte din operation för hemlig lagring.", + "Cancel entering passphrase?": "Avbryta att ange lösenfras?", + "Setting up keys": "Sätter upp nycklar", + "Verify this session": "Verifiera denna session", + "Encryption upgrade available": "Krypteringsuppgradering tillgänglig", + "Set up encryption": "Ställ in kryptering", + "Unverified session": "Overifierad session", + "Sign In or Create Account": "Logga in eller skapa konto", + "Use your account or create a new one to continue.": "Använd ditt konto eller skapa ett nytt för att fortsätta.", + "Create Account": "Skapa konto", + "Verifies a user, session, and pubkey tuple": "Verifierar en användar-, session- och pubkey-tupel", + "Unknown (user, session) pair:": "Okänt par (användare, session):", + "Session already verified!": "Sessionen är redan verifierad!", + "WARNING: Session already verified, but keys do NOT MATCH!": "VARNING: Sessionen har redan verifierats, men nycklarna MATCHAR INTE!", + "Unable to revoke sharing for email address": "Det gick inte att återkalla delning för e-postadress", + "Unable to share email address": "Det gick inte att dela e-postadress", + "Your email address hasn't been verified yet": "Din e-postadress har inte verifierats än", + "Click the link in the email you received to verify and then click continue again.": "Klicka på länken i e-postmeddelandet för att bekräfta och klicka sedan på Fortsätt igen.", + "Verify the link in your inbox": "Verifiera länken i din inkorg", + "Complete": "Färdigställ", + "Unable to revoke sharing for phone number": "Det gick inte att återkalla delning för telefonnummer", + "Unable to share phone number": "Det gick inte att dela telefonnummer", + "Please enter verification code sent via text.": "Ange verifieringskod skickad via textmeddelande.", + "Discovery options will appear once you have added a phone number above.": "Upptäcktsalternativ visas när du har lagt till ett telefonnummer ovan.", + "Verify session": "Verifiera sessionen", + "Use Legacy Verification (for older clients)": "Använd gammal verifiering (för äldre klienter)", + "Verify by comparing a short text string.": "Verifiera genom att jämföra en kort textsträng.", + "Begin Verifying": "Börja verifiera", + "Waiting for partner to accept...": "Väntar på partner att acceptera...", + "Nothing appearing? Not all clients support interactive verification yet. .": "Dyker inget upp? Alla klienter stöder inte interaktiv verifiering ännu. .", + "Waiting for %(userId)s to confirm...": "Väntar på att %(userId)s ska bekräfta...", + "To verify that this session can be trusted, please check that the key you see in User Settings on that device matches the key below:": "För att verifiera att den här sessionen är betrodd, kontrollera att nyckeln du ser i Användarinställningar på den enheten stämmer med nyckeln nedan:", + "To verify that this session can be trusted, please contact its owner using some other means (e.g. in person or a phone call) and ask them whether the key they see in their User Settings for this session matches the key below:": "För att verifiera att den här sessionen är betrodd, vänligen kontakta dess ägare på annat sätt (t.ex. personligen eller via ett telefonsamtal) och fråga om nyckeln i deras användarinställningar för denna session stämmer med nyckeln nedan:", + "Use two-way text verification": "Använd tvåvägs textverifiering", + "Session name": "Sessionsnamn", + "Session key": "Sessionsnyckel", + "If it matches, press the verify button below. If it doesn't, then someone else is intercepting this session and you probably want to press the blacklist button instead.": "Om det matchar, tryck på verifieringsknappen nedan. Om det inte gör det, avlyssnar någon annan den här sessionen och du vill förmodligen trycka på svartlistaknappen istället.", + "Automatically invite users": "Bjud in användare automatiskt", + "Upgrade private room": "Uppgradera privat rum", + "Upgrade public room": "Uppgradera publikt rum", + "Upgrading a room is an advanced action and is usually recommended when a room is unstable due to bugs, missing features or security vulnerabilities.": "Att uppgradera ett rum är en avancerad åtgärd och rekommenderas vanligtvis när ett rum är instabilt på grund av buggar, saknade funktioner eller säkerhetsproblem.", + "This usually only affects how the room is processed on the server. If you're having problems with your Riot, please report a bug.": "Detta påverkar vanligtvis bara hur rummet bearbetas på servern. Om du har problem med Riot, rapportera ett fel.", + "You'll upgrade this room from to .": "Du kommer att uppgradera detta rum från till .", + "This will allow you to return to your account after signing out, and sign in on other sessions.": "Detta gör att du kan återgå till ditt konto efter att du har loggat ut, och logga in på andra sessioner.", + "Help": "Hjälp", + "Reload": "Ladda om", + "Take picture": "Ta bild", + "Remove for everyone": "Ta bort för alla", + "Remove for me": "Ta bort för mig", + "User Status": "Användarstatus", + "Confirm your identity by entering your account password below.": "Bekräfta din identitet genom att ange ditt kontolösenord nedan.", + "Space used:": "Använt utrymme:", + "Indexed messages:": "Indexerade meddelanden:", + "Indexed rooms:": "Indexerade rum:", + "%(doneRooms)s out of %(totalRooms)s": "%(doneRooms)s av %(totalRooms)s", + "Navigation": "Navigering", + "Calls": "Samtal", + "Room List": "Rumslista", + "Autocomplete": "Komplettera automatiskt", + "Alt": "Alt", + "Alt Gr": "Alt Gr", + "Shift": "Shift", + "Super": "Super", + "Ctrl": "Ctrl", + "Toggle Bold": "Växla fet stil", + "Toggle Italics": "Växla kursiv", + "Toggle Quote": "Växla citat", + "New line": "Ny rad", + "Jump to room search": "Hoppa till rumssökning", + "Page Up": "Page Up", + "Page Down": "Page Down", + "Esc": "Esc", + "Enter": "Enter", + "Space": "Space", + "End": "End" } From b489a7c0d53fa5a6484b605f03249164330c5b76 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Fri, 27 Mar 2020 00:50:41 +0000 Subject: [PATCH 0013/2751] Allow reacting to stickers Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/utils/EventUtils.js | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/src/utils/EventUtils.js b/src/utils/EventUtils.js index 7e33aaed81..ac7ac8c9ec 100644 --- a/src/utils/EventUtils.js +++ b/src/utils/EventUtils.js @@ -31,13 +31,13 @@ export function isContentActionable(mxEvent) { // status is SENT before remote-echo, null after const isSent = !eventStatus || eventStatus === EventStatus.SENT; - if (isSent && mxEvent.getType() === 'm.room.message') { - const content = mxEvent.getContent(); - if ( - content.msgtype && - content.msgtype !== 'm.bad.encrypted' && - content.hasOwnProperty('body') - ) { + if (isSent) { + if (mxEvent.getType() === 'm.room.message') { + const content = mxEvent.getContent(); + if (content.msgtype && content.msgtype !== 'm.bad.encrypted' && content.hasOwnProperty('body')) { + return true; + } + } else if (mxEvent.getType() === 'm.sticker') { return true; } } From 7fbfd73e11e03a192d2bb74e3146b9ea07189e5d Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Fri, 27 Mar 2020 01:17:42 +0000 Subject: [PATCH 0014/2751] Show modal on "instant SSO" Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/BasePlatform.js | 19 ++++++++++++++++++- src/components/structures/auth/Login.js | 2 +- 2 files changed, 19 insertions(+), 2 deletions(-) diff --git a/src/BasePlatform.js b/src/BasePlatform.js index 5d809eb28f..489d9474a1 100644 --- a/src/BasePlatform.js +++ b/src/BasePlatform.js @@ -22,6 +22,11 @@ limitations under the License. import {MatrixClient} from "matrix-js-sdk"; import dis from './dispatcher'; import BaseEventIndexManager from './indexing/BaseEventIndexManager'; +import Modal from "./Modal"; +import InfoDialog from "./components/views/dialogs/InfoDialog"; +import {_t} from "./languageHandler"; +import Spinner from "./components/views/elements/Spinner"; +import React from "react"; /** * Base class for classes that provide platform-specific functionality @@ -183,9 +188,21 @@ export default class BasePlatform { * Begin Single Sign On flows. * @param {MatrixClient} mxClient the matrix client using which we should start the flow * @param {"sso"|"cas"} loginType the type of SSO it is, CAS/SSO. + * @param {boolean} showModal whether or not to show the spinner modal. */ - startSingleSignOn(mxClient: MatrixClient, loginType: "sso"|"cas") { + startSingleSignOn(mxClient: MatrixClient, loginType: "sso"|"cas", showModal: boolean) { const callbackUrl = this.getSSOCallbackUrl(mxClient.getHomeserverUrl(), mxClient.getIdentityServerUrl()); + if (showModal) { + Modal.createTrackedDialog('BasePlatform', 'SSO', InfoDialog, { + title: _t("Single sign-on"), + description: , + }); + } window.location.href = mxClient.getSsoLoginUrl(callbackUrl.toString(), loginType); // redirect to SSO } } diff --git a/src/components/structures/auth/Login.js b/src/components/structures/auth/Login.js index 36df08627e..6c6a8bedbd 100644 --- a/src/components/structures/auth/Login.js +++ b/src/components/structures/auth/Login.js @@ -437,7 +437,7 @@ export default createReactClass({ // we do not do this when the user has changed to the server manually as that may be jarring. if (initial && SSO_FLOWS.includes(flows[i].type)) { const tmpCli = this._loginLogic.createTemporaryClient(); - PlatformPeg.get().startSingleSignOn(tmpCli, flows[i].type === M_LOGIN_SSO ? "sso": "cas"); + PlatformPeg.get().startSingleSignOn(tmpCli, flows[i].type === M_LOGIN_SSO ? "sso": "cas", true); } // we just pick the first flow where we support all the From bfee6d83194ff6d0bb16de12dac3685e9c90ec1d Mon Sep 17 00:00:00 2001 From: Besnik Bleta Date: Thu, 26 Mar 2020 18:35:19 +0000 Subject: [PATCH 0015/2751] Translated using Weblate (Albanian) Currently translated at 99.7% (2233 of 2240 strings) Translation: Riot Web/matrix-react-sdk Translate-URL: https://translate.riot.im/projects/riot-web/matrix-react-sdk/sq/ --- src/i18n/strings/sq.json | 16 +++++++++++++++- 1 file changed, 15 insertions(+), 1 deletion(-) diff --git a/src/i18n/strings/sq.json b/src/i18n/strings/sq.json index 543b5fadb3..7fd06eca15 100644 --- a/src/i18n/strings/sq.json +++ b/src/i18n/strings/sq.json @@ -2280,5 +2280,19 @@ "Toggle video on/off": "Aktivizoni/çaktivizoni videon", "Previous/next unread room or DM": "Dhoma ose MD i palexuar i mëparshëm/pasues", "Previous/next room or DM": "Dhoma ose MD i mëparshëm/pasues", - "Toggle right panel": "Hap/mbyll panelin djathtas" + "Toggle right panel": "Hap/mbyll panelin djathtas", + "Unverified login. Was this you?": "Hyrje e paverifikuar. A qetë ju?", + "Manually verify all remote sessions": "Verifikoni dorazi krejt sesionet e largët", + "Update your secure storage": "Përditësoni depozitën tuaj të sigurt", + "Self signing private key:": "Kyç privat vetënënshkrimi:", + "cached locally": "ruajtur në fshehtinë lokalisht", + "not found locally": "i pagjetur lokalisht", + "User signing private key:": "Kyç privat nënshkrimesh përdoruesi:", + "Individually verify each session used by a user to mark it as trusted, not trusting cross-signed devices.": "Verifikoni individualisht çdo sesion të përdorur nga një përdorues, për t’i vënë shenjë si i besuar, duke mos besuar pajisje cross-signed.", + "In encrypted rooms, your messages are secured and only you and the recipient have the unique keys to unlock them.": "Në dhoma të fshehtëzuara, mesazhet tuaj sigurohen dhe vetëm ju dhe marrësi ka kyçet unikë për shkyçjen e tyre.", + "Verify all users in a room to ensure it's secure.": "Verifiko krejt përdoruesit në dhomë, për të garantuar se është e sigurt.", + "In encrypted rooms, verify all users to ensure it’s secure.": "Në dhoma të fshehtëzuara, verifikoni krejt përdoruesi për të garantuar se është e sigurt.", + "Verified": "I verifikuar", + "Verification cancelled": "Verifikimi u anulua", + "Compare emoji": "Krahasoni emoji" } From 538816a62608c1f7c47d2a279ff475c1841b58d3 Mon Sep 17 00:00:00 2001 From: Jeff Huang Date: Fri, 27 Mar 2020 02:42:44 +0000 Subject: [PATCH 0016/2751] Translated using Weblate (Chinese (Traditional)) Currently translated at 100.0% (2240 of 2240 strings) Translation: Riot Web/matrix-react-sdk Translate-URL: https://translate.riot.im/projects/riot-web/matrix-react-sdk/zh_Hant/ --- src/i18n/strings/zh_Hant.json | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/src/i18n/strings/zh_Hant.json b/src/i18n/strings/zh_Hant.json index eb4f94172e..58ebe3767a 100644 --- a/src/i18n/strings/zh_Hant.json +++ b/src/i18n/strings/zh_Hant.json @@ -2294,5 +2294,15 @@ "Self signing private key:": "自行簽章私鑰：", "cached locally": "本機快取", "not found locally": "在本機找不到", - "User signing private key:": "使用者簽章私鑰：" + "User signing private key:": "使用者簽章私鑰：", + "Unverified login. Was this you?": "未驗證的登入。是您嗎？", + "Manually verify all remote sessions": "手動驗證所有遠端工作階段", + "Update your secure storage": "更新您的安全儲存空間", + "Individually verify each session used by a user to mark it as trusted, not trusting cross-signed devices.": "單獨驗證使用者使用的每個工作階段以將其標記為受信任，而非信任交叉簽章的裝置。", + "In encrypted rooms, your messages are secured and only you and the recipient have the unique keys to unlock them.": "在已加密的聊天室中，您的訊息相當安全，只有您與接收者有獨一無二的金鑰可以將其解鎖。", + "Verify all users in a room to ensure it's secure.": "驗證所有在聊天室中的使用者以確保其安全。", + "In encrypted rooms, verify all users to ensure it’s secure.": "在已加密的聊天室中，驗證所有使用者以確保其安全。", + "Verified": "已驗證", + "Verification cancelled": "驗證已取消", + "Compare emoji": "比較顏文字" } From 2ec6210ebdbbf83a558b9230e153a3ce5fbd0881 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Stanislav=20Luke=C5=A1?= Date: Thu, 26 Mar 2020 19:50:11 +0000 Subject: [PATCH 0017/2751] Translated using Weblate (Czech) Currently translated at 96.7% (2167 of 2240 strings) Translation: Riot Web/matrix-react-sdk Translate-URL: https://translate.riot.im/projects/riot-web/matrix-react-sdk/cs/ --- src/i18n/strings/cs.json | 47 +++++++++++++++++++++++++++++++++++++++- 1 file changed, 46 insertions(+), 1 deletion(-) diff --git a/src/i18n/strings/cs.json b/src/i18n/strings/cs.json index 46675489b4..ef2e95949a 100644 --- a/src/i18n/strings/cs.json +++ b/src/i18n/strings/cs.json @@ -2170,5 +2170,50 @@ "Mark all as read": "Označit vše jako přečtené", "Not currently indexing messages for any room.": "Aktuálně neindexujeme žádné zprávy.", "Currently indexing: %(currentRoom)s.": "Aktuálně indexujeme: %(currentRoom)s.", - "%(doneRooms)s out of %(totalRooms)s": "%(doneRooms)s z %(totalRooms)s" + "%(doneRooms)s out of %(totalRooms)s": "%(doneRooms)s z %(totalRooms)s", + "Review Sessions": "Prověřit relace", + "Unverified login. Was this you?": "Neověřené přihlášeni. Jste to vy?", + "%(senderDisplayName)s changed the room name from %(oldRoomName)s to %(newRoomName)s.": "%(senderDisplayName)s změnil/a jméno místnosti z %(oldRoomName)s na %(newRoomName)s.", + "%(senderName)s added the alternative addresses %(addresses)s for this room.|other": "%(senderName)s přidal/a této místnosti alternativní adresy %(addresses)s.", + "%(senderName)s added the alternative addresses %(addresses)s for this room.|one": "%(senderName)s přidal/a této místnosti alternativní adresu %(addresses)s.", + "%(senderName)s removed the alternative addresses %(addresses)s for this room.|other": "%(senderName)s odebral/a této místnosti alternativní adresy %(addresses)s.", + "%(senderName)s removed the alternative addresses %(addresses)s for this room.|one": "%(senderName)s odebral/a této místnosti alternativní adresu %(addresses)s.", + "%(senderName)s changed the alternative addresses for this room.": "%(senderName)s změnil/a této místnosti alternativní adresy.", + "%(senderName)s changed the main and alternative addresses for this room.": "%(senderName)s změnil/a této místnosti hlavní a alternativní adresy.", + "%(senderName)s changed the addresses for this room.": "%(senderName)s změnil/a této místnosti adresy.", + "Manually Verify by Text": "Manuální textové ověření", + "Interactively verify by Emoji": "Interaktivní ověření s emotikonami", + "Support adding custom themes": "Umožnit přidání vlastního vzhledu", + "Manually verify all remote sessions": "Manuálně ověřit všechny relace", + "Update your secure storage": "Aktualizovat vaše bezpečné úložistě", + "cached locally": "uložen lokálně", + "not found locally": "nenalezen lolálně", + "Secret Storage key format:": "Formát klíče Bezpečného Úložistě:", + "outdated": "zastaralý", + "up to date": "aktuální", + "Individually verify each session used by a user to mark it as trusted, not trusting cross-signed devices.": "Individuálně ověřit každou uživatelovu relaci a označit jí za důvěryhodnou, bez důvěry v cross-signing.", + "Invalid theme schema.": "Neplatné schéma vzhledu.", + "Error downloading theme information.": "Nepovedlo se stáhnout informace o vzhledu.", + "Theme added!": "Motiv vzhledu přidán!", + "Custom theme URL": "URL adresa vlastního vzhledu", + "Add theme": "Přidat motiv vzhledu", + "Keyboard Shortcuts": "Klávesové zkratky", + "Scroll to most recent messages": "Přejít na poslední zprávy", + "There was an error updating the room's alternative addresses. It may not be allowed by the server or a temporary failure occurred.": "Nepovedlo se změnit alternativní adresy místnosti. Možná to server neumožňuje a nebo je to dočasná chyba.", + "You don't have permission to delete the alias.": "Nemáte oprávnění odebrat alias.", + "Local address": "Lokální adresa", + "Published Addresses": "Publikovaná adresa", + "Published addresses can be used by anyone on any server to join your room. To publish an address, it needs to be set as a local address first.": "Publikovaná adresa může být použíta kýmkoli na libovolném serveru pro přidání se do místnosti. Abyste mohli adresu publikovat, musí být nejdříve nastavená jako lokální.", + "Other published addresses:": "Další publikované adresy:", + "No other published addresses yet, add one below": "Zatím žádné další publikované adresy, přidejte nějakou níže", + "New published address (e.g. #alias:server)": "Nové publikované adresy (například #alias:server)", + "Local Addresses": "Lokální Adresy", + "Set addresses for this room so users can find this room through your homeserver (%(localDomain)s)": "Nastavit adresy pro tuto místnost, aby uživatelé mohli místnost najít zkrze váš domovský server (%(localDomain)s)", + "In encrypted rooms, your messages are secured and only you and the recipient have the unique keys to unlock them.": "V šifrovaných místnostech jsou vaše zprávy bezpečné a pouze vy a příjemce má klíče k jejich rozšifrování.", + "Verify all users in a room to ensure it's secure.": "Ověřit všechny uživatele v místnosti, abyste se přesvědčili o bezpečnosti.", + "In encrypted rooms, verify all users to ensure it’s secure.": "V šifrovaných místnostech ověřit všechny uživatele, abyste se přesvědčili o bezpečnosti.", + "Verified": "Oveřený", + "Verification cancelled": "Oveření bylo zrušeno", + "Compare emoji": "Porovnejte emotikony", + "Enter a server name": "Zadejte jméno serveru" } From b538bfa7dad40d3bae986cec8b6d07ce684d0747 Mon Sep 17 00:00:00 2001 From: Szimszon Date: Thu, 26 Mar 2020 20:18:17 +0000 Subject: [PATCH 0018/2751] Translated using Weblate (Hungarian) Currently translated at 100.0% (2240 of 2240 strings) Translation: Riot Web/matrix-react-sdk Translate-URL: https://translate.riot.im/projects/riot-web/matrix-react-sdk/hu/ --- src/i18n/strings/hu.json | 78 ++++++++++++++++++++++++++++++++++++++-- 1 file changed, 76 insertions(+), 2 deletions(-) diff --git a/src/i18n/strings/hu.json b/src/i18n/strings/hu.json index 7e78c367f7..271d7c5bc7 100644 --- a/src/i18n/strings/hu.json +++ b/src/i18n/strings/hu.json @@ -1650,7 +1650,7 @@ "Make this room public": "A szoba legyen nyilvános", "Hide advanced": "Haladó elrejtése", "Show advanced": "Haladó megmutatása", - "Block users on other matrix homeservers from joining this room (This setting cannot be changed later!)": "Felhasználók más matrix szerverekről a szobába való belépésének megakadályozása (Ezt a beállítást később nem lehet megváltoztatni!)", + "Block users on other matrix homeservers from joining this room (This setting cannot be changed later!)": "Más szervereken lévő felhasználók belépésének letiltása-csak helyi szoba (Ezt a beállítást később nem lehet megváltoztatni!)", "Close dialog": "Ablak bezárása", "Show previews/thumbnails for images": "Előnézet/bélyegkép mutatása a képekhez", "Clear cache and reload": "Gyorsítótár ürítése és újratöltés", @@ -2226,5 +2226,79 @@ "Are you sure you want to remove %(serverName)s": "Biztos, hogy törölni szeretnéd: %(serverName)s", "Remove server": "Szerver törlése", "Matrix": "Matrix", - "Add a new server": "Új szerver hozzáadása" + "Add a new server": "Új szerver hozzáadása", + "Unverified login. Was this you?": "Ellenőrizetlen bejelentkezés. Te voltál?", + "Manually verify all remote sessions": "Az összes távoli munkamenet manuális ellenőrzése", + "Update your secure storage": "A biztonsági tárolód frissítése", + "Individually verify each session used by a user to mark it as trusted, not trusting cross-signed devices.": "A felhasználó által használt munkamenetek ellenőrzése egyenként, a kereszt-aláírással hitelesített eszközökben nem bízol meg.", + "Published addresses can be used by anyone on any server to join your room. To publish an address, it needs to be set as a local address first.": "A nyilvánosságra hozott címeket bárki bármelyik szerveren használhatja a szobádba való belépéshez. A cím közzétételéhez először helyi címnek kell beállítani.", + "Set addresses for this room so users can find this room through your homeserver (%(localDomain)s)": "Állíts be címet ehhez a szobához, hogy a felhasználók a matrix szervereden megtalálhassák (%(localDomain)s)", + "In encrypted rooms, your messages are secured and only you and the recipient have the unique keys to unlock them.": "A titkosított szobákban az üzeneted biztonságban van és csak neked és a címzetteknek van meg az egyedi kulcs a visszafejtéshez.", + "Verify all users in a room to ensure it's secure.": "Ellenőrizd a szoba összes tagját, hogy meggyőződhess a biztonságról.", + "In encrypted rooms, verify all users to ensure it’s secure.": "Titkosított szobákban ellenőrizd a szoba összes tagját, hogy meggyőződhess a biztonságról.", + "Verified": "Hitelesített", + "Verification cancelled": "Ellenőrzés megszakítva", + "Compare emoji": "Emodzsik összehasonlítása", + "Enter the name of a new server you want to explore.": "Add meg a felfedezni kívánt új szerver nevét.", + "Server name": "Szerver neve", + "Add a new server...": "Új szerver hozzáadása…", + "%(networkName)s rooms": "%(networkName)s szobák", + "Matrix rooms": "Matrix szobák", + "Start a conversation with someone using their name, username (like ) or email address.": "Indíts beszélgetést valakinek a nevével, felhasználói nevével (mint ) vagy e-mail címével.", + "a new master key signature": "az új mester kulcs aláírás", + "a new cross-signing key signature": "az új eszközök közötti kulcs aláírása", + "a device cross-signing signature": "az eszköz eszközök közötti aláírása", + "a key signature": "kulcs aláírás", + "Riot encountered an error during upload of:": "Riot hibába ütközött a feltöltés közben:", + "Upload completed": "A feltöltés befejeződött", + "Cancelled signature upload": "Az aláírás feltöltése megszakítva", + "Unabled to upload": "A feltöltés nem lehetséges", + "Signature upload success": "Az aláírások feltöltése sikeres", + "Signature upload failed": "Az aláírások feltöltése sikertelen", + "Confirm by comparing the following with the User Settings in your other session:": "Erősítsd meg a felhasználói beállítások összehasonlításával a többi munkamenetedben:", + "Confirm this user's session by comparing the following with their User Settings:": "Ezt a munkamenetet hitelesítsd az ő felhasználói beállításának az összehasonlításával:", + "If they don't match, the security of your communication may be compromised.": "Ha nem egyeznek akkor a kommunikációtok biztonsága veszélyben lehet.", + "Open an existing session & use it to verify this one, granting it access to encrypted messages.": "Nyiss meg egy meglévő munkamenetet és használd ennek az ellenőrzéséhez, hogy a titkosított üzenetekhez hozzáférhessen.", + "Waiting…": "Várakozik…", + "If you can’t access one, ": "Ha nem érsz el egyet sem, ", + "Navigation": "Navigálás", + "Calls": "Hívások", + "Room List": "Szoba lista", + "Autocomplete": "Automatikus kiegészítés", + "Alt": "Alt", + "Alt Gr": "Alt Gr", + "Shift": "Shift", + "Super": "Super", + "Ctrl": "Ctrl", + "Toggle Bold": "Félkövér váltása", + "Toggle Italics": "Dőlt váltása", + "Toggle Quote": "Idézet váltása", + "New line": "Új sor", + "Navigate recent messages to edit": "Friss üzenetekben navigálás a szerkesztéshez", + "Jump to start/end of the composer": "Az üzenet elejére/végére ugrás a szerkesztőben", + "Navigate composer history": "A szerkesztő korábbi üzeneteiben navigálás", + "Toggle microphone mute": "Mikrofon némítás váltása", + "Toggle video on/off": "Videó ki-/bekapcsolás váltása", + "Jump to room search": "A szoba keresésre ugrás", + "Navigate up/down in the room list": "A szoba listában fel/le navigál", + "Select room from the room list": "Szoba kiválasztása a szoba listából", + "Collapse room list section": "Szoba lista rész bezárása", + "Expand room list section": "Szoba lista rész kinyitása", + "Clear room list filter field": "Szoba lista szűrő mező törlése", + "Scroll up/down in the timeline": "Az idővonalon görgetés fel/le", + "Previous/next unread room or DM": "Előző/következő olvasatlan szoba vagy közvetlen üzenet", + "Previous/next room or DM": "Előző/következő szoba vagy közvetlen üzenet", + "Toggle the top left menu": "Bal felső menü ki-/bekapcsolása", + "Close dialog or context menu": "Párbeszédablak vagy menü bezárása", + "Activate selected button": "Kiválasztott gomb aktiválása", + "Toggle right panel": "Jobb oldali panel váltása", + "Toggle this dialog": "Ennek a párbeszédablaknak a váltása", + "Move autocomplete selection up/down": "Automatikus kiegészítés kijelölésének mozgatása fel/le", + "Cancel autocomplete": "Automatikus kiegészítés megszakítása", + "Page Up": "Page Up", + "Page Down": "Page Down", + "Esc": "Esc", + "Enter": "Enter", + "Space": "Szóköz", + "End": "End" } From 98f9f1e956235c290586f95e9b10fcfe2231c487 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Fri, 27 Mar 2020 09:59:43 +0000 Subject: [PATCH 0019/2751] i18n Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/i18n/strings/en_EN.json | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index 12bd462937..4677f40ce1 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -25,6 +25,8 @@ "Error": "Error", "Unable to load! Check your network connectivity and try again.": "Unable to load! Check your network connectivity and try again.", "Dismiss": "Dismiss", + "Single sign-on": "Single sign-on", + "Click here if you're not redirected automatically": "Click here if you're not redirected automatically", "Call Failed": "Call Failed", "There are unknown sessions in this room: if you proceed without verifying them, it will be possible for someone to eavesdrop on your call.": "There are unknown sessions in this room: if you proceed without verifying them, it will be possible for someone to eavesdrop on your call.", "Review Sessions": "Review Sessions", From 15f61dca3503912d7e83390fae487721956fcdff Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?K=C3=A9vin=20C?= Date: Fri, 27 Mar 2020 09:43:34 +0000 Subject: [PATCH 0020/2751] Translated using Weblate (French) Currently translated at 100.0% (2241 of 2241 strings) Translation: Riot Web/matrix-react-sdk Translate-URL: https://translate.riot.im/projects/riot-web/matrix-react-sdk/fr/ --- src/i18n/strings/fr.json | 17 ++++++++++++++++- 1 file changed, 16 insertions(+), 1 deletion(-) diff --git a/src/i18n/strings/fr.json b/src/i18n/strings/fr.json index 941fd209f2..eb7e11c0f2 100644 --- a/src/i18n/strings/fr.json +++ b/src/i18n/strings/fr.json @@ -2291,5 +2291,20 @@ "Toggle right panel": "Afficher/masquer le panneau de droite", "Secret Storage key format:": "Format de clé du coffre secret :", "outdated": "obsolète", - "up to date": "à jour" + "up to date": "à jour", + "Unverified login. Was this you?": "Connexion non vérifiée. Était-ce vous ?", + "Manually verify all remote sessions": "Vérifier manuellement toutes les sessions à distance", + "Update your secure storage": "Mettre à jour votre coffre sécurisé", + "Self signing private key:": "Clé privée d’auto-signature :", + "cached locally": "mise en cache localement", + "not found locally": "non trouvée localement", + "User signing private key:": "Clé privée de signature de l’utilisateur :", + "Session backup key:": "Clé de sauvegarde de session :", + "Individually verify each session used by a user to mark it as trusted, not trusting cross-signed devices.": "Vérifiez individuellement chaque session utilisée par un utilisateur pour la marquer comme fiable, sans faire confiance aux appareils signés avec la signature croisée.", + "In encrypted rooms, your messages are secured and only you and the recipient have the unique keys to unlock them.": "Dans les salons chiffrés, vos messages sont sécurisés et seuls vous et le destinataire avez les clés uniques pour les déchiffrer.", + "Verify all users in a room to ensure it's secure.": "Vérifiez tous les utilisateurs d’un salon pour vous assurer qu’il est sécurisé.", + "In encrypted rooms, verify all users to ensure it’s secure.": "Dans les salons chiffrés, vérifiez tous les utilisateurs pour vous assurer qu’il est sécurisé.", + "Verified": "Vérifié", + "Verification cancelled": "Vérification annulée", + "Compare emoji": "Comparer des émojis" } From 548e9184372d9a7c8a74a07841f97134ee55fbb4 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Fri, 27 Mar 2020 12:01:10 +0000 Subject: [PATCH 0021/2751] only auto-sso when disable_custom_urls is true Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/components/structures/auth/Login.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/structures/auth/Login.js b/src/components/structures/auth/Login.js index 6c6a8bedbd..134f6fa6f3 100644 --- a/src/components/structures/auth/Login.js +++ b/src/components/structures/auth/Login.js @@ -435,7 +435,8 @@ export default createReactClass({ // if this is the initial render and the flow we choose is SSO/CAS then go to it automatically // we do not do this when the user has changed to the server manually as that may be jarring. - if (initial && SSO_FLOWS.includes(flows[i].type)) { + // Only allow it when disable_custom_urls is asserted so that we don't prevent user from changing HS URL + if (initial && SdkConfig.get()['disable_custom_urls'] && SSO_FLOWS.includes(flows[i].type)) { const tmpCli = this._loginLogic.createTemporaryClient(); PlatformPeg.get().startSingleSignOn(tmpCli, flows[i].type === M_LOGIN_SSO ? "sso": "cas", true); } From db6f88c66a76736ce72ec0d22df6e6627b0a59ed Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Fri, 27 Mar 2020 14:02:32 +0000 Subject: [PATCH 0022/2751] Welcome page, support $ssoUrl and $casUrl placeholders Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/components/structures/EmbeddedPage.js | 9 +++++++++ src/components/structures/MatrixChat.js | 2 +- src/components/views/auth/Welcome.js | 15 ++++++++++++++- 3 files changed, 24 insertions(+), 2 deletions(-) diff --git a/src/components/structures/EmbeddedPage.js b/src/components/structures/EmbeddedPage.js index f854dc955f..a0a95ac6f1 100644 --- a/src/components/structures/EmbeddedPage.js +++ b/src/components/structures/EmbeddedPage.js @@ -37,6 +37,8 @@ export default class EmbeddedPage extends React.PureComponent { className: PropTypes.string, // Whether to wrap the page in a scrollbar scrollbar: PropTypes.bool, + // Map of keys to replace with values, e.g {$placeholder: "value"} + replaceMap: PropTypes.object, }; static contextType = MatrixClientContext; @@ -81,6 +83,13 @@ export default class EmbeddedPage extends React.PureComponent { } body = body.replace(/_t\(['"]([\s\S]*?)['"]\)/mg, (match, g1)=>this.translate(g1)); + + if (this.props.replaceMap) { + Object.keys(this.props.replaceMap).forEach(key => { + body = body.split(key).join(this.props.replaceMap[key]); + }); + } + this.setState({ page: body }); }, ); diff --git a/src/components/structures/MatrixChat.js b/src/components/structures/MatrixChat.js index 52002f0591..e6702e385e 100644 --- a/src/components/structures/MatrixChat.js +++ b/src/components/structures/MatrixChat.js @@ -2021,7 +2021,7 @@ export default createReactClass({ } } else if (this.state.view === VIEWS.WELCOME) { const Welcome = sdk.getComponent('auth.Welcome'); - view = ; + view = ; } else if (this.state.view === VIEWS.REGISTER) { const Registration = sdk.getComponent('structures.auth.Registration'); view = ( diff --git a/src/components/views/auth/Welcome.js b/src/components/views/auth/Welcome.js index 58f117ea36..60ceae5343 100644 --- a/src/components/views/auth/Welcome.js +++ b/src/components/views/auth/Welcome.js @@ -18,6 +18,7 @@ import React from 'react'; import * as sdk from '../../../index'; import SdkConfig from '../../../SdkConfig'; import AuthPage from "./AuthPage"; +import * as Matrix from "matrix-js-sdk"; export default class Welcome extends React.PureComponent { render() { @@ -33,11 +34,23 @@ export default class Welcome extends React.PureComponent { pageUrl = 'welcome.html'; } + const {hsUrl, isUrl} = this.props.serverConfig; + const tmpClient = Matrix.createClient({ + baseUrl: hsUrl, + idBaseUrl: isUrl, + }); + const callbackUrl = this.getSSOCallbackUrl(tmpClient.getHomeserverUrl(), tmpClient.getIdentityServerUrl()); + return (
-
From f4d3cc8ee62671336981f486561be58d4e3e0f6c Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Fri, 27 Mar 2020 14:05:14 +0000 Subject: [PATCH 0023/2751] revert stale changes Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/BasePlatform.js | 19 +----------------- src/components/structures/auth/Login.js | 26 +++++++------------------ src/components/views/auth/Welcome.js | 4 ++++ 3 files changed, 12 insertions(+), 37 deletions(-) diff --git a/src/BasePlatform.js b/src/BasePlatform.js index 489d9474a1..5d809eb28f 100644 --- a/src/BasePlatform.js +++ b/src/BasePlatform.js @@ -22,11 +22,6 @@ limitations under the License. import {MatrixClient} from "matrix-js-sdk"; import dis from './dispatcher'; import BaseEventIndexManager from './indexing/BaseEventIndexManager'; -import Modal from "./Modal"; -import InfoDialog from "./components/views/dialogs/InfoDialog"; -import {_t} from "./languageHandler"; -import Spinner from "./components/views/elements/Spinner"; -import React from "react"; /** * Base class for classes that provide platform-specific functionality @@ -188,21 +183,9 @@ export default class BasePlatform { * Begin Single Sign On flows. * @param {MatrixClient} mxClient the matrix client using which we should start the flow * @param {"sso"|"cas"} loginType the type of SSO it is, CAS/SSO. - * @param {boolean} showModal whether or not to show the spinner modal. */ - startSingleSignOn(mxClient: MatrixClient, loginType: "sso"|"cas", showModal: boolean) { + startSingleSignOn(mxClient: MatrixClient, loginType: "sso"|"cas") { const callbackUrl = this.getSSOCallbackUrl(mxClient.getHomeserverUrl(), mxClient.getIdentityServerUrl()); - if (showModal) { - Modal.createTrackedDialog('BasePlatform', 'SSO', InfoDialog, { - title: _t("Single sign-on"), - description: , - }); - } window.location.href = mxClient.getSsoLoginUrl(callbackUrl.toString(), loginType); // redirect to SSO } } diff --git a/src/components/structures/auth/Login.js b/src/components/structures/auth/Login.js index 134f6fa6f3..bfabc34a62 100644 --- a/src/components/structures/auth/Login.js +++ b/src/components/structures/auth/Login.js @@ -53,10 +53,6 @@ _td("Invalid base_url for m.identity_server"); _td("Identity server URL does not appear to be a valid identity server"); _td("General failure"); -const M_LOGIN_CAS = "m.login.cas"; -const M_LOGIN_SSO = "m.login.sso"; -const SSO_FLOWS = [M_LOGIN_SSO, M_LOGIN_CAS]; - /** * A wire component which glues together login UI components and Login logic */ @@ -126,11 +122,11 @@ export default createReactClass({ 'm.login.password': this._renderPasswordStep, // CAS and SSO are the same thing, modulo the url we link to - [M_LOGIN_CAS]: () => this._renderSsoStep("cas"), - [M_LOGIN_SSO]: () => this._renderSsoStep("sso"), + 'm.login.cas': () => this._renderSsoStep("cas"), + 'm.login.sso': () => this._renderSsoStep("sso"), }; - this._initLoginLogic(true); + this._initLoginLogic(); }, componentWillUnmount: function() { @@ -142,7 +138,7 @@ export default createReactClass({ newProps.serverConfig.isUrl === this.props.serverConfig.isUrl) return; // Ensure that we end up actually logging in to the right place - this._initLoginLogic(false, newProps.serverConfig.hsUrl, newProps.serverConfig.isUrl); + this._initLoginLogic(newProps.serverConfig.hsUrl, newProps.serverConfig.isUrl); }, onPasswordLoginError: function(errorText) { @@ -346,12 +342,12 @@ export default createReactClass({ onTryRegisterClick: function(ev) { const step = this._getCurrentFlowStep(); - if (SSO_FLOWS.includes(step)) { + if (step === 'm.login.sso' || step === 'm.login.cas') { // If we're showing SSO it means that registration is also probably disabled, // so intercept the click and instead pretend the user clicked 'Sign in with SSO'. ev.preventDefault(); ev.stopPropagation(); - const ssoKind = step === M_LOGIN_SSO ? 'sso' : 'cas'; + const ssoKind = step === 'm.login.sso' ? 'sso' : 'cas'; PlatformPeg.get().startSingleSignOn(this._loginLogic.createTemporaryClient(), ssoKind); } else { // Don't intercept - just go through to the register page @@ -373,7 +369,7 @@ export default createReactClass({ }); }, - _initLoginLogic: async function(initial, hsUrl, isUrl) { + _initLoginLogic: async function(hsUrl, isUrl) { hsUrl = hsUrl || this.props.serverConfig.hsUrl; isUrl = isUrl || this.props.serverConfig.isUrl; @@ -433,14 +429,6 @@ export default createReactClass({ continue; } - // if this is the initial render and the flow we choose is SSO/CAS then go to it automatically - // we do not do this when the user has changed to the server manually as that may be jarring. - // Only allow it when disable_custom_urls is asserted so that we don't prevent user from changing HS URL - if (initial && SdkConfig.get()['disable_custom_urls'] && SSO_FLOWS.includes(flows[i].type)) { - const tmpCli = this._loginLogic.createTemporaryClient(); - PlatformPeg.get().startSingleSignOn(tmpCli, flows[i].type === M_LOGIN_SSO ? "sso": "cas", true); - } - // we just pick the first flow where we support all the // steps. (we don't have a UI for multiple logins so let's skip // that for now). diff --git a/src/components/views/auth/Welcome.js b/src/components/views/auth/Welcome.js index 60ceae5343..70c5569cd9 100644 --- a/src/components/views/auth/Welcome.js +++ b/src/components/views/auth/Welcome.js @@ -19,6 +19,10 @@ import * as sdk from '../../../index'; import SdkConfig from '../../../SdkConfig'; import AuthPage from "./AuthPage"; import * as Matrix from "matrix-js-sdk"; +import {_td} from "../../../languageHandler"; + +// translatable strings for Welcome pages +_td("Sign in with SSO"); export default class Welcome extends React.PureComponent { render() { From 6664535a269da603a88562f1cf943d405d2c425e Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Fri, 27 Mar 2020 14:05:32 +0000 Subject: [PATCH 0024/2751] change welcome page placeholders Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/components/views/auth/Welcome.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/views/auth/Welcome.js b/src/components/views/auth/Welcome.js index 70c5569cd9..1893b04d76 100644 --- a/src/components/views/auth/Welcome.js +++ b/src/components/views/auth/Welcome.js @@ -52,8 +52,8 @@ export default class Welcome extends React.PureComponent { className="mx_WelcomePage" url={pageUrl} replaceMap={{ - "$ssoUrl": tmpClient.getSsoLoginUrl(callbackUrl.toString(), "sso"), - "$casUrl": tmpClient.getSsoLoginUrl(callbackUrl.toString(), "cas"), + "$riot:ssoUrl": tmpClient.getSsoLoginUrl(callbackUrl.toString(), "sso"), + "$riot:casUrl": tmpClient.getSsoLoginUrl(callbackUrl.toString(), "cas"), }} /> From de0895b88193aca8e01c61b4e175a7812317dfa2 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Fri, 27 Mar 2020 14:06:21 +0000 Subject: [PATCH 0025/2751] i18n Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/i18n/strings/en_EN.json | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index 4677f40ce1..fbb3fd9f6f 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -25,8 +25,6 @@ "Error": "Error", "Unable to load! Check your network connectivity and try again.": "Unable to load! Check your network connectivity and try again.", "Dismiss": "Dismiss", - "Single sign-on": "Single sign-on", - "Click here if you're not redirected automatically": "Click here if you're not redirected automatically", "Call Failed": "Call Failed", "There are unknown sessions in this room: if you proceed without verifying them, it will be possible for someone to eavesdrop on your call.": "There are unknown sessions in this room: if you proceed without verifying them, it will be possible for someone to eavesdrop on your call.", "Review Sessions": "Review Sessions", @@ -1872,6 +1870,7 @@ "Find other public servers or use a custom server": "Find other public servers or use a custom server", "Sign in to your Matrix account on %(serverName)s": "Sign in to your Matrix account on %(serverName)s", "Sign in to your Matrix account on ": "Sign in to your Matrix account on ", + "Sign in with SSO": "Sign in with SSO", "Sorry, your browser is not able to run Riot.": "Sorry, your browser is not able to run Riot.", "Riot uses many advanced browser features, some of which are not available or experimental in your current browser.": "Riot uses many advanced browser features, some of which are not available or experimental in your current browser.", "Please install Chrome, Firefox, or Safari for the best experience.": "Please install Chrome, Firefox, or Safari for the best experience.", From 9d0ed6e80040502fb8d8c3db359826133c97ab53 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Fri, 27 Mar 2020 14:19:43 +0000 Subject: [PATCH 0026/2751] fix copy-pasta error Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/components/views/auth/Welcome.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/components/views/auth/Welcome.js b/src/components/views/auth/Welcome.js index 1893b04d76..7cbcf65d3c 100644 --- a/src/components/views/auth/Welcome.js +++ b/src/components/views/auth/Welcome.js @@ -20,6 +20,7 @@ import SdkConfig from '../../../SdkConfig'; import AuthPage from "./AuthPage"; import * as Matrix from "matrix-js-sdk"; import {_td} from "../../../languageHandler"; +import PlatformPeg from "../../../PlatformPeg"; // translatable strings for Welcome pages _td("Sign in with SSO"); @@ -43,7 +44,8 @@ export default class Welcome extends React.PureComponent { baseUrl: hsUrl, idBaseUrl: isUrl, }); - const callbackUrl = this.getSSOCallbackUrl(tmpClient.getHomeserverUrl(), tmpClient.getIdentityServerUrl()); + const plaf = PlatformPeg.get(); + const callbackUrl = plaf.getSSOCallbackUrl(tmpClient.getHomeserverUrl(), tmpClient.getIdentityServerUrl()); return ( From f90dfa242184ecb3fb35f46152f5d15f8479ee66 Mon Sep 17 00:00:00 2001 From: Besnik Bleta Date: Fri, 27 Mar 2020 12:03:12 +0000 Subject: [PATCH 0027/2751] Translated using Weblate (Albanian) Currently translated at 99.7% (2234 of 2241 strings) Translation: Riot Web/matrix-react-sdk Translate-URL: https://translate.riot.im/projects/riot-web/matrix-react-sdk/sq/ --- src/i18n/strings/sq.json | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/i18n/strings/sq.json b/src/i18n/strings/sq.json index 7fd06eca15..9c15bbaa3b 100644 --- a/src/i18n/strings/sq.json +++ b/src/i18n/strings/sq.json @@ -2294,5 +2294,6 @@ "In encrypted rooms, verify all users to ensure it’s secure.": "Në dhoma të fshehtëzuara, verifikoni krejt përdoruesi për të garantuar se është e sigurt.", "Verified": "I verifikuar", "Verification cancelled": "Verifikimi u anulua", - "Compare emoji": "Krahasoni emoji" + "Compare emoji": "Krahasoni emoji", + "Session backup key:": "Kyç kopjeruajtjeje sesioni:" } From 71f8a49e60d32afbeb235e6699f73efc015f57d0 Mon Sep 17 00:00:00 2001 From: Osoitz Date: Fri, 27 Mar 2020 14:55:06 +0000 Subject: [PATCH 0028/2751] Translated using Weblate (Basque) Currently translated at 100.0% (2241 of 2241 strings) Translation: Riot Web/matrix-react-sdk Translate-URL: https://translate.riot.im/projects/riot-web/matrix-react-sdk/eu/ --- src/i18n/strings/eu.json | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/i18n/strings/eu.json b/src/i18n/strings/eu.json index 68162c1010..69de024887 100644 --- a/src/i18n/strings/eu.json +++ b/src/i18n/strings/eu.json @@ -2291,5 +2291,7 @@ "In encrypted rooms, verify all users to ensure it’s secure.": "Gela zifratuetan, egiaztatu erabiltzaile guztiak segurua dela baieztatzeko.", "Verified": "Egiaztatuta", "Verification cancelled": "Egiaztaketa ezeztatuta", - "Compare emoji": "Konparatu emojiak" + "Compare emoji": "Konparatu emojiak", + "Unverified login. Was this you?": "Egiaztatu gabeko saioa. Zu izan zara?", + "Session backup key:": "Saioaren babes-kopia gakoa:" } From 39889a6e2b285f5b3f9ea7f3f0ffe1f1663c78b1 Mon Sep 17 00:00:00 2001 From: Tuomas Hietala Date: Fri, 27 Mar 2020 15:36:21 +0000 Subject: [PATCH 0029/2751] Translated using Weblate (Finnish) Currently translated at 92.0% (2062 of 2241 strings) Translation: Riot Web/matrix-react-sdk Translate-URL: https://translate.riot.im/projects/riot-web/matrix-react-sdk/fi/ --- src/i18n/strings/fi.json | 58 ++++++++++++++++++++++++++++++++++++++-- 1 file changed, 56 insertions(+), 2 deletions(-) diff --git a/src/i18n/strings/fi.json b/src/i18n/strings/fi.json index 8f44d21c19..797acf90a6 100644 --- a/src/i18n/strings/fi.json +++ b/src/i18n/strings/fi.json @@ -1174,7 +1174,7 @@ "Only room administrators will see this warning": "Vain huoneen ylläpitäjät näkevät tämän varoituksen", "Add some now": "Lisää muutamia", "Error updating main address": "Pääosoitteen päivityksessä tapahtui virhe", - "There was an error updating the room's main address. It may not be allowed by the server or a temporary failure occurred.": "Huoneen pääosoitteen päivityksessä tapahtui virhe. Se ei välttämättä ole sallittua tällä palevlimella tai kyseessä on väliaikainen virhe.", + "There was an error updating the room's main address. It may not be allowed by the server or a temporary failure occurred.": "Huoneen pääosoitteen päivityksessä tapahtui virhe. Se ei välttämättä ole sallittua tällä palvelimella tai kyseessä on väliaikainen virhe.", "Error creating alias": "Aliaksen luonnissa tapahtui virhe", "There was an error creating that alias. It may not be allowed by the server or a temporary failure occurred.": "Aliaksen luonnissa tapahtui virhe. Se ei välttämättä ole sallittua tällä palvelimella tai kyseessä on väliaikainen virhe.", "Error removing alias": "Aliaksen poistossa tapahtui virhe", @@ -2052,5 +2052,59 @@ "This bridge was provisioned by .": "Tämän sillan tarjoaa käyttäjä .", "This bridge is managed by .": "Tätä siltaa hallinnoi käyttäjä .", "Workspace: %(networkName)s": "Työtila: %(networkName)s", - "Channel: %(channelName)s": "Kanava: %(channelName)s" + "Channel: %(channelName)s": "Kanava: %(channelName)s", + "outdated": "vanhentunut", + "up to date": "ajan tasalla", + "Delete %(count)s sessions|other": "Poista %(count)s istuntoa", + "Enable": "Ota käyttöön", + "Backup is not signed by any of your sessions": "Mikään istuntosi ei ole allekirjoittanut varmuuskopiota", + "Theme added!": "Teema lisätty!", + "Add theme": "Lisää teema", + "Scroll to most recent messages": "Vieritä tuoreimpiin viesteihin", + "There was an error updating the room's alternative addresses. It may not be allowed by the server or a temporary failure occurred.": "Huoneen vaihtoehtoisten osoitteiden päivittämisessä tapahtui virhe. Palvelin ei ehkä salli sitä tai syynä oli tilapäinen virhe.", + "You don't have permission to delete the alias.": "Sinulla ei ole lupaa poistaa aliasta.", + "Local address": "Paikallinen osoite", + "Local Addresses": "Paikalliset osoitteet", + "Set addresses for this room so users can find this room through your homeserver (%(localDomain)s)": "Aseta osoitteita tälle huoneelle, jotta käyttäjät löytävät tämän huoneen kotipalvelimeltasi (%(localDomain)s)", + "Your messages are not secure": "Viestisi eivät ole turvassa", + "Accepting …": "Hyväksytään …", + "Declining …": "Kieltäydytään …", + "Enter a server name": "Syötä palvelimen nimi", + "Looks good": "Hyvältä näyttää", + "Can't find this server or its room list": "Tätä palvelinta tai sen huoneluetteloa ei löydy", + "All rooms": "Kaikki huoneet", + "Your server": "Palvelimesi", + "Are you sure you want to remove %(serverName)s": "Haluatko varmasti poistaa palvelimen %(serverName)s", + "Remove server": "Poista palvelin", + "Matrix": "Matrix", + "Add a new server": "Lisää uusi palvelin", + "Server name": "Palvelimen nimi", + "Add a new server...": "Lisää uusi palvelin...", + "If you didn’t sign in to this session, your account may be compromised.": "Jos et kirjautunut tähän istuntoon, käyttäjätilisi saattaa olla vaarantunut.", + "This wasn't me": "Tämä en ollut minä", + "Unknown sessions": "Tuntemattomat istunnot", + "Waiting…": "Odotetaan…", + "Disable": "Poista käytöstä", + "Calls": "Puhelut", + "Room List": "Huoneluettelo", + "Autocomplete": "Automaattinen täydennys", + "Alt": "Alt", + "Alt Gr": "Alt Gr", + "Shift": "Vaihto", + "Ctrl": "Ctrl", + "Toggle Bold": "Lihavointi päälle/pois", + "Toggle Italics": "Kursivointi päälle/pois", + "Toggle Quote": "Lainaus päälle/pois", + "New line": "Rivinvaihto", + "Toggle microphone mute": "Mikrofonin mykistys päälle/pois", + "Toggle video on/off": "Video päälle/pois", + "Scroll up/down in the timeline": "Vieritä aikajanaa ylöspäin/alaspäin", + "Activate selected button": "Aktivoi valittu painike", + "Cancel autocomplete": "Peruuta automaattinen täydennys", + "Page Up": "Page Up", + "Page Down": "Page Down", + "Esc": "Esc", + "Enter": "Enter", + "Space": "Välilyönti", + "End": "End" } From 984f9ea4aabbac033ee70470713ddff948b41ba3 Mon Sep 17 00:00:00 2001 From: Travis Ralston Date: Fri, 27 Mar 2020 13:44:32 -0600 Subject: [PATCH 0030/2751] Fix fallback auth link to act and look like a link --- .../views/auth/InteractiveAuthEntryComponents.js | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/src/components/views/auth/InteractiveAuthEntryComponents.js b/src/components/views/auth/InteractiveAuthEntryComponents.js index aaf8c88440..db73467ff7 100644 --- a/src/components/views/auth/InteractiveAuthEntryComponents.js +++ b/src/components/views/auth/InteractiveAuthEntryComponents.js @@ -598,7 +598,10 @@ export const FallbackAuthEntry = createReactClass({ } }, - _onShowFallbackClick: function() { + _onShowFallbackClick: function(e) { + e.preventDefault(); + e.stopPropagation(); + const url = this.props.matrixClient.getFallbackAuthUrl( this.props.loginType, this.props.authSessionId, @@ -627,7 +630,7 @@ export const FallbackAuthEntry = createReactClass({ } return ( ); From 1e30bdb73956e0d103b5d5168645aa635cca6b33 Mon Sep 17 00:00:00 2001 From: Travis Ralston Date: Fri, 27 Mar 2020 14:39:59 -0600 Subject: [PATCH 0031/2751] Early proof of concept for SSO UIA It works well enough to start doing design. --- .../auth/InteractiveAuthEntryComponents.js | 66 ++++++++++++++++++- src/i18n/strings/en_EN.json | 1 + 2 files changed, 65 insertions(+), 2 deletions(-) diff --git a/src/components/views/auth/InteractiveAuthEntryComponents.js b/src/components/views/auth/InteractiveAuthEntryComponents.js index db73467ff7..9f0d5f1534 100644 --- a/src/components/views/auth/InteractiveAuthEntryComponents.js +++ b/src/components/views/auth/InteractiveAuthEntryComponents.js @@ -1,7 +1,7 @@ /* Copyright 2016 OpenMarket Ltd Copyright 2017 Vector Creations Ltd -Copyright 2019 The Matrix.org Foundation C.I.C. +Copyright 2019, 2020 The Matrix.org Foundation C.I.C. Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. @@ -565,6 +565,67 @@ export const MsisdnAuthEntry = createReactClass({ }, }); +export class SSOAuthEntry extends React.Component { + static propTypes = { + matrixClient: PropTypes.object.isRequired, + authSessionId: PropTypes.string.isRequired, + loginType: PropTypes.string.isRequired, + submitAuthDict: PropTypes.func.isRequired, + errorText: PropTypes.string, + }; + + static LOGIN_TYPE = "m.login.sso"; + static UNSTABLE_LOGIN_TYPE = "org.matrix.login.sso"; + + static STAGE_PREAUTH = 1; // button to start SSO + static STAGE_POSTAUTH = 2; // button to confirm SSO completed + + constructor(props) { + super(props); + + this.state = { + // We actually send the user through fallback auth so we don't have to + // deal with a redirect back to us, losing application context. + ssoUrl: props.matrixClient.getFallbackAuthUrl( + this.props.loginType, + this.props.authSessionId, + ), + stage: SSOAuthEntry.STAGE_PREAUTH, + }; + } + + onStartAuthClick = (e) => { + e.preventDefault(); + e.stopPropagation(); + + // Note: We don't use PlatformPeg's startSsoAuth functions because we almost + // certainly will need to open the thing in a new tab to avoid loosing application + // context. + + window.open(e.target.href, '_blank'); + this.setState({stage: SSOAuthEntry.STAGE_POSTAUTH}); + }; + + onConfirmClick = (e) => { + e.preventDefault(); + e.stopPropagation(); + + this.props.submitAuthDict({}); + }; + + render () { + if (this.state.stage === SSOAuthEntry.STAGE_PREAUTH) { + return + {_t("Single Sign On")} + ; + } else { + return + {_t("Continue")} + ; + } + } +} + export const FallbackAuthEntry = createReactClass({ displayName: 'FallbackAuthEntry', @@ -643,11 +704,12 @@ const AuthEntryComponents = [ EmailIdentityAuthEntry, MsisdnAuthEntry, TermsAuthEntry, + SSOAuthEntry, ]; export default function getEntryComponentForLoginType(loginType) { for (const c of AuthEntryComponents) { - if (c.LOGIN_TYPE == loginType) { + if (c.LOGIN_TYPE === loginType || c.UNSTABLE_LOGIN_TYPE === loginType) { return c; } } diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index a6e195aa16..ed89068f91 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -1831,6 +1831,7 @@ "Please enter the code it contains:": "Please enter the code it contains:", "Code": "Code", "Submit": "Submit", + "Single Sign On": "Single Sign On", "Start authentication": "Start authentication", "Unable to validate homeserver/identity server": "Unable to validate homeserver/identity server", "Your Modular server": "Your Modular server", From 37619dd127b8d76858452bac016c40f49cfed094 Mon Sep 17 00:00:00 2001 From: "J. Ryan Stinnett" Date: Sat, 28 Mar 2020 00:21:17 +0000 Subject: [PATCH 0032/2751] Show red shield for users that become unverified For any users that we previously verified but that are not unverified, we will now mark them and rooms they are in with a red shield. Fixes https://github.com/vector-im/riot-web/issues/12808 --- src/components/views/right_panel/UserInfo.js | 6 ++++-- src/components/views/rooms/MemberTile.js | 6 +++--- src/utils/ShieldUtils.ts | 8 ++++++++ 3 files changed, 15 insertions(+), 5 deletions(-) diff --git a/src/components/views/right_panel/UserInfo.js b/src/components/views/right_panel/UserInfo.js index ee47f08aa2..a2081dc9e4 100644 --- a/src/components/views/right_panel/UserInfo.js +++ b/src/components/views/right_panel/UserInfo.js @@ -68,8 +68,10 @@ export const getE2EStatus = (cli, userId, devices) => { return hasUnverifiedDevice ? "warning" : "verified"; } const isMe = userId === cli.getUserId(); - const userVerified = cli.checkUserTrust(userId).isCrossSigningVerified(); - if (!userVerified) return "normal"; + const userTrust = cli.checkUserTrust(userId); + if (!userTrust.isCrossSigningVerified()) { + return userTrust.wasCrossSigningVerified() ? "warning" : "normal"; + } const anyDeviceUnverified = devices.some(device => { const { deviceId } = device; diff --git a/src/components/views/rooms/MemberTile.js b/src/components/views/rooms/MemberTile.js index a0e900b5fc..bf2a1bee23 100644 --- a/src/components/views/rooms/MemberTile.js +++ b/src/components/views/rooms/MemberTile.js @@ -121,10 +121,10 @@ export default createReactClass({ const cli = MatrixClientPeg.get(); const { userId } = this.props.member; const isMe = userId === cli.getUserId(); - const userVerified = cli.checkUserTrust(userId).isCrossSigningVerified(); - if (!userVerified) { + const userTrust = cli.checkUserTrust(userId); + if (!userTrust.isCrossSigningVerified()) { this.setState({ - e2eStatus: "normal", + e2eStatus: userTrust.wasCrossSigningVerified() ? "warning" : "normal", }); return; } diff --git a/src/utils/ShieldUtils.ts b/src/utils/ShieldUtils.ts index 3c7cae8c8d..f427b0b0b6 100644 --- a/src/utils/ShieldUtils.ts +++ b/src/utils/ShieldUtils.ts @@ -5,6 +5,7 @@ interface Client { getUserId: () => string; checkUserTrust: (userId: string) => { isCrossSigningVerified: () => boolean + wasCrossSigningVerified: () => boolean }; getStoredDevicesForUser: (userId: string) => Promise<[{ deviceId: string }]>; checkDeviceTrust: (userId: string, deviceId: string) => { @@ -29,6 +30,13 @@ export async function shieldStatusForMembership(client: Client, room: Room): Pro verified : unverified).push(userId); }); + /* Alarm if any unverified users were verified before. */ + for (const userId of unverified) { + if (client.checkUserTrust(userId).wasCrossSigningVerified()) { + return "warning"; + } + } + /* Check all verified user devices. */ /* Don't alarm if no other users are verified */ const includeUser = (verified.length > 0) && // Don't alarm for self in rooms where nobody else is verified From 164854b4f8fff0354347048f1de422ce0757e0e4 Mon Sep 17 00:00:00 2001 From: Jeff Huang Date: Sat, 28 Mar 2020 02:43:37 +0000 Subject: [PATCH 0033/2751] Translated using Weblate (Chinese (Traditional)) Currently translated at 100.0% (2241 of 2241 strings) Translation: Riot Web/matrix-react-sdk Translate-URL: https://translate.riot.im/projects/riot-web/matrix-react-sdk/zh_Hant/ --- src/i18n/strings/zh_Hant.json | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/i18n/strings/zh_Hant.json b/src/i18n/strings/zh_Hant.json index 58ebe3767a..a2d6f82c6b 100644 --- a/src/i18n/strings/zh_Hant.json +++ b/src/i18n/strings/zh_Hant.json @@ -2304,5 +2304,6 @@ "In encrypted rooms, verify all users to ensure it’s secure.": "在已加密的聊天室中，驗證所有使用者以確保其安全。", "Verified": "已驗證", "Verification cancelled": "驗證已取消", - "Compare emoji": "比較顏文字" + "Compare emoji": "比較顏文字", + "Session backup key:": "工作階段備份金鑰：" } From b7d33a4c9ba1e824f1b1cfe8f82deb5801f7b7a3 Mon Sep 17 00:00:00 2001 From: Tirifto Date: Sat, 28 Mar 2020 12:54:38 +0000 Subject: [PATCH 0034/2751] Translated using Weblate (Esperanto) Currently translated at 100.0% (2241 of 2241 strings) Translation: Riot Web/matrix-react-sdk Translate-URL: https://translate.riot.im/projects/riot-web/matrix-react-sdk/eo/ --- src/i18n/strings/eo.json | 21 ++++++++++++++++++--- 1 file changed, 18 insertions(+), 3 deletions(-) diff --git a/src/i18n/strings/eo.json b/src/i18n/strings/eo.json index f4bb6ec244..582b635ee1 100644 --- a/src/i18n/strings/eo.json +++ b/src/i18n/strings/eo.json @@ -2213,7 +2213,7 @@ "If you can’t access one, ": "Se vi ne povas iun atingi, ", "Manually Verify by Text": "Permane kontroli tekste", "Interactively verify by Emoji": "Interage kontroli bildosigne", - "Self signing private key:": "Memsubskriba privata ŝlosilo", + "Self signing private key:": "Memsubskriba privata ŝlosilo:", "cached locally": "kaŝmemorita loke", "not found locally": "ne trovita loke", "User signing private key:": "Uzantosubskriba privata ŝlosilo:", @@ -2233,7 +2233,7 @@ "Signature upload success": "Alŝuto de subskribo sukcesis", "Signature upload failed": "Alŝuto de subskribo malsukcesis", "Confirm by comparing the following with the User Settings in your other session:": "Konfirmu per komparo de la sekva kun la agardoj de uzanto en via alia salutaĵo:", - "Confirm this user's session by comparing the following with their User Settings:": "Konfirmu la salutaĵon de ĉi tiu uzanto per komparo de la sekva kun ĝiaj agordoj de uzanto", + "Confirm this user's session by comparing the following with their User Settings:": "Konfirmu la salutaĵon de ĉi tiu uzanto per komparo de la sekva kun ĝiaj agordoj de uzanto:", "If they don't match, the security of your communication may be compromised.": "Se ili ne akordas, la sekureco de via komunikado eble estas rompita.", "Navigation": "Navigado", "Calls": "Vokoj", @@ -2274,5 +2274,20 @@ "Esc": "Eskapa klavo", "Enter": "Eniga klavo", "Space": "Spaco", - "End": "Finen-klavo" + "End": "Finen-klavo", + "Whether you're using Riot as an installed Progressive Web App": "Ĉu vi uzas Rioton kiel Progresan retan aplikaĵon", + "Review Sessions": "Rekontroli salutaĵojn", + "Unverified login. Was this you?": "Nekontrolita salutaĵo. Ĉu tio estis vi?", + "Manually verify all remote sessions": "Permane kontroli ĉiujn forajn salutaĵojn", + "Update your secure storage": "Ĝisdatigi vian sekuran deponejon", + "Session backup key:": "Savkopia ŝlosilo de salutaĵo:", + "Individually verify each session used by a user to mark it as trusted, not trusting cross-signed devices.": "Unuope kontroli ĉiun salutaĵon de uzanto por marki ĝin fidata, ne fidante transire subskribitajn aparatojn.", + "Invalid theme schema.": "Nevalida skemo de haŭto.", + "Mod": "Reguligisto", + "In encrypted rooms, your messages are secured and only you and the recipient have the unique keys to unlock them.": "En ĉifritaj ĉambroj, viaj mesaĝoj estas sekurigitaj, kaj nur vi kaj la ricevanto havas la unikajn malĉifrajn ŝlosilojn.", + "Verify all users in a room to ensure it's secure.": "Kontroli ĉiujn uzantojn en ĉambro por certigi, ke ĝi sekuras.", + "In encrypted rooms, verify all users to ensure it’s secure.": "En ĉifritaj ĉambroj, kontroli ĉiujn uzantojn por certigi, ke ili sekuras.", + "Verified": "Kontrolita", + "Verification cancelled": "Kontrolo nuliĝis", + "Compare emoji": "Kompari bildsignojn" } From 78e46f04768249fb2aa3f62b5dc1d49f0b62dfae Mon Sep 17 00:00:00 2001 From: Szimszon Date: Fri, 27 Mar 2020 19:11:58 +0000 Subject: [PATCH 0035/2751] Translated using Weblate (Hungarian) Currently translated at 100.0% (2241 of 2241 strings) Translation: Riot Web/matrix-react-sdk Translate-URL: https://translate.riot.im/projects/riot-web/matrix-react-sdk/hu/ --- src/i18n/strings/hu.json | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/i18n/strings/hu.json b/src/i18n/strings/hu.json index 271d7c5bc7..68cad86807 100644 --- a/src/i18n/strings/hu.json +++ b/src/i18n/strings/hu.json @@ -2300,5 +2300,6 @@ "Esc": "Esc", "Enter": "Enter", "Space": "Szóköz", - "End": "End" + "End": "End", + "Session backup key:": "Munkamenet másolat kulcs:" } From b2d905ef2c7c53ba4f07e442a6414c1a7c0976be Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Sun, 29 Mar 2020 20:07:32 +0100 Subject: [PATCH 0036/2751] Make FormatButton use AccessibleButtons Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- .../views/rooms/MessageComposerFormatBar.js | 16 +++++++++------- 1 file changed, 9 insertions(+), 7 deletions(-) diff --git a/src/components/views/rooms/MessageComposerFormatBar.js b/src/components/views/rooms/MessageComposerFormatBar.js index 79ae9f34e8..42d54f5987 100644 --- a/src/components/views/rooms/MessageComposerFormatBar.js +++ b/src/components/views/rooms/MessageComposerFormatBar.js @@ -19,12 +19,13 @@ import PropTypes from 'prop-types'; import { _t } from '../../../languageHandler'; import * as sdk from '../../../index'; import classNames from 'classnames'; +import AccessibleButton from "../elements/AccessibleButton"; export default class MessageComposerFormatBar extends React.PureComponent { static propTypes = { onAction: PropTypes.func.isRequired, shortcuts: PropTypes.object.isRequired, - } + }; constructor(props) { super(props); @@ -64,7 +65,7 @@ class FormatButton extends React.PureComponent { icon: PropTypes.string.isRequired, shortcut: PropTypes.string, visible: PropTypes.bool, - } + }; render() { const InteractiveTooltip = sdk.getComponent('elements.InteractiveTooltip'); @@ -82,11 +83,12 @@ class FormatButton extends React.PureComponent { return ( - - + ); } From 2ff16844e5b1b97f3de5ca391a96b2ad59129fc4 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Sun, 29 Mar 2020 20:12:10 +0100 Subject: [PATCH 0037/2751] Make ELS somewhat more accessible Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- .../views/elements/EventListSummary.js | 35 ++++++++++--------- 1 file changed, 18 insertions(+), 17 deletions(-) diff --git a/src/components/views/elements/EventListSummary.js b/src/components/views/elements/EventListSummary.js index 7a69398071..79c84293c2 100644 --- a/src/components/views/elements/EventListSummary.js +++ b/src/components/views/elements/EventListSummary.js @@ -20,6 +20,7 @@ import MemberAvatar from '../avatars/MemberAvatar'; import { _t } from '../../../languageHandler'; import {MatrixEvent, RoomMember} from "matrix-js-sdk"; import {useStateToggle} from "../../../hooks/useStateToggle"; +import AccessibleButton from "./AccessibleButton"; const EventListSummary = ({events, children, threshold=3, onToggle, startExpanded, summaryMembers=[], summaryText}) => { const [expanded, toggleExpanded] = useStateToggle(startExpanded); @@ -42,24 +43,15 @@ const EventListSummary = ({events, children, threshold=3, onToggle, startExpande ); } + let body; if (expanded) { - return ( -
-
- { _t('collapse') } -
-
 
- { children } -
- ); - } - - const avatars = summaryMembers.map((m) => ); - return ( -
-
- { _t('expand') } -
+ body = +
 
+ { children } + ; + } else { + const avatars = summaryMembers.map((m) => ); + body = (
@@ -70,6 +62,15 @@ const EventListSummary = ({events, children, threshold=3, onToggle, startExpande
+ ); + } + + return ( +
+ + { expanded ? _t('collapse') : _t('expand') } + + { body }
); }; From 21a41fa343e4b2f7829c2d84ca82341b6a7098ab Mon Sep 17 00:00:00 2001 From: Jorik Schellekens Date: Mon, 30 Mar 2020 10:05:40 +0100 Subject: [PATCH 0038/2751] Update link to css location. --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index d6fd6db1b7..69aafeb724 100644 --- a/README.md +++ b/README.md @@ -45,7 +45,7 @@ Code should be committed as follows: * In practice, `matrix-react-sdk` is still evolving so fast that the maintenance burden of customising and overriding these components for Riot can seriously impede development. So right now, there should be very few (if any) customisations for Riot. - * CSS: https://github.com/vector-im/riot-web/tree/master/src/skins/vector/css/matrix-react-sdk + * CSS: https://github.com/matrix-org/matrix-react-sdk/tree/master/res/css * Theme specific CSS & resources: https://github.com/matrix-org/matrix-react-sdk/tree/master/res/themes React components in matrix-react-sdk are come in two different flavours: From b5c45b7d127bad0e269cdf2a58f691e11a8c44e6 Mon Sep 17 00:00:00 2001 From: random Date: Mon, 30 Mar 2020 10:16:01 +0000 Subject: [PATCH 0039/2751] Translated using Weblate (Italian) Currently translated at 100.0% (2242 of 2242 strings) Translation: Riot Web/matrix-react-sdk Translate-URL: https://translate.riot.im/projects/riot-web/matrix-react-sdk/it/ --- src/i18n/strings/it.json | 18 +++++++++++++++++- 1 file changed, 17 insertions(+), 1 deletion(-) diff --git a/src/i18n/strings/it.json b/src/i18n/strings/it.json index 4829d4cf7a..f3aed44b05 100644 --- a/src/i18n/strings/it.json +++ b/src/i18n/strings/it.json @@ -2288,5 +2288,21 @@ "Navigate composer history": "Naviga cronologia compositore", "Previous/next unread room or DM": "Stanza o msg non letti successivi/precedenti", "Previous/next room or DM": "Stanza o msg successivi/precedenti", - "Toggle right panel": "Apri/chiudi pannello a destra" + "Toggle right panel": "Apri/chiudi pannello a destra", + "Unverified login. Was this you?": "Accesso non verificato. Eri tu?", + "Manually verify all remote sessions": "Verifica manualmente tutte le sessioni remote", + "Update your secure storage": "Aggiorna la tua archiviazione sicura", + "Self signing private key:": "Chiave privata di auto-firma:", + "cached locally": "in cache locale", + "not found locally": "non trovato in locale", + "User signing private key:": "Chiave privata di firma utente:", + "Session backup key:": "Chiave di backup sessione:", + "Individually verify each session used by a user to mark it as trusted, not trusting cross-signed devices.": "Verifica individualmente ogni sessione usata da un utente per segnarla come fidata, senza fidarsi dei dispositivi a firma incrociata.", + "In encrypted rooms, your messages are secured and only you and the recipient have the unique keys to unlock them.": "Nelle stanze cifrate, i tuoi messaggi sono protetti e solo tu ed il destinatario avete le chiavi univoche per sbloccarli.", + "Verify all users in a room to ensure it's secure.": "Verifica tutti gli utenti in una stanza per confermare che sia sicura.", + "In encrypted rooms, verify all users to ensure it’s secure.": "Nelle stanze cifrate, verifica tutti gli utenti per confermare che siano sicure.", + "Verified": "Verificato", + "Verification cancelled": "Verifica annullata", + "Compare emoji": "Confronta emoji", + "Cancel replying to a message": "Annulla la risposta a un messaggio" } From 4371006c58b4565de1ef29d8d591333967fdcf23 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Damir=20Jeli=C4=87?= Date: Mon, 30 Mar 2020 14:32:35 +0200 Subject: [PATCH 0040/2751] EventIndex: Better logging on how many events are added. This adds a bit more info to how many events are added, how many skipped and if they are skipped because they are undecryptable. --- src/indexing/EventIndex.js | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/src/indexing/EventIndex.js b/src/indexing/EventIndex.js index 9e27451a78..65e536b4a1 100644 --- a/src/indexing/EventIndex.js +++ b/src/indexing/EventIndex.js @@ -469,6 +469,9 @@ export default class EventIndex extends EventEmitter { // decryption keys, do we want to retry this checkpoint at a later // stage? const filteredEvents = matrixEvents.filter(this.isValidEvent); + const undecryptableEvents = matrixEvents.filter((ev) => { + return ev.isDecryptionFailure(); + }); // Collect the redaction events so we can delete the redacted events // from the index. @@ -503,7 +506,10 @@ export default class EventIndex extends EventEmitter { console.log( "EventIndex: Crawled room", client.getRoom(checkpoint.roomId).name, - "and fetched", events.length, "events.", + "and fetched total", matrixEvents.length, "events of which", + events.length, "are being added,", redactionEvents.length, + "are redacted,", matrixEvents.length - events.length, + "are being skipped, undecryptable", undecryptableEvents.length ); try { From 836b348bff796dae1d56f2f19ea08dd258636333 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Damir=20Jeli=C4=87?= Date: Mon, 30 Mar 2020 14:39:01 +0200 Subject: [PATCH 0041/2751] EventIndex: Add a trailing comma. --- src/indexing/EventIndex.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/indexing/EventIndex.js b/src/indexing/EventIndex.js index 65e536b4a1..14257af014 100644 --- a/src/indexing/EventIndex.js +++ b/src/indexing/EventIndex.js @@ -509,7 +509,7 @@ export default class EventIndex extends EventEmitter { "and fetched total", matrixEvents.length, "events of which", events.length, "are being added,", redactionEvents.length, "are redacted,", matrixEvents.length - events.length, - "are being skipped, undecryptable", undecryptableEvents.length + "are being skipped, undecryptable", undecryptableEvents.length, ); try { From 8c2b910c03e1e2dc26cba810bc74c0ff97459ce7 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Mon, 30 Mar 2020 13:59:08 +0100 Subject: [PATCH 0042/2751] rework SlashCommands to better expose aliases Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/{SlashCommands.js => SlashCommands.tsx} | 270 ++++++++---------- src/autocomplete/CommandProvider.js | 46 +-- .../views/dialogs/SlashCommandHelpDialog.js | 6 +- 3 files changed, 155 insertions(+), 167 deletions(-) rename src/{SlashCommands.js => SlashCommands.tsx} (91%) diff --git a/src/SlashCommands.js b/src/SlashCommands.tsx similarity index 91% rename from src/SlashCommands.js rename to src/SlashCommands.tsx index d306978f78..e69afbde48 100644 --- a/src/SlashCommands.js +++ b/src/SlashCommands.tsx @@ -2,6 +2,7 @@ Copyright 2015, 2016 OpenMarket Ltd Copyright 2018 New Vector Ltd Copyright 2019 Michael Telatynski <7t3chguy@gmail.com> +Copyright 2020 The Matrix.org Foundation C.I.C. Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. @@ -17,7 +18,8 @@ limitations under the License. */ -import React from 'react'; +import * as React from 'react'; + import {MatrixClientPeg} from './MatrixClientPeg'; import dis from './dispatcher'; import * as sdk from './index'; @@ -34,11 +36,16 @@ import { getDefaultIdentityServerUrl, useDefaultIdentityServer } from './utils/I import {isPermalinkHost, parsePermalink} from "./utils/permalinks/Permalinks"; import {inviteUsersToRoom} from "./RoomInvite"; -const singleMxcUpload = async () => { +// XXX: workaround for https://github.com/microsoft/TypeScript/issues/31816 +interface HTMLInputEvent extends Event { + target: HTMLInputElement & EventTarget; +} + +const singleMxcUpload = async (): Promise => { return new Promise((resolve) => { const fileSelector = document.createElement('input'); fileSelector.setAttribute('type', 'file'); - fileSelector.onchange = (ev) => { + fileSelector.onchange = (ev: HTMLInputEvent) => { const file = ev.target.files[0]; const UploadConfirmDialog = sdk.getComponent("dialogs.UploadConfirmDialog"); @@ -62,9 +69,36 @@ export const CommandCategories = { "other": _td("Other"), }; +type RunFn = ((roomId: string, args: string, cmd: string) => {error: any} | {promise: Promise}); + class Command { - constructor({name, args='', description, runFn, category=CommandCategories.other, hideCompletionAfterSpace=false}) { - this.command = '/' + name; + command: string; + aliases: string[]; + args: undefined | string; + description: string; + runFn: undefined | RunFn; + category: string; + hideCompletionAfterSpace: boolean; + + constructor({ + command, + aliases=[], + args='', + description, + runFn=undefined, + category=CommandCategories.other, + hideCompletionAfterSpace=false, + }: { + command: string; + aliases?: string[]; + args?: string; + description: string; + runFn?: RunFn; + category: string; + hideCompletionAfterSpace?: boolean; + }) { + this.command = command; + this.aliases = aliases; this.args = args; this.description = description; this.runFn = runFn; @@ -73,17 +107,17 @@ class Command { } getCommand() { - return this.command; + return `/${this.command}`; } getCommandWithArgs() { return this.getCommand() + " " + this.args; } - run(roomId, args) { + run(roomId: string, args: string, cmd: string) { // if it has no runFn then its an ignored/nop command (autocomplete only) e.g `/me` if (!this.runFn) return; - return this.runFn.bind(this)(roomId, args); + return this.runFn.bind(this)(roomId, args, cmd); } getUsage() { @@ -95,7 +129,7 @@ function reject(error) { return {error}; } -function success(promise) { +function success(promise?: Promise) { return {promise}; } @@ -103,11 +137,9 @@ function success(promise) { * functions are called with `this` bound to the Command instance. */ -/* eslint-disable babel/no-invalid-this */ - -export const CommandMap = { - shrug: new Command({ - name: 'shrug', +export const Commands = [ + new Command({ + command: 'shrug', args: '', description: _td('Prepends ¯\\_(ツ)_/¯ to a plain-text message'), runFn: function(roomId, args) { @@ -119,8 +151,8 @@ export const CommandMap = { }, category: CommandCategories.messages, }), - plain: new Command({ - name: 'plain', + new Command({ + command: 'plain', args: '', description: _td('Sends a message as plain text, without interpreting it as markdown'), runFn: function(roomId, messages) { @@ -128,11 +160,11 @@ export const CommandMap = { }, category: CommandCategories.messages, }), - ddg: new Command({ - name: 'ddg', + new Command({ + command: 'ddg', args: '', description: _td('Searches DuckDuckGo for results'), - runFn: function(roomId, args) { + runFn: function() { const ErrorDialog = sdk.getComponent('dialogs.ErrorDialog'); // TODO Don't explain this away, actually show a search UI here. Modal.createTrackedDialog('Slash Commands', '/ddg is not a command', ErrorDialog, { @@ -144,9 +176,8 @@ export const CommandMap = { category: CommandCategories.actions, hideCompletionAfterSpace: true, }), - - upgraderoom: new Command({ - name: 'upgraderoom', + new Command({ + command: 'upgraderoom', args: '', description: _td('Upgrades a room to a new version'), runFn: function(roomId, args) { @@ -215,9 +246,8 @@ export const CommandMap = { }, category: CommandCategories.admin, }), - - nick: new Command({ - name: 'nick', + new Command({ + command: 'nick', args: '', description: _td('Changes your display nickname'), runFn: function(roomId, args) { @@ -228,9 +258,9 @@ export const CommandMap = { }, category: CommandCategories.actions, }), - - myroomnick: new Command({ - name: 'myroomnick', + new Command({ + command: 'myroomnick', + aliases: ['roomnick'], args: '', description: _td('Changes your display nickname in the current room only'), runFn: function(roomId, args) { @@ -239,7 +269,7 @@ export const CommandMap = { const ev = cli.getRoom(roomId).currentState.getStateEvents('m.room.member', cli.getUserId()); const content = { ...ev ? ev.getContent() : { membership: 'join' }, - displayname: args, + displaycommand: args, }; return success(cli.sendStateEvent(roomId, 'm.room.member', content, cli.getUserId())); } @@ -247,9 +277,8 @@ export const CommandMap = { }, category: CommandCategories.actions, }), - - roomavatar: new Command({ - name: 'roomavatar', + new Command({ + command: 'roomavatar', args: '[]', description: _td('Changes the avatar of the current room'), runFn: function(roomId, args) { @@ -265,9 +294,8 @@ export const CommandMap = { }, category: CommandCategories.actions, }), - - myroomavatar: new Command({ - name: 'myroomavatar', + new Command({ + command: 'myroomavatar', args: '[]', description: _td('Changes your avatar in this current room only'), runFn: function(roomId, args) { @@ -292,9 +320,8 @@ export const CommandMap = { }, category: CommandCategories.actions, }), - - myavatar: new Command({ - name: 'myavatar', + new Command({ + command: 'myavatar', args: '[]', description: _td('Changes your avatar in all rooms'), runFn: function(roomId, args) { @@ -310,9 +337,8 @@ export const CommandMap = { }, category: CommandCategories.actions, }), - - topic: new Command({ - name: 'topic', + new Command({ + command: 'topic', args: '[]', description: _td('Gets or sets the room topic'), runFn: function(roomId, args) { @@ -336,9 +362,8 @@ export const CommandMap = { }, category: CommandCategories.admin, }), - - roomname: new Command({ - name: 'roomname', + new Command({ + command: 'roomname', args: '', description: _td('Sets the room name'), runFn: function(roomId, args) { @@ -349,9 +374,8 @@ export const CommandMap = { }, category: CommandCategories.admin, }), - - invite: new Command({ - name: 'invite', + new Command({ + command: 'invite', args: '', description: _td('Invites user with given id to current room'), runFn: function(roomId, args) { @@ -390,7 +414,7 @@ export const CommandMap = { } } const inviter = new MultiInviter(roomId); - return success(finished.then(([useDefault] = []) => { + return success(finished.then(([useDefault]: any) => { if (useDefault) { useDefaultIdentityServer(); } else if (useDefault === false) { @@ -408,9 +432,9 @@ export const CommandMap = { }, category: CommandCategories.actions, }), - - join: new Command({ - name: 'join', + new Command({ + command: 'join', + aliases: ['j', 'goto'], args: '', description: _td('Joins room with given alias'), runFn: function(roomId, args) { @@ -521,9 +545,8 @@ export const CommandMap = { }, category: CommandCategories.actions, }), - - part: new Command({ - name: 'part', + new Command({ + command: 'part', args: '[]', description: _td('Leave room'), runFn: function(roomId, args) { @@ -569,9 +592,8 @@ export const CommandMap = { }, category: CommandCategories.actions, }), - - kick: new Command({ - name: 'kick', + new Command({ + command: 'kick', args: ' [reason]', description: _td('Kicks user with given id'), runFn: function(roomId, args) { @@ -585,10 +607,8 @@ export const CommandMap = { }, category: CommandCategories.admin, }), - - // Ban a user from the room with an optional reason - ban: new Command({ - name: 'ban', + new Command({ + command: 'ban', args: ' [reason]', description: _td('Bans user with given id'), runFn: function(roomId, args) { @@ -602,10 +622,8 @@ export const CommandMap = { }, category: CommandCategories.admin, }), - - // Unban a user from ythe room - unban: new Command({ - name: 'unban', + new Command({ + command: 'unban', args: '', description: _td('Unbans user with given ID'), runFn: function(roomId, args) { @@ -620,9 +638,8 @@ export const CommandMap = { }, category: CommandCategories.admin, }), - - ignore: new Command({ - name: 'ignore', + new Command({ + command: 'ignore', args: '', description: _td('Ignores a user, hiding their messages from you'), runFn: function(roomId, args) { @@ -651,9 +668,8 @@ export const CommandMap = { }, category: CommandCategories.actions, }), - - unignore: new Command({ - name: 'unignore', + new Command({ + command: 'unignore', args: '', description: _td('Stops ignoring a user, showing their messages going forward'), runFn: function(roomId, args) { @@ -683,10 +699,8 @@ export const CommandMap = { }, category: CommandCategories.actions, }), - - // Define the power level of a user - op: new Command({ - name: 'op', + new Command({ + command: 'op', args: ' []', description: _td('Define the power level of a user'), runFn: function(roomId, args) { @@ -712,10 +726,8 @@ export const CommandMap = { }, category: CommandCategories.admin, }), - - // Reset the power level of a user - deop: new Command({ - name: 'deop', + new Command({ + command: 'deop', args: '', description: _td('Deops user with given id'), runFn: function(roomId, args) { @@ -734,9 +746,8 @@ export const CommandMap = { }, category: CommandCategories.admin, }), - - devtools: new Command({ - name: 'devtools', + new Command({ + command: 'devtools', description: _td('Opens the Developer Tools dialog'), runFn: function(roomId) { const DevtoolsDialog = sdk.getComponent('dialogs.DevtoolsDialog'); @@ -745,9 +756,8 @@ export const CommandMap = { }, category: CommandCategories.advanced, }), - - addwidget: new Command({ - name: 'addwidget', + new Command({ + command: 'addwidget', args: '', description: _td('Adds a custom widget by URL to the room'), runFn: function(roomId, args) { @@ -766,10 +776,8 @@ export const CommandMap = { }, category: CommandCategories.admin, }), - - // Verify a user, device, and pubkey tuple - verify: new Command({ - name: 'verify', + new Command({ + command: 'verify', args: ' ', description: _td('Verifies a user, session, and pubkey tuple'), runFn: function(roomId, args) { @@ -834,20 +842,9 @@ export const CommandMap = { }, category: CommandCategories.advanced, }), - - // Command definitions for autocompletion ONLY: - - // /me is special because its not handled by SlashCommands.js and is instead done inside the Composer classes - me: new Command({ - name: 'me', - args: '', - description: _td('Displays action'), - category: CommandCategories.messages, - hideCompletionAfterSpace: true, - }), - - discardsession: new Command({ - name: 'discardsession', + new Command({ + command: 'discardsession', + aliases: ['newballsplease'], description: _td('Forces the current outbound group session in an encrypted room to be discarded'), runFn: function(roomId) { try { @@ -859,9 +856,8 @@ export const CommandMap = { }, category: CommandCategories.advanced, }), - - rainbow: new Command({ - name: "rainbow", + new Command({ + command: "rainbow", description: _td("Sends the given message coloured as a rainbow"), args: '', runFn: function(roomId, args) { @@ -870,9 +866,8 @@ export const CommandMap = { }, category: CommandCategories.messages, }), - - rainbowme: new Command({ - name: "rainbowme", + new Command({ + command: "rainbowme", description: _td("Sends the given emote coloured as a rainbow"), args: '', runFn: function(roomId, args) { @@ -881,9 +876,8 @@ export const CommandMap = { }, category: CommandCategories.messages, }), - - help: new Command({ - name: "help", + new Command({ + command: "help", description: _td("Displays list of commands with usages and descriptions"), runFn: function() { const SlashCommandHelpDialog = sdk.getComponent('dialogs.SlashCommandHelpDialog'); @@ -894,36 +888,25 @@ export const CommandMap = { category: CommandCategories.advanced, }), - whois: new Command({ - name: "whois", - description: _td("Displays information about a user"), - args: '', - runFn: function(roomId, userId) { - if (!userId || !userId.startsWith("@") || !userId.includes(":")) { - return reject(this.getUsage()); - } - - const member = MatrixClientPeg.get().getRoom(roomId).getMember(userId); - - dis.dispatch({ - action: 'view_user', - member: member || {userId}, - }); - return success(); - }, - category: CommandCategories.advanced, + // Command definitions for autocompletion ONLY: + // /me is special because its not handled by SlashCommands.js and is instead done inside the Composer classes + new Command({ + command: 'me', + args: '', + description: _td('Displays action'), + category: CommandCategories.messages, + hideCompletionAfterSpace: true, }), -}; -/* eslint-enable babel/no-invalid-this */ +]; - -// helpful aliases -const aliases = { - j: "join", - newballsplease: "discardsession", - goto: "join", // because it handles event permalinks magically - roomnick: "myroomnick", -}; +// build a map from names and aliases to the Command objects. +export const CommandMap = new Map(); +Commands.forEach(cmd => { + CommandMap.set(cmd.command, cmd); + cmd.aliases.forEach(alias => { + CommandMap.set(alias, cmd); + }); +}); /** @@ -950,10 +933,7 @@ export function getCommand(roomId, input) { cmd = input; } - if (aliases[cmd]) { - cmd = aliases[cmd]; - } - if (CommandMap[cmd]) { - return () => CommandMap[cmd].run(roomId, args); + if (CommandMap.has(cmd)) { + return () => CommandMap.get(cmd).run(roomId, args, cmd); } } diff --git a/src/autocomplete/CommandProvider.js b/src/autocomplete/CommandProvider.js index da8fa3ed3c..0b8af4d6f9 100644 --- a/src/autocomplete/CommandProvider.js +++ b/src/autocomplete/CommandProvider.js @@ -23,17 +23,16 @@ import AutocompleteProvider from './AutocompleteProvider'; import QueryMatcher from './QueryMatcher'; import {TextualCompletion} from './Components'; import type {Completion, SelectionRange} from "./Autocompleter"; -import {CommandMap} from '../SlashCommands'; - -const COMMANDS = Object.values(CommandMap); +import {Commands, CommandMap} from '../SlashCommands'; const COMMAND_RE = /(^\/\w*)(?: .*)?/g; export default class CommandProvider extends AutocompleteProvider { constructor() { super(COMMAND_RE); - this.matcher = new QueryMatcher(COMMANDS, { - keys: ['command', 'args', 'description'], + this.matcher = new QueryMatcher(Commands, { + keys: ['command', 'args', 'description'], + funcs: [({aliases}) => aliases.join(" ")], // aliases }); } @@ -46,31 +45,40 @@ export default class CommandProvider extends AutocompleteProvider { if (command[0] !== command[1]) { // The input looks like a command with arguments, perform exact match const name = command[1].substr(1); // strip leading `/` - if (CommandMap[name]) { + if (CommandMap.has(name)) { // some commands, namely `me` and `ddg` don't suit having the usage shown whilst typing their arguments - if (CommandMap[name].hideCompletionAfterSpace) return []; - matches = [CommandMap[name]]; + if (CommandMap.get(name).hideCompletionAfterSpace) return []; + matches = [CommandMap.get(name)]; } } else { if (query === '/') { // If they have just entered `/` show everything - matches = COMMANDS; + matches = Commands; } else { // otherwise fuzzy match against all of the fields matches = this.matcher.match(command[1]); } } - return matches.map((result) => ({ - // If the command is the same as the one they entered, we don't want to discard their arguments - completion: result.command === command[1] ? command[0] : (result.command + ' '), - type: "command", - component: , - range, - })); + + return matches.map((result) => { + let completion = result.getCommand() + ' '; + const usedAlias = result.aliases.find(alias => `/${alias}` === command[1]); + // If the command (or an alias) is the same as the one they entered, we don't want to discard their arguments + if (usedAlias || result.getCommand() === command[1]) { + completion = command[0]; + } + + return { + completion, + type: "command", + component: , + range, + }; + }); } getName() { diff --git a/src/components/views/dialogs/SlashCommandHelpDialog.js b/src/components/views/dialogs/SlashCommandHelpDialog.js index 9e48a92ed1..bae5b37993 100644 --- a/src/components/views/dialogs/SlashCommandHelpDialog.js +++ b/src/components/views/dialogs/SlashCommandHelpDialog.js @@ -16,14 +16,14 @@ limitations under the License. import React from 'react'; import {_t} from "../../../languageHandler"; -import {CommandCategories, CommandMap} from "../../../SlashCommands"; +import {CommandCategories, Commands} from "../../../SlashCommands"; import * as sdk from "../../../index"; export default ({onFinished}) => { const InfoDialog = sdk.getComponent('dialogs.InfoDialog'); const categories = {}; - Object.values(CommandMap).forEach(cmd => { + Commands.forEach(cmd => { if (!categories[cmd.category]) { categories[cmd.category] = []; } @@ -41,7 +41,7 @@ export default ({onFinished}) => { categories[category].forEach(cmd => { rows.push( - {cmd.command} + {cmd.getCommand()} {cmd.args} {cmd.description} ); From c6d69f3d3fa072052d11f989671d7deea4311a3c Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Mon, 30 Mar 2020 14:09:10 +0100 Subject: [PATCH 0043/2751] de-tslint Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/SlashCommands.tsx | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/src/SlashCommands.tsx b/src/SlashCommands.tsx index e69afbde48..728f67987a 100644 --- a/src/SlashCommands.tsx +++ b/src/SlashCommands.tsx @@ -82,12 +82,12 @@ class Command { constructor({ command, - aliases=[], - args='', + aliases = [], + args = '', description, runFn=undefined, - category=CommandCategories.other, - hideCompletionAfterSpace=false, + category = CommandCategories.other, + hideCompletionAfterSpace = false, }: { command: string; aliases?: string[]; @@ -437,7 +437,7 @@ export const Commands = [ aliases: ['j', 'goto'], args: '', description: _td('Joins room with given alias'), - runFn: function(roomId, args) { + runFn: function(_, args) { if (args) { // Note: we support 2 versions of this command. The first is // the public-facing one for most users and the other is a @@ -710,7 +710,7 @@ export const Commands = [ if (matches) { const userId = matches[1]; if (matches.length === 4 && undefined !== matches[3]) { - powerLevel = parseInt(matches[3]); + powerLevel = parseInt(matches[3], 10); } if (!isNaN(powerLevel)) { const cli = MatrixClientPeg.get(); From 559b8e174ba355c6151157be09d6a7d43de5f904 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Mon, 30 Mar 2020 14:13:08 +0100 Subject: [PATCH 0044/2751] undo accidental changes Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/SlashCommands.tsx | 20 +++++++++++++++++++- src/i18n/strings/en_EN.json | 2 +- 2 files changed, 20 insertions(+), 2 deletions(-) diff --git a/src/SlashCommands.tsx b/src/SlashCommands.tsx index 728f67987a..8351013a5a 100644 --- a/src/SlashCommands.tsx +++ b/src/SlashCommands.tsx @@ -269,7 +269,7 @@ export const Commands = [ const ev = cli.getRoom(roomId).currentState.getStateEvents('m.room.member', cli.getUserId()); const content = { ...ev ? ev.getContent() : { membership: 'join' }, - displaycommand: args, + displayname: args, }; return success(cli.sendStateEvent(roomId, 'm.room.member', content, cli.getUserId())); } @@ -887,6 +887,24 @@ export const Commands = [ }, category: CommandCategories.advanced, }), + new Command({ + command: "whois", + description: _td("Displays information about a user"), + args: "", + runFn: function (roomId, userId) { + if (!userId || !userId.startsWith("@") || !userId.includes(":")) { + return reject(this.getUsage()); + } + + const member = MatrixClientPeg.get().getRoom(roomId).getMember(userId); + dis.dispatch({ + action: 'view_user', + member: member || {userId}, + }); + return success(); + }, + category: CommandCategories.advanced, + }), // Command definitions for autocompletion ONLY: // /me is special because its not handled by SlashCommands.js and is instead done inside the Composer classes diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index 2f19fc982c..151d5a2b0d 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -197,12 +197,12 @@ "WARNING: KEY VERIFICATION FAILED! The signing key for %(userId)s and session %(deviceId)s is \"%(fprint)s\" which does not match the provided key \"%(fingerprint)s\". This could mean your communications are being intercepted!": "WARNING: KEY VERIFICATION FAILED! The signing key for %(userId)s and session %(deviceId)s is \"%(fprint)s\" which does not match the provided key \"%(fingerprint)s\". This could mean your communications are being intercepted!", "Verified key": "Verified key", "The signing key you provided matches the signing key you received from %(userId)s's session %(deviceId)s. Session marked as verified.": "The signing key you provided matches the signing key you received from %(userId)s's session %(deviceId)s. Session marked as verified.", - "Displays action": "Displays action", "Forces the current outbound group session in an encrypted room to be discarded": "Forces the current outbound group session in an encrypted room to be discarded", "Sends the given message coloured as a rainbow": "Sends the given message coloured as a rainbow", "Sends the given emote coloured as a rainbow": "Sends the given emote coloured as a rainbow", "Displays list of commands with usages and descriptions": "Displays list of commands with usages and descriptions", "Displays information about a user": "Displays information about a user", + "Displays action": "Displays action", "Reason": "Reason", "%(targetName)s accepted the invitation for %(displayName)s.": "%(targetName)s accepted the invitation for %(displayName)s.", "%(targetName)s accepted an invitation.": "%(targetName)s accepted an invitation.", From b53b5cc45de7d70b8686246f2c8037845b1ba2a1 Mon Sep 17 00:00:00 2001 From: "J. Ryan Stinnett" Date: Mon, 30 Mar 2020 15:24:43 +0100 Subject: [PATCH 0045/2751] Add wasCrossSigningVerified in test --- test/utils/ShieldUtils-test.js | 1 + 1 file changed, 1 insertion(+) diff --git a/test/utils/ShieldUtils-test.js b/test/utils/ShieldUtils-test.js index 949f0ed42b..66dfab4234 100644 --- a/test/utils/ShieldUtils-test.js +++ b/test/utils/ShieldUtils-test.js @@ -6,6 +6,7 @@ function mkClient(selfTrust) { getUserId: () => "@self:localhost", checkUserTrust: (userId) => ({ isCrossSigningVerified: () => userId[1] == "T", + wasCrossSigningVerified: () => userId[1] == "T", }), checkDeviceTrust: (userId, deviceId) => ({ isVerified: () => userId === "@self:localhost" ? selfTrust : userId[2] == "T", From 520b4c3e65331913647ceb3fec04333478267174 Mon Sep 17 00:00:00 2001 From: "J. Ryan Stinnett" Date: Mon, 30 Mar 2020 16:33:16 +0100 Subject: [PATCH 0046/2751] Add tests for was verified case --- test/utils/ShieldUtils-test.js | 18 +++++++++++++++--- 1 file changed, 15 insertions(+), 3 deletions(-) diff --git a/test/utils/ShieldUtils-test.js b/test/utils/ShieldUtils-test.js index 66dfab4234..5f676579fa 100644 --- a/test/utils/ShieldUtils-test.js +++ b/test/utils/ShieldUtils-test.js @@ -6,7 +6,7 @@ function mkClient(selfTrust) { getUserId: () => "@self:localhost", checkUserTrust: (userId) => ({ isCrossSigningVerified: () => userId[1] == "T", - wasCrossSigningVerified: () => userId[1] == "T", + wasCrossSigningVerified: () => userId[1] == "T" || userId[1] == "W", }), checkDeviceTrust: (userId, deviceId) => ({ isVerified: () => userId === "@self:localhost" ? selfTrust : userId[2] == "T", @@ -151,7 +151,7 @@ describe("shieldStatusForMembership other-trust behaviour", function() { const client = mkClient(true); const room = { roomId: dm ? "DM" : "other", - getEncryptionTargetMembers: () => ["@self:localhost", "@TF:h", "@TT: h"].map((userId) => ({userId})), + getEncryptionTargetMembers: () => ["@self:localhost", "@TF:h", "@TT:h"].map((userId) => ({userId})), }; const status = await shieldStatusForRoom(client, room); expect(status).toEqual(result); @@ -163,7 +163,19 @@ describe("shieldStatusForMembership other-trust behaviour", function() { const client = mkClient(true); const room = { roomId: dm ? "DM" : "other", - getEncryptionTargetMembers: () => ["@self:localhost", "@FF:h", "@FT: h"].map((userId) => ({userId})), + getEncryptionTargetMembers: () => ["@self:localhost", "@FF:h", "@FT:h"].map((userId) => ({userId})), + }; + const status = await shieldStatusForRoom(client, room); + expect(status).toEqual(result); + }); + + it.each( + [["warning", true], ["warning", false]], + )("2 was verified: returns '%s', DM = %s", async (result, dm) => { + const client = mkClient(true); + const room = { + roomId: dm ? "DM" : "other", + getEncryptionTargetMembers: () => ["@self:localhost", "@WF:h", "@FT:h"].map((userId) => ({userId})), }; const status = await shieldStatusForRoom(client, room); expect(status).toEqual(result); From ca5d54031162d19379ddec255e8eeeff33d2b750 Mon Sep 17 00:00:00 2001 From: Travis Ralston Date: Mon, 30 Mar 2020 10:40:26 -0600 Subject: [PATCH 0047/2751] Remove underscore from Jitsi conference names Fixes https://github.com/vector-im/riot-web/issues/12929 Note: we don't need this to fix conferences in our hosted instance (riot.im or modular.im), but it is a common thing for self-hosters, including sometimes ourselves, to accidentally make mistakes on. --- src/CallHandler.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/CallHandler.js b/src/CallHandler.js index 362db939a3..8284e788b4 100644 --- a/src/CallHandler.js +++ b/src/CallHandler.js @@ -430,7 +430,7 @@ async function _startCallApp(roomId, type) { return; } - const confId = `JitsiConference_${generateHumanReadableId()}`; + const confId = `JitsiConference${generateHumanReadableId()}`; const jitsiDomain = SdkConfig.get()['jitsi']['preferredDomain']; let widgetUrl = WidgetUtils.getLocalJitsiWrapperUrl(); From da34e6241dd521a41354e10db8e1bf10810c97f8 Mon Sep 17 00:00:00 2001 From: Jorik Schellekens Date: Mon, 30 Mar 2020 18:18:10 +0100 Subject: [PATCH 0048/2751] Make all 'font-size's and 'line-height's rem Font size of the whole app would ideally be controlled by a single value. This value is currently hard coded using the :root CSS selector. It is the intention to make this value configurable within riot. In the interim all font-sizes have been converted to rem by the simple process of regex. Replacing px values with their equivalent rem values assuming a font size of 15px and then rounded to three decimal places, which was the base at the time of this transformation. I'm expecting another commit cleaning up rem values but I thought it best to leave that to review. This commit doesn't address any scaling issues. I thought it better to land this unwieldy, mechanical, invisible change before the others otherwise the pr would be impossible to review thoroughly. --- res/css/_common.scss | 20 +++++++------ res/css/structures/_ContextualMenu.scss | 2 +- res/css/structures/_CreateRoom.scss | 2 +- res/css/structures/_FilePanel.scss | 8 +++--- res/css/structures/_GroupView.scss | 10 +++---- res/css/structures/_LeftPanel.scss | 2 +- res/css/structures/_MyGroups.scss | 8 +++--- res/css/structures/_NotificationPanel.scss | 4 +-- res/css/structures/_RightPanel.scss | 2 +- res/css/structures/_RoomDirectory.scss | 10 +++---- res/css/structures/_RoomStatusBar.scss | 14 +++++----- res/css/structures/_RoomSubList.scss | 4 +-- res/css/structures/_RoomView.scss | 4 +-- res/css/structures/_TabbedView.scss | 2 +- res/css/structures/_TagPanel.scss | 4 +-- res/css/structures/_ToastContainer.scss | 6 ++-- res/css/structures/_TopLeftMenuButton.scss | 2 +- res/css/structures/_ViewSource.scss | 2 +- .../structures/auth/_CompleteSecurity.scss | 2 +- res/css/views/auth/_AuthBody.scss | 8 +++--- res/css/views/auth/_AuthButtons.scss | 2 +- res/css/views/auth/_AuthFooter.scss | 2 +- res/css/views/auth/_CompleteSecurityBody.scss | 4 +-- res/css/views/auth/_LanguageSelector.scss | 2 +- res/css/views/auth/_ServerTypeSelector.scss | 2 +- .../context_menus/_RoomTileContextMenu.scss | 2 +- .../_StatusMessageContextMenu.scss | 2 +- .../context_menus/_TagTileContextMenu.scss | 2 +- res/css/views/context_menus/_TopLeftMenu.scss | 4 +-- .../views/dialogs/_AddressPickerDialog.scss | 4 +-- .../dialogs/_ConfirmUserActionDialog.scss | 8 +++--- res/css/views/dialogs/_CreateGroupDialog.scss | 4 +-- res/css/views/dialogs/_CreateRoomDialog.scss | 2 +- res/css/views/dialogs/_DevtoolsDialog.scss | 4 +-- res/css/views/dialogs/_InviteDialog.scss | 18 ++++++------ .../dialogs/_MessageEditHistoryDialog.scss | 4 +-- .../dialogs/_NewSessionReviewDialog.scss | 2 +- res/css/views/dialogs/_SetEmailDialog.scss | 2 +- res/css/views/dialogs/_SetMxIdDialog.scss | 2 +- res/css/views/dialogs/_SetPasswordDialog.scss | 2 +- res/css/views/dialogs/_TermsDialog.scss | 2 +- .../views/dialogs/_UnknownDeviceDialog.scss | 2 +- res/css/views/directory/_NetworkDropdown.scss | 14 +++++----- res/css/views/elements/_AccessibleButton.scss | 2 +- res/css/views/elements/_AddressTile.scss | 4 +-- .../views/elements/_DirectorySearchBox.scss | 2 +- res/css/views/elements/_Dropdown.scss | 4 +-- res/css/views/elements/_EventListSummary.scss | 14 +++++----- res/css/views/elements/_Field.scss | 6 ++-- res/css/views/elements/_FormButton.scss | 4 +-- res/css/views/elements/_ImageView.scss | 10 +++---- .../views/elements/_InteractiveTooltip.scss | 2 +- res/css/views/elements/_RichText.scss | 2 +- res/css/views/elements/_Tooltip.scss | 6 ++-- res/css/views/elements/_TooltipButton.scss | 4 +-- res/css/views/emojipicker/_EmojiPicker.scss | 8 +++--- res/css/views/messages/_DateSeparator.scss | 2 +- res/css/views/messages/_MessageActionBar.scss | 2 +- res/css/views/messages/_MessageTimestamp.scss | 2 +- res/css/views/messages/_ReactionsRow.scss | 2 +- .../views/messages/_ReactionsRowButton.scss | 2 +- res/css/views/messages/_ViewSourceEvent.scss | 2 +- .../views/messages/_common_CryptoEvent.scss | 4 +-- res/css/views/right_panel/_UserInfo.scss | 18 ++++++------ .../views/right_panel/_VerificationPanel.scss | 2 +- res/css/views/rooms/_AppsDrawer.scss | 10 +++---- .../views/rooms/_BasicMessageComposer.scss | 4 +-- res/css/views/rooms/_EntityTile.scss | 6 ++-- res/css/views/rooms/_EventTile.scss | 28 +++++++++---------- res/css/views/rooms/_JumpToBottomButton.scss | 4 +-- res/css/views/rooms/_MemberDeviceInfo.scss | 2 +- res/css/views/rooms/_MemberInfo.scss | 14 +++++----- res/css/views/rooms/_MemberList.scss | 2 +- res/css/views/rooms/_MessageComposer.scss | 6 ++-- .../rooms/_MessageComposerFormatBar.scss | 4 +-- res/css/views/rooms/_PresenceLabel.scss | 2 +- res/css/views/rooms/_RoomDropTarget.scss | 4 +-- res/css/views/rooms/_RoomHeader.scss | 8 +++--- res/css/views/rooms/_RoomList.scss | 4 +-- res/css/views/rooms/_RoomPreviewBar.scss | 6 ++-- res/css/views/rooms/_RoomTile.scss | 6 ++-- res/css/views/rooms/_SearchBar.scss | 4 +-- res/css/views/rooms/_SendMessageComposer.scss | 2 +- res/css/views/rooms/_WhoIsTypingTile.scss | 4 +-- res/css/views/settings/tabs/_SettingsTab.scss | 8 +++--- .../views/terms/_InlineTermsAgreement.scss | 2 +- .../verification/_VerificationShowSas.scss | 4 +-- res/css/views/voip/_CallView.scss | 2 +- res/css/views/voip/_IncomingCallbox.scss | 2 +- res/themes/dark/css/_dark.scss | 2 +- res/themes/light/css/_light.scss | 4 +-- 91 files changed, 230 insertions(+), 226 deletions(-) diff --git a/res/css/_common.scss b/res/css/_common.scss index ad64aced50..657fb21244 100644 --- a/res/css/_common.scss +++ b/res/css/_common.scss @@ -16,6 +16,10 @@ See the License for the specific language governing permissions and limitations under the License. */ +:root { + font-size: 15px; +} + html { /* hack to stop overscroll bounce on OSX and iOS. N.B. Breaks things when we have legitimate horizontal overscroll */ @@ -25,7 +29,7 @@ html { body { font-family: $font-family; - font-size: 15px; + font-size: 1rem; background-color: $primary-bg-color; color: $primary-fg-color; border: 0px; @@ -60,7 +64,7 @@ b { h2 { color: $primary-fg-color; font-weight: 400; - font-size: 18px; + font-size: 1.2rem; margin-top: 16px; margin-bottom: 16px; } @@ -76,7 +80,7 @@ input[type=search], input[type=password] { padding: 9px; font-family: $font-family; - font-size: 14px; + font-size: 0.933rem; font-weight: 600; min-width: 0; } @@ -253,7 +257,7 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus { color: $light-fg-color; z-index: 4012; font-weight: 300; - font-size: 15px; + font-size: 1rem; position: relative; padding: 25px 30px 30px 30px; max-height: 80%; @@ -321,8 +325,8 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus { } .mx_Dialog_title { - font-size: 22px; - line-height: 36px; + font-size: 1.467rem; + line-height: 2.400rem; color: $dialog-title-fg-color; } @@ -350,7 +354,7 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus { .mx_Dialog_content { margin: 24px 0 68px; - font-size: 14px; + font-size: 0.933rem; color: $primary-fg-color; word-wrap: break-word; } @@ -446,7 +450,7 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus { } .mx_TextInputDialog_input { - font-size: 15px; + font-size: 1rem; border-radius: 3px; border: 1px solid $input-border-color; padding: 9px; diff --git a/res/css/structures/_ContextualMenu.scss b/res/css/structures/_ContextualMenu.scss index fa2d87029d..67e7a7a8d6 100644 --- a/res/css/structures/_ContextualMenu.scss +++ b/res/css/structures/_ContextualMenu.scss @@ -36,7 +36,7 @@ limitations under the License. background-color: $menu-bg-color; color: $primary-fg-color; position: absolute; - font-size: 14px; + font-size: 0.933rem; z-index: 5001; } diff --git a/res/css/structures/_CreateRoom.scss b/res/css/structures/_CreateRoom.scss index 10f9e23a02..3a66805bfe 100644 --- a/res/css/structures/_CreateRoom.scss +++ b/res/css/structures/_CreateRoom.scss @@ -26,7 +26,7 @@ limitations under the License. border-radius: 3px; border: 1px solid $strong-input-border-color; font-weight: 300; - font-size: 13px; + font-size: 0.867rem; padding: 9px; margin-top: 6px; } diff --git a/res/css/structures/_FilePanel.scss b/res/css/structures/_FilePanel.scss index 87e885e668..eceeab2e1b 100644 --- a/res/css/structures/_FilePanel.scss +++ b/res/css/structures/_FilePanel.scss @@ -49,7 +49,7 @@ limitations under the License. .mx_FilePanel .mx_EventTile .mx_MFileBody_download { display: flex; - font-size: 14px; + font-size: 0.933rem; color: $event-timestamp-color; } @@ -60,7 +60,7 @@ limitations under the License. .mx_FilePanel .mx_EventTile .mx_MImageBody_size { flex: 1 0 0; - font-size: 11px; + font-size: 0.733rem; text-align: right; white-space: nowrap; } @@ -80,7 +80,7 @@ limitations under the License. flex: 1 1 auto; line-height: initial; padding: 0px; - font-size: 11px; + font-size: 0.733rem; opacity: 1.0; color: $event-timestamp-color; } @@ -90,7 +90,7 @@ limitations under the License. text-align: right; visibility: visible; position: initial; - font-size: 11px; + font-size: 0.733rem; opacity: 1.0; color: $event-timestamp-color; } diff --git a/res/css/structures/_GroupView.scss b/res/css/structures/_GroupView.scss index 72a1132c15..6eb5e33462 100644 --- a/res/css/structures/_GroupView.scss +++ b/res/css/structures/_GroupView.scss @@ -134,7 +134,7 @@ limitations under the License. overflow: hidden; color: $primary-fg-color; font-weight: bold; - font-size: 22px; + font-size: 1.467rem; padding-left: 19px; padding-right: 16px; /* why isn't text-overflow working? */ @@ -148,7 +148,7 @@ limitations under the License. max-height: 42px; color: $settings-grey-fg-color; font-weight: 300; - font-size: 13px; + font-size: 0.867rem; padding-left: 19px; margin-right: 16px; overflow: hidden; @@ -196,7 +196,7 @@ limitations under the License. text-transform: uppercase; color: $h3-color; font-weight: 600; - font-size: 13px; + font-size: 0.867rem; margin-bottom: 10px; } @@ -226,7 +226,7 @@ limitations under the License. .mx_GroupView_rooms_header_addRow_label { display: inline-block; vertical-align: top; - line-height: 24px; + line-height: 1.600rem; padding-left: 28px; color: $accent-color; } @@ -258,7 +258,7 @@ limitations under the License. .mx_GroupView_membershipSection_description { /* To match textButton */ - line-height: 34px; + line-height: 2.267rem; } .mx_GroupView_membershipSection_description .mx_BaseAvatar { diff --git a/res/css/structures/_LeftPanel.scss b/res/css/structures/_LeftPanel.scss index 85fdfa092d..6af4b54f91 100644 --- a/res/css/structures/_LeftPanel.scss +++ b/res/css/structures/_LeftPanel.scss @@ -147,7 +147,7 @@ limitations under the License. } .mx_AccessibleButton { - font-size: 14px; + font-size: 0.933rem; margin: 4px 0 1px 9px; padding: 9px; padding-left: 42px; diff --git a/res/css/structures/_MyGroups.scss b/res/css/structures/_MyGroups.scss index 36150c33a5..042994e48c 100644 --- a/res/css/structures/_MyGroups.scss +++ b/res/css/structures/_MyGroups.scss @@ -105,7 +105,7 @@ limitations under the License. .mx_MyGroups_placeholder { background-color: $info-plinth-bg-color; color: $info-plinth-fg-color; - line-height: 400px; + line-height: 26.667rem; border-radius: 10px; text-align: center; } @@ -149,11 +149,11 @@ limitations under the License. .mx_GroupTile_profile .mx_GroupTile_name { margin: 0px; - font-size: 15px; + font-size: 1rem; } .mx_GroupTile_profile .mx_GroupTile_groupId { - font-size: 13px; + font-size: 0.867rem; opacity: 0.7; } @@ -161,7 +161,7 @@ limitations under the License. display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; - font-size: 13px; + font-size: 0.867rem; max-height: 36px; overflow: hidden; } diff --git a/res/css/structures/_NotificationPanel.scss b/res/css/structures/_NotificationPanel.scss index c9e0261ec9..ff95cc2dba 100644 --- a/res/css/structures/_NotificationPanel.scss +++ b/res/css/structures/_NotificationPanel.scss @@ -39,7 +39,7 @@ limitations under the License. .mx_NotificationPanel .mx_EventTile_roomName { font-weight: bold; - font-size: 14px; + font-size: 0.933rem; } .mx_NotificationPanel .mx_EventTile_roomName a { @@ -54,7 +54,7 @@ limitations under the License. .mx_NotificationPanel .mx_EventTile .mx_SenderProfile, .mx_NotificationPanel .mx_EventTile .mx_MessageTimestamp { color: $primary-fg-color; - font-size: 12px; + font-size: 0.8rem; display: inline; padding-left: 0px; } diff --git a/res/css/structures/_RightPanel.scss b/res/css/structures/_RightPanel.scss index 3c373e8883..b0c2b4650f 100644 --- a/res/css/structures/_RightPanel.scss +++ b/res/css/structures/_RightPanel.scss @@ -96,7 +96,7 @@ limitations under the License. } .mx_RightPanel_headerButton_badge { - font-size: 8px; + font-size: 0.533rem; border-radius: 8px; color: $accent-fg-color; background-color: $accent-color; diff --git a/res/css/structures/_RoomDirectory.scss b/res/css/structures/_RoomDirectory.scss index f3a7b0e243..b62f726d09 100644 --- a/res/css/structures/_RoomDirectory.scss +++ b/res/css/structures/_RoomDirectory.scss @@ -64,7 +64,7 @@ limitations under the License. } .mx_RoomDirectory_table { - font-size: 12px; + font-size: 0.8rem; color: $primary-fg-color; width: 100%; text-align: left; @@ -112,7 +112,7 @@ limitations under the License. .mx_RoomDirectory_name { display: inline-block; - font-size: 18px; + font-size: 1.2rem; font-weight: 600; } @@ -124,7 +124,7 @@ limitations under the License. border-radius: 10px; display: inline-block; height: 20px; - line-height: 20px; + line-height: 1.333rem; padding: 0 5px; color: $accent-fg-color; background-color: $rte-room-pill-color; @@ -136,7 +136,7 @@ limitations under the License. } .mx_RoomDirectory_alias { - font-size: 12px; + font-size: 0.8rem; color: $settings-grey-fg-color; } @@ -150,7 +150,7 @@ limitations under the License. } .mx_RoomDirectory > span { - font-size: 15px; + font-size: 1rem; margin-top: 0; .mx_AccessibleButton { diff --git a/res/css/structures/_RoomStatusBar.scss b/res/css/structures/_RoomStatusBar.scss index 090a40235f..1dc99b26f0 100644 --- a/res/css/structures/_RoomStatusBar.scss +++ b/res/css/structures/_RoomStatusBar.scss @@ -32,7 +32,7 @@ limitations under the License. .mx_RoomStatusBar_callBar { height: 50px; - line-height: 50px; + line-height: 3.333rem; } .mx_RoomStatusBar_placeholderIndicator span { @@ -94,7 +94,7 @@ limitations under the License. border-radius: 40px; width: 24px; height: 24px; - line-height: 24px; + line-height: 1.600rem; font-size: 0.8em; vertical-align: top; text-align: center; @@ -132,7 +132,7 @@ limitations under the License. .mx_RoomStatusBar_connectionLostBar_desc { color: $primary-fg-color; - font-size: 13px; + font-size: 0.867rem; opacity: 0.5; padding-bottom: 20px; } @@ -145,7 +145,7 @@ limitations under the License. .mx_RoomStatusBar_typingBar { height: 50px; - line-height: 50px; + line-height: 3.333rem; color: $primary-fg-color; opacity: 0.5; @@ -155,7 +155,7 @@ limitations under the License. .mx_RoomStatusBar_isAlone { height: 50px; - line-height: 50px; + line-height: 3.333rem; color: $primary-fg-color; opacity: 0.5; @@ -174,11 +174,11 @@ limitations under the License. .mx_RoomStatusBar_callBar { height: 40px; - line-height: 40px; + line-height: 2.667rem; } .mx_RoomStatusBar_typingBar { height: 40px; - line-height: 40px; + line-height: 2.667rem; } } diff --git a/res/css/structures/_RoomSubList.scss b/res/css/structures/_RoomSubList.scss index 1934e681c2..a76872a745 100644 --- a/res/css/structures/_RoomSubList.scss +++ b/res/css/structures/_RoomSubList.scss @@ -68,7 +68,7 @@ limitations under the License. text-transform: uppercase; color: $roomsublist-label-fg-color; font-weight: 700; - font-size: 12px; + font-size: 0.8rem; margin-left: 8px; } @@ -76,7 +76,7 @@ limitations under the License. flex: 0 0 auto; border-radius: 8px; font-weight: 600; - font-size: 12px; + font-size: 0.8rem; padding: 0 5px; color: $roomtile-badge-fg-color; background-color: $roomtile-name-color; diff --git a/res/css/structures/_RoomView.scss b/res/css/structures/_RoomView.scss index 5e826306c6..52de9384d7 100644 --- a/res/css/structures/_RoomView.scss +++ b/res/css/structures/_RoomView.scss @@ -23,7 +23,7 @@ limitations under the License. .mx_RoomView_fileDropTarget { min-width: 0px; width: 100%; - font-size: 18px; + font-size: 1.2rem; text-align: center; pointer-events: none; @@ -186,7 +186,7 @@ limitations under the License. .mx_RoomView_empty { flex: 1 1 auto; - font-size: 13px; + font-size: 0.867rem; padding-left: 3em; padding-right: 3em; margin-right: 20px; diff --git a/res/css/structures/_TabbedView.scss b/res/css/structures/_TabbedView.scss index 7904df5a82..20e2120bfd 100644 --- a/res/css/structures/_TabbedView.scss +++ b/res/css/structures/_TabbedView.scss @@ -39,7 +39,7 @@ limitations under the License. cursor: pointer; display: block; border-radius: 3px; - font-size: 14px; + font-size: 0.933rem; min-height: 24px; // use min-height instead of height to allow the label to overflow a bit margin-bottom: 6px; position: relative; diff --git a/res/css/structures/_TagPanel.scss b/res/css/structures/_TagPanel.scss index 472831c0d9..5173358bcc 100644 --- a/res/css/structures/_TagPanel.scss +++ b/res/css/structures/_TagPanel.scss @@ -139,7 +139,7 @@ limitations under the License. background-color: $neutral-badge-color; color: #ffffff; font-weight: 600; - font-size: 10px; + font-size: 0.667rem; text-align: center; padding-top: 1px; padding-left: 4px; @@ -157,7 +157,7 @@ limitations under the License. border-radius: 8px; color: $accent-fg-color; font-weight: 600; - font-size: 14px; + font-size: 0.933rem; padding: 0 5px; background-color: $roomtile-name-color; } diff --git a/res/css/structures/_ToastContainer.scss b/res/css/structures/_ToastContainer.scss index d1687743d6..07daf3f865 100644 --- a/res/css/structures/_ToastContainer.scss +++ b/res/css/structures/_ToastContainer.scss @@ -77,7 +77,7 @@ limitations under the License. grid-column: 1 / 3; grid-row: 1; margin: 0; - font-size: 15px; + font-size: 1rem; font-weight: 600; } @@ -96,11 +96,11 @@ limitations under the License. white-space: nowrap; text-overflow: ellipsis; margin: 4px 0 11px 0; - font-size: 12px; + font-size: 0.8rem; } .mx_Toast_deviceID { - font-size: 10px; + font-size: 0.667rem; } } } diff --git a/res/css/structures/_TopLeftMenuButton.scss b/res/css/structures/_TopLeftMenuButton.scss index ee03978f18..9bdffb530a 100644 --- a/res/css/structures/_TopLeftMenuButton.scss +++ b/res/css/structures/_TopLeftMenuButton.scss @@ -32,7 +32,7 @@ limitations under the License. .mx_TopLeftMenuButton_name { margin: 0 7px; - font-size: 18px; + font-size: 1.2rem; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; diff --git a/res/css/structures/_ViewSource.scss b/res/css/structures/_ViewSource.scss index b908861c6f..c84c48240e 100644 --- a/res/css/structures/_ViewSource.scss +++ b/res/css/structures/_ViewSource.scss @@ -29,7 +29,7 @@ limitations under the License. .mx_ViewSource pre { text-align: left; - font-size: 12px; + font-size: 0.8rem; padding: 0.5em 1em 0.5em 1em; word-wrap: break-word; white-space: pre-wrap; diff --git a/res/css/structures/auth/_CompleteSecurity.scss b/res/css/structures/auth/_CompleteSecurity.scss index 601492d43c..9367c2c996 100644 --- a/res/css/structures/auth/_CompleteSecurity.scss +++ b/res/css/structures/auth/_CompleteSecurity.scss @@ -34,7 +34,7 @@ limitations under the License. } .mx_CompleteSecurity_body { - font-size: 15px; + font-size: 1rem; } .mx_CompleteSecurity_waiting { diff --git a/res/css/views/auth/_AuthBody.scss b/res/css/views/auth/_AuthBody.scss index 7c5b008535..219bf6d0e7 100644 --- a/res/css/views/auth/_AuthBody.scss +++ b/res/css/views/auth/_AuthBody.scss @@ -17,7 +17,7 @@ limitations under the License. .mx_AuthBody { width: 500px; - font-size: 12px; + font-size: 0.8rem; color: $authpage-secondary-color; background-color: $authpage-body-bg-color; border-radius: 0 4px 4px 0; @@ -25,14 +25,14 @@ limitations under the License. box-sizing: border-box; h2 { - font-size: 24px; + font-size: 1.600rem; font-weight: 600; margin-top: 8px; color: $authpage-primary-color; } h3 { - font-size: 14px; + font-size: 0.933rem; font-weight: 600; color: $authpage-primary-color; } @@ -98,7 +98,7 @@ limitations under the License. .mx_AuthBody_editServerDetails { padding-left: 1em; - font-size: 12px; + font-size: 0.8rem; font-weight: normal; } diff --git a/res/css/views/auth/_AuthButtons.scss b/res/css/views/auth/_AuthButtons.scss index 553adeee14..109a1f4670 100644 --- a/res/css/views/auth/_AuthButtons.scss +++ b/res/css/views/auth/_AuthButtons.scss @@ -43,7 +43,7 @@ limitations under the License. cursor: pointer; - font-size: 15px; + font-size: 1rem; padding: 0 11px; word-break: break-word; } diff --git a/res/css/views/auth/_AuthFooter.scss b/res/css/views/auth/_AuthFooter.scss index ab169a6898..b1bdcb697e 100644 --- a/res/css/views/auth/_AuthFooter.scss +++ b/res/css/views/auth/_AuthFooter.scss @@ -17,7 +17,7 @@ limitations under the License. .mx_AuthFooter { text-align: center; width: 100%; - font-size: 14px; + font-size: 0.933rem; opacity: 0.72; padding: 20px 0; background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8)); diff --git a/res/css/views/auth/_CompleteSecurityBody.scss b/res/css/views/auth/_CompleteSecurityBody.scss index c7860fbe74..af0620c329 100644 --- a/res/css/views/auth/_CompleteSecurityBody.scss +++ b/res/css/views/auth/_CompleteSecurityBody.scss @@ -24,13 +24,13 @@ limitations under the License. box-sizing: border-box; h2 { - font-size: 24px; + font-size: 1.600rem; font-weight: 600; margin-top: 0; } h3 { - font-size: 14px; + font-size: 0.933rem; font-weight: 600; } diff --git a/res/css/views/auth/_LanguageSelector.scss b/res/css/views/auth/_LanguageSelector.scss index 6f7eac0cf6..e9ac8688ed 100644 --- a/res/css/views/auth/_LanguageSelector.scss +++ b/res/css/views/auth/_LanguageSelector.scss @@ -20,7 +20,7 @@ limitations under the License. .mx_AuthBody_language .mx_Dropdown_input { border: none; - font-size: 14px; + font-size: 0.933rem; font-weight: 600; color: $authpage-lang-color; } diff --git a/res/css/views/auth/_ServerTypeSelector.scss b/res/css/views/auth/_ServerTypeSelector.scss index ed781726b7..2042358b8a 100644 --- a/res/css/views/auth/_ServerTypeSelector.scss +++ b/res/css/views/auth/_ServerTypeSelector.scss @@ -65,5 +65,5 @@ limitations under the License. } .mx_ServerTypeSelector_description { - font-size: 10px; + font-size: 0.667rem; } diff --git a/res/css/views/context_menus/_RoomTileContextMenu.scss b/res/css/views/context_menus/_RoomTileContextMenu.scss index 308cecfe1e..1e1a5f889f 100644 --- a/res/css/views/context_menus/_RoomTileContextMenu.scss +++ b/res/css/views/context_menus/_RoomTileContextMenu.scss @@ -38,7 +38,7 @@ limitations under the License. white-space: nowrap; display: flex; align-items: center; - line-height: 16px; + line-height: 1.067rem; } .mx_RoomTileContextMenu_tag_field.mx_RoomTileContextMenu_tag_fieldSet { diff --git a/res/css/views/context_menus/_StatusMessageContextMenu.scss b/res/css/views/context_menus/_StatusMessageContextMenu.scss index 2c8d608950..b68d16281a 100644 --- a/res/css/views/context_menus/_StatusMessageContextMenu.scss +++ b/res/css/views/context_menus/_StatusMessageContextMenu.scss @@ -44,7 +44,7 @@ input.mx_StatusMessageContextMenu_message { .mx_StatusMessageContextMenu_clear { @mixin mx_DialogButton; align-self: start; - font-size: 12px; + font-size: 0.8rem; padding: 6px 1em; border: 1px solid transparent; margin-right: 10px; diff --git a/res/css/views/context_menus/_TagTileContextMenu.scss b/res/css/views/context_menus/_TagTileContextMenu.scss index 46b279ce2d..20f95d7f84 100644 --- a/res/css/views/context_menus/_TagTileContextMenu.scss +++ b/res/css/views/context_menus/_TagTileContextMenu.scss @@ -22,7 +22,7 @@ limitations under the License. white-space: nowrap; display: flex; align-items: center; - line-height: 16px; + line-height: 1.067rem; } .mx_TagTileContextMenu_item object { diff --git a/res/css/views/context_menus/_TopLeftMenu.scss b/res/css/views/context_menus/_TopLeftMenu.scss index ed0d0106bc..abcaa4fcb5 100644 --- a/res/css/views/context_menus/_TopLeftMenu.scss +++ b/res/css/views/context_menus/_TopLeftMenu.scss @@ -19,12 +19,12 @@ limitations under the License. border-radius: 4px; .mx_TopLeftMenu_greyedText { - font-size: 12px; + font-size: 0.8rem; opacity: 0.5; } .mx_TopLeftMenu_upgradeLink { - font-size: 12px; + font-size: 0.8rem; img { margin-left: 5px; diff --git a/res/css/views/dialogs/_AddressPickerDialog.scss b/res/css/views/dialogs/_AddressPickerDialog.scss index 39a9260ba3..6b107b3253 100644 --- a/res/css/views/dialogs/_AddressPickerDialog.scss +++ b/res/css/views/dialogs/_AddressPickerDialog.scss @@ -28,7 +28,7 @@ limitations under the License. .mx_AddressPickerDialog_input, .mx_AddressPickerDialog_input:focus { height: 26px; - font-size: 14px; + font-size: 0.933rem; font-family: $font-family; padding-left: 12px; padding-right: 12px; @@ -50,7 +50,7 @@ limitations under the License. .mx_AddressPickerDialog_inputContainer { border-radius: 3px; border: solid 1px $input-border-color; - line-height: 36px; + line-height: 2.400rem; padding-left: 4px; padding-right: 4px; padding-top: 1px; diff --git a/res/css/views/dialogs/_ConfirmUserActionDialog.scss b/res/css/views/dialogs/_ConfirmUserActionDialog.scss index b859d6bf4d..e589ef0450 100644 --- a/res/css/views/dialogs/_ConfirmUserActionDialog.scss +++ b/res/css/views/dialogs/_ConfirmUserActionDialog.scss @@ -26,22 +26,22 @@ limitations under the License. } .mx_ConfirmUserActionDialog_name { - font-size: 18px; + font-size: 1.2rem; } .mx_ConfirmUserActionDialog_userId { - font-size: 13px; + font-size: 0.867rem; } .mx_ConfirmUserActionDialog_reasonField { font-family: $font-family; - font-size: 14px; + font-size: 0.933rem; color: $primary-fg-color; background-color: $primary-bg-color; border-radius: 3px; border: solid 1px $input-border-color; - line-height: 36px; + line-height: 2.400rem; padding-left: 16px; padding-right: 16px; padding-top: 1px; diff --git a/res/css/views/dialogs/_CreateGroupDialog.scss b/res/css/views/dialogs/_CreateGroupDialog.scss index 128eacc3ce..4159944e5d 100644 --- a/res/css/views/dialogs/_CreateGroupDialog.scss +++ b/res/css/views/dialogs/_CreateGroupDialog.scss @@ -25,7 +25,7 @@ limitations under the License. } .mx_CreateGroupDialog_input { - font-size: 15px; + font-size: 1rem; border-radius: 3px; border: 1px solid $input-border-color; padding: 9px; @@ -44,7 +44,7 @@ limitations under the License. .mx_CreateGroupDialog_prefix, .mx_CreateGroupDialog_suffix { padding: 0px 5px; - line-height: 37px; + line-height: 2.467rem; background-color: $input-darker-bg-color; border: 1px solid $input-border-color; text-align: center; diff --git a/res/css/views/dialogs/_CreateRoomDialog.scss b/res/css/views/dialogs/_CreateRoomDialog.scss index 7416ec2ef4..1cdbe99843 100644 --- a/res/css/views/dialogs/_CreateRoomDialog.scss +++ b/res/css/views/dialogs/_CreateRoomDialog.scss @@ -49,7 +49,7 @@ limitations under the License. } .mx_CreateRoomDialog_input { - font-size: 15px; + font-size: 1rem; border-radius: 3px; border: 1px solid $input-border-color; padding: 9px; diff --git a/res/css/views/dialogs/_DevtoolsDialog.scss b/res/css/views/dialogs/_DevtoolsDialog.scss index 500c46b5fd..399c7225f6 100644 --- a/res/css/views/dialogs/_DevtoolsDialog.scss +++ b/res/css/views/dialogs/_DevtoolsDialog.scss @@ -68,11 +68,11 @@ limitations under the License. width: 240px; color: $input-fg-color; font-family: $font-family; - font-size: 16px; + font-size: 1.067rem; } .mx_DevTools_textarea { - font-size: 12px; + font-size: 0.8rem; max-width: 684px; min-height: 250px; padding: 10px; diff --git a/res/css/views/dialogs/_InviteDialog.scss b/res/css/views/dialogs/_InviteDialog.scss index 5e0893b8fd..22b1867002 100644 --- a/res/css/views/dialogs/_InviteDialog.scss +++ b/res/css/views/dialogs/_InviteDialog.scss @@ -40,8 +40,8 @@ limitations under the License. textarea, textarea:focus { height: 34px; - line-height: 34px; - font-size: 14px; + line-height: 2.267rem; + font-size: 0.933rem; padding-left: 12px; margin: 0 !important; border: 0 !important; @@ -65,7 +65,7 @@ limitations under the License. min-width: 48px; margin-left: 10px; height: 25px; - line-height: 25px; + line-height: 1.667rem; } .mx_InviteDialog_buttonAndSpinner { @@ -84,7 +84,7 @@ limitations under the License. padding-bottom: 10px; h3 { - font-size: 12px; + font-size: 0.8rem; color: $muted-fg-color; font-weight: bold; text-transform: uppercase; @@ -143,23 +143,23 @@ limitations under the License. .mx_InviteDialog_roomTile_name { font-weight: 600; - font-size: 14px; + font-size: 0.933rem; color: $primary-fg-color; margin-left: 7px; } .mx_InviteDialog_roomTile_userId { - font-size: 12px; + font-size: 0.8rem; color: $muted-fg-color; margin-left: 7px; } .mx_InviteDialog_roomTile_time { text-align: right; - font-size: 12px; + font-size: 0.8rem; color: $muted-fg-color; float: right; - line-height: 36px; // Height of the avatar to keep the time vertically aligned + line-height: 2.400rem; // Height of the avatar to keep the time vertically aligned } .mx_InviteDialog_roomTile_highlight { @@ -176,7 +176,7 @@ limitations under the License. border-radius: 12px; display: inline-block; height: 24px; - line-height: 24px; + line-height: 1.600rem; padding-left: 8px; padding-right: 8px; color: #ffffff; // this is fine without a var because it's for both themes diff --git a/res/css/views/dialogs/_MessageEditHistoryDialog.scss b/res/css/views/dialogs/_MessageEditHistoryDialog.scss index 0066faccae..8d989f6a00 100644 --- a/res/css/views/dialogs/_MessageEditHistoryDialog.scss +++ b/res/css/views/dialogs/_MessageEditHistoryDialog.scss @@ -35,7 +35,7 @@ limitations under the License. .mx_MessageEditHistoryDialog_edits { list-style-type: none; - font-size: 14px; + font-size: 0.933rem; padding: 0; color: $primary-fg-color; @@ -60,7 +60,7 @@ limitations under the License. } .mx_MessageActionBar .mx_AccessibleButton { - font-size: 10px; + font-size: 0.667rem; padding: 0 8px; } } diff --git a/res/css/views/dialogs/_NewSessionReviewDialog.scss b/res/css/views/dialogs/_NewSessionReviewDialog.scss index 7e35fe941e..633b3a063b 100644 --- a/res/css/views/dialogs/_NewSessionReviewDialog.scss +++ b/res/css/views/dialogs/_NewSessionReviewDialog.scss @@ -32,6 +32,6 @@ limitations under the License. } .mx_NewSessionReviewDialog_deviceID { - font-size: 12px; + font-size: 0.8rem; color: $notice-secondary-color; } diff --git a/res/css/views/dialogs/_SetEmailDialog.scss b/res/css/views/dialogs/_SetEmailDialog.scss index 9d09a208df..a5013f79b1 100644 --- a/res/css/views/dialogs/_SetEmailDialog.scss +++ b/res/css/views/dialogs/_SetEmailDialog.scss @@ -20,7 +20,7 @@ limitations under the License. padding: 9px; color: $input-fg-color; background-color: $primary-bg-color; - font-size: 15px; + font-size: 1rem; width: 100%; max-width: 280px; margin-bottom: 10px; diff --git a/res/css/views/dialogs/_SetMxIdDialog.scss b/res/css/views/dialogs/_SetMxIdDialog.scss index f7d8a3d001..8208a679fd 100644 --- a/res/css/views/dialogs/_SetMxIdDialog.scss +++ b/res/css/views/dialogs/_SetMxIdDialog.scss @@ -29,7 +29,7 @@ limitations under the License. padding: 9px; color: $primary-fg-color; background-color: $primary-bg-color; - font-size: 15px; + font-size: 1rem; width: 100%; max-width: 280px; } diff --git a/res/css/views/dialogs/_SetPasswordDialog.scss b/res/css/views/dialogs/_SetPasswordDialog.scss index 325ff6c6ed..cff11c8afb 100644 --- a/res/css/views/dialogs/_SetPasswordDialog.scss +++ b/res/css/views/dialogs/_SetPasswordDialog.scss @@ -20,7 +20,7 @@ limitations under the License. padding: 9px; color: $primary-fg-color; background-color: $primary-bg-color; - font-size: 15px; + font-size: 1rem; max-width: 280px; margin-bottom: 10px; } diff --git a/res/css/views/dialogs/_TermsDialog.scss b/res/css/views/dialogs/_TermsDialog.scss index beb507e778..e9805d1b35 100644 --- a/res/css/views/dialogs/_TermsDialog.scss +++ b/res/css/views/dialogs/_TermsDialog.scss @@ -31,7 +31,7 @@ limitations under the License. } .mx_TermsDialog_termsTable { - font-size: 12px; + font-size: 0.8rem; width: 100%; } diff --git a/res/css/views/dialogs/_UnknownDeviceDialog.scss b/res/css/views/dialogs/_UnknownDeviceDialog.scss index 2b0f8dceca..8bb0ed4ff4 100644 --- a/res/css/views/dialogs/_UnknownDeviceDialog.scss +++ b/res/css/views/dialogs/_UnknownDeviceDialog.scss @@ -27,7 +27,7 @@ limitations under the License. // userid .mx_UnknownDeviceDialog p { font-weight: bold; - font-size: 16px; + font-size: 1.067rem; } .mx_UnknownDeviceDialog .mx_DeviceVerifyButtons { diff --git a/res/css/views/directory/_NetworkDropdown.scss b/res/css/views/directory/_NetworkDropdown.scss index 106392f880..2f0e3e6a17 100644 --- a/res/css/views/directory/_NetworkDropdown.scss +++ b/res/css/views/directory/_NetworkDropdown.scss @@ -47,9 +47,9 @@ limitations under the License. .mx_NetworkDropdown_server_title { padding: 0 10px; - font-size: 15px; + font-size: 1rem; font-weight: 600; - line-height: 20px; + line-height: 1.333rem; margin-bottom: 4px; // remove server button @@ -77,16 +77,16 @@ limitations under the License. .mx_NetworkDropdown_server_subtitle { padding: 0 10px; - font-size: 10px; - line-height: 14px; + font-size: 0.667rem; + line-height: 0.933rem; margin-top: -4px; margin-bottom: 4px; color: $muted-fg-color; } .mx_NetworkDropdown_server_network { - font-size: 12px; - line-height: 16px; + font-size: 0.8rem; + line-height: 1.067rem; padding: 4px 10px; cursor: pointer; position: relative; @@ -154,7 +154,7 @@ limitations under the License. .mx_NetworkDropdown_handle_server { color: $muted-fg-color; - font-size: 12px; + font-size: 0.8rem; } } diff --git a/res/css/views/elements/_AccessibleButton.scss b/res/css/views/elements/_AccessibleButton.scss index b87071745d..b7439d5856 100644 --- a/res/css/views/elements/_AccessibleButton.scss +++ b/res/css/views/elements/_AccessibleButton.scss @@ -27,7 +27,7 @@ limitations under the License. text-align: center; border-radius: 4px; display: inline-block; - font-size: 14px; + font-size: 0.933rem; } .mx_AccessibleButton_kind_primary { diff --git a/res/css/views/elements/_AddressTile.scss b/res/css/views/elements/_AddressTile.scss index 0ecfb17c83..94028481d4 100644 --- a/res/css/views/elements/_AddressTile.scss +++ b/res/css/views/elements/_AddressTile.scss @@ -19,9 +19,9 @@ limitations under the License. border-radius: 3px; background-color: rgba(74, 73, 74, 0.1); border: solid 1px $input-border-color; - line-height: 26px; + line-height: 1.733rem; color: $primary-fg-color; - font-size: 14px; + font-size: 0.933rem; font-weight: normal; margin-right: 4px; } diff --git a/res/css/views/elements/_DirectorySearchBox.scss b/res/css/views/elements/_DirectorySearchBox.scss index 75ef3fbabd..35fb80f5df 100644 --- a/res/css/views/elements/_DirectorySearchBox.scss +++ b/res/css/views/elements/_DirectorySearchBox.scss @@ -32,7 +32,7 @@ limitations under the License. background-repeat: no-repeat; text-indent: 18px; font-weight: 600; - font-size: 12px; + font-size: 0.8rem; user-select: none; cursor: pointer; } diff --git a/res/css/views/elements/_Dropdown.scss b/res/css/views/elements/_Dropdown.scss index 102ac56bf9..64bcf7a33a 100644 --- a/res/css/views/elements/_Dropdown.scss +++ b/res/css/views/elements/_Dropdown.scss @@ -29,7 +29,7 @@ limitations under the License. position: relative; border-radius: 3px; border: 1px solid $strong-input-border-color; - font-size: 12px; + font-size: 0.8rem; user-select: none; } @@ -53,7 +53,7 @@ limitations under the License. .mx_Dropdown_option { height: 35px; - line-height: 35px; + line-height: 2.333rem; padding-left: 8px; padding-right: 8px; } diff --git a/res/css/views/elements/_EventListSummary.scss b/res/css/views/elements/_EventListSummary.scss index 99a5c06a5f..a40c1384d7 100644 --- a/res/css/views/elements/_EventListSummary.scss +++ b/res/css/views/elements/_EventListSummary.scss @@ -19,7 +19,7 @@ limitations under the License. } .mx_TextualEvent.mx_EventListSummary_summary { - font-size: 14px; + font-size: 0.933rem; display: inline-flex; } @@ -27,7 +27,7 @@ limitations under the License. display: inline-block; margin-right: 8px; padding-top: 8px; - line-height: 12px; + line-height: 0.8rem; } .mx_EventListSummary_avatars .mx_BaseAvatar { @@ -46,19 +46,19 @@ limitations under the License. .mx_EventListSummary_line { border-bottom: 1px solid $primary-hairline-color; margin-left: 63px; - line-height: 30px; + line-height: 2.000rem; } .mx_MatrixChat_useCompactLayout { .mx_EventListSummary { - font-size: 13px; + font-size: 0.867rem; .mx_EventTile_line { - line-height: 20px; + line-height: 1.333rem; } } .mx_EventListSummary_line { - line-height: 22px; + line-height: 1.467rem; } .mx_EventListSummary_toggle { @@ -66,6 +66,6 @@ limitations under the License. } .mx_TextualEvent.mx_EventListSummary_summary { - font-size: 13px; + font-size: 0.867rem; } } diff --git a/res/css/views/elements/_Field.scss b/res/css/views/elements/_Field.scss index b260d4b097..26d24dba3a 100644 --- a/res/css/views/elements/_Field.scss +++ b/res/css/views/elements/_Field.scss @@ -40,7 +40,7 @@ limitations under the License. .mx_Field textarea { font-weight: normal; font-family: $font-family; - font-size: 14px; + font-size: 0.933rem; border: none; // Even without a border here, we still need this avoid overlapping the rounded // corners on the field above. @@ -102,7 +102,7 @@ limitations under the License. background-color 0.25s ease-out 0.1s; color: $primary-fg-color; background-color: transparent; - font-size: 14px; + font-size: 0.933rem; position: absolute; left: 0px; top: 0px; @@ -126,7 +126,7 @@ limitations under the License. color 0.25s ease-out 0s, top 0.25s ease-out 0s, background-color 0.25s ease-out 0s; - font-size: 10px; + font-size: 0.667rem; top: -13px; padding: 0 2px; background-color: $field-focused-label-bg-color; diff --git a/res/css/views/elements/_FormButton.scss b/res/css/views/elements/_FormButton.scss index 1483fe2091..c23ab6ee30 100644 --- a/res/css/views/elements/_FormButton.scss +++ b/res/css/views/elements/_FormButton.scss @@ -15,9 +15,9 @@ limitations under the License. */ .mx_FormButton { - line-height: 16px; + line-height: 1.067rem; padding: 5px 15px; - font-size: 12px; + font-size: 0.8rem; height: min-content; &:not(:last-child) { diff --git a/res/css/views/elements/_ImageView.scss b/res/css/views/elements/_ImageView.scss index 67b0d6d7df..cc7fca67d3 100644 --- a/res/css/views/elements/_ImageView.scss +++ b/res/css/views/elements/_ImageView.scss @@ -102,13 +102,13 @@ limitations under the License. } .mx_ImageView_name { - font-size: 18px; + font-size: 1.2rem; margin-bottom: 6px; word-wrap: break-word; } .mx_ImageView_metadata { - font-size: 15px; + font-size: 1rem; opacity: 0.5; } @@ -118,13 +118,13 @@ limitations under the License. margin-bottom: 6px; border-radius: 5px; background-color: $lightbox-bg-color; - font-size: 14px; + font-size: 0.933rem; padding: 9px; border: 1px solid $lightbox-border-color; } .mx_ImageView_size { - font-size: 11px; + font-size: 0.733rem; } .mx_ImageView_link { @@ -133,7 +133,7 @@ limitations under the License. } .mx_ImageView_button { - font-size: 15px; + font-size: 1rem; opacity: 0.5; margin-top: 18px; cursor: pointer; diff --git a/res/css/views/elements/_InteractiveTooltip.scss b/res/css/views/elements/_InteractiveTooltip.scss index 17a76436e8..07441ef85d 100644 --- a/res/css/views/elements/_InteractiveTooltip.scss +++ b/res/css/views/elements/_InteractiveTooltip.scss @@ -24,7 +24,7 @@ limitations under the License. background-color: $interactive-tooltip-bg-color; color: $interactive-tooltip-fg-color; position: absolute; - font-size: 10px; + font-size: 0.667rem; font-weight: 600; padding: 6px; z-index: 5001; diff --git a/res/css/views/elements/_RichText.scss b/res/css/views/elements/_RichText.scss index 5066ee10f3..d821f52e3d 100644 --- a/res/css/views/elements/_RichText.scss +++ b/res/css/views/elements/_RichText.scss @@ -9,7 +9,7 @@ border-radius: 16px; display: inline-block; height: 20px; - line-height: 20px; + line-height: 1.333rem; padding-left: 5px; } diff --git a/res/css/views/elements/_Tooltip.scss b/res/css/views/elements/_Tooltip.scss index cc4eb409df..61762ced92 100644 --- a/res/css/views/elements/_Tooltip.scss +++ b/res/css/views/elements/_Tooltip.scss @@ -58,8 +58,8 @@ limitations under the License. z-index: 4000; // Higher than dialogs so tooltips can be used in dialogs padding: 10px; pointer-events: none; - line-height: 14px; - font-size: 12px; + line-height: 0.933rem; + font-size: 0.8rem; font-weight: 600; color: $primary-fg-color; max-width: 200px; @@ -82,7 +82,7 @@ limitations under the License. text-align: center; border: none; border-radius: 3px; - font-size: 14px; + font-size: 0.933rem; line-height: 1.2; padding: 6px 8px; diff --git a/res/css/views/elements/_TooltipButton.scss b/res/css/views/elements/_TooltipButton.scss index 6ea36c800e..c350fc22e2 100644 --- a/res/css/views/elements/_TooltipButton.scss +++ b/res/css/views/elements/_TooltipButton.scss @@ -28,7 +28,7 @@ limitations under the License. transition: opacity 0.2s ease-in; opacity: 0.6; - line-height: 11px; + line-height: 0.733rem; text-align: center; cursor: pointer; @@ -47,6 +47,6 @@ limitations under the License. .mx_TooltipButton_helpText { width: 400px; text-align: start; - line-height: 17px !important; + line-height: 1.133rem !important; } diff --git a/res/css/views/emojipicker/_EmojiPicker.scss b/res/css/views/emojipicker/_EmojiPicker.scss index 5d9b3f2687..64b27b9ab3 100644 --- a/res/css/views/emojipicker/_EmojiPicker.scss +++ b/res/css/views/emojipicker/_EmojiPicker.scss @@ -163,7 +163,7 @@ limitations under the License. .mx_EmojiPicker_item { display: inline-block; - font-size: 20px; + font-size: 1.333rem; padding: 5px; width: 100%; height: 100%; @@ -183,7 +183,7 @@ limitations under the License. } .mx_EmojiPicker_category_label, .mx_EmojiPicker_preview_name { - font-size: 16px; + font-size: 1.067rem; font-weight: 600; margin: 0; } @@ -197,7 +197,7 @@ limitations under the License. } .mx_EmojiPicker_preview_emoji { - font-size: 32px; + font-size: 2.133rem; padding: 8px 16px; } @@ -212,7 +212,7 @@ limitations under the License. .mx_EmojiPicker_shortcode { color: $light-fg-color; - font-size: 14px; + font-size: 0.933rem; &::before, &::after { content: ":"; diff --git a/res/css/views/messages/_DateSeparator.scss b/res/css/views/messages/_DateSeparator.scss index 935ee1aba3..b02e72814f 100644 --- a/res/css/views/messages/_DateSeparator.scss +++ b/res/css/views/messages/_DateSeparator.scss @@ -19,7 +19,7 @@ limitations under the License. margin: 4px 0; display: flex; align-items: center; - font-size: 14px; + font-size: 0.933rem; color: $roomtopic-color; } diff --git a/res/css/views/messages/_MessageActionBar.scss b/res/css/views/messages/_MessageActionBar.scss index c032051c36..66ba0b227d 100644 --- a/res/css/views/messages/_MessageActionBar.scss +++ b/res/css/views/messages/_MessageActionBar.scss @@ -21,7 +21,7 @@ limitations under the License. cursor: pointer; display: flex; height: 24px; - line-height: 24px; + line-height: 1.600rem; border-radius: 4px; background: $message-action-bar-bg-color; top: -18px; diff --git a/res/css/views/messages/_MessageTimestamp.scss b/res/css/views/messages/_MessageTimestamp.scss index e5c228aa68..3a2a8d6336 100644 --- a/res/css/views/messages/_MessageTimestamp.scss +++ b/res/css/views/messages/_MessageTimestamp.scss @@ -16,5 +16,5 @@ limitations under the License. .mx_MessageTimestamp { color: $event-timestamp-color; - font-size: 10px; + font-size: 0.667rem; } diff --git a/res/css/views/messages/_ReactionsRow.scss b/res/css/views/messages/_ReactionsRow.scss index 57c02ed3e5..ee816e0fc0 100644 --- a/res/css/views/messages/_ReactionsRow.scss +++ b/res/css/views/messages/_ReactionsRow.scss @@ -21,7 +21,7 @@ limitations under the License. .mx_ReactionsRow_showAll { text-decoration: none; - font-size: 10px; + font-size: 0.667rem; font-weight: 600; margin-left: 6px; vertical-align: top; diff --git a/res/css/views/messages/_ReactionsRowButton.scss b/res/css/views/messages/_ReactionsRowButton.scss index e54201d963..7160c223be 100644 --- a/res/css/views/messages/_ReactionsRowButton.scss +++ b/res/css/views/messages/_ReactionsRowButton.scss @@ -17,7 +17,7 @@ limitations under the License. .mx_ReactionsRowButton { display: inline-flex; height: 20px; - line-height: 21px; + line-height: 1.400rem; margin-right: 6px; padding: 0 6px; border: 1px solid $reaction-row-button-border-color; diff --git a/res/css/views/messages/_ViewSourceEvent.scss b/res/css/views/messages/_ViewSourceEvent.scss index a15924e759..088b66445d 100644 --- a/res/css/views/messages/_ViewSourceEvent.scss +++ b/res/css/views/messages/_ViewSourceEvent.scss @@ -17,7 +17,7 @@ limitations under the License. .mx_EventTile_content.mx_ViewSourceEvent { display: flex; opacity: 0.6; - font-size: 12px; + font-size: 0.8rem; pre, code { flex: 1; diff --git a/res/css/views/messages/_common_CryptoEvent.scss b/res/css/views/messages/_common_CryptoEvent.scss index 98e1e97e39..c9499b763f 100644 --- a/res/css/views/messages/_common_CryptoEvent.scss +++ b/res/css/views/messages/_common_CryptoEvent.scss @@ -45,7 +45,7 @@ limitations under the License. .mx_cryptoEvent_title { font-weight: 600; - font-size: 15px; + font-size: 1rem; grid-column: 2; grid-row: 1; } @@ -56,7 +56,7 @@ limitations under the License. } .mx_cryptoEvent_state, .mx_cryptoEvent_subtitle { - font-size: 12px; + font-size: 0.8rem; } .mx_cryptoEvent_state, .mx_cryptoEvent_buttons { diff --git a/res/css/views/right_panel/_UserInfo.scss b/res/css/views/right_panel/_UserInfo.scss index 0e4b1bda9e..acc5e4641f 100644 --- a/res/css/views/right_panel/_UserInfo.scss +++ b/res/css/views/right_panel/_UserInfo.scss @@ -20,7 +20,7 @@ limitations under the License. flex-direction: column; flex: 1; overflow-y: auto; - font-size: 12px; + font-size: 0.8rem; .mx_UserInfo_cancel { cursor: pointer; @@ -43,7 +43,7 @@ limitations under the License. } h2 { - font-size: 18px; + font-size: 1.2rem; font-weight: 600; margin: 18px 0 0 0; } @@ -109,7 +109,7 @@ limitations under the License. justify-content: center; // override the calculated sizes so that the letter isn't HUGE - font-size: 56px !important; + font-size: 3.733rem !important; width: 100% !important; transition: font-size 0.5s; } @@ -122,7 +122,7 @@ limitations under the License. text-transform: uppercase; color: $notice-secondary-color; font-weight: bold; - font-size: 12px; + font-size: 0.8rem; margin: 4px 0; } @@ -134,8 +134,8 @@ limitations under the License. text-align: center; h2 { - font-size: 18px; - line-height: 25px; + font-size: 1.2rem; + line-height: 1.667rem; flex: 1; justify-content: center; align-items: center; @@ -197,7 +197,7 @@ limitations under the License. .mx_UserInfo_field { cursor: pointer; color: $accent-color; - line-height: 16px; + line-height: 1.067rem; margin: 8px 0; &.mx_UserInfo_destructive { @@ -206,7 +206,7 @@ limitations under the License. } .mx_UserInfo_statusMessage { - font-size: 11px; + font-size: 0.733rem; opacity: 0.5; overflow: hidden; white-space: nowrap; @@ -282,6 +282,6 @@ limitations under the License. } .mx_UserInfo_avatar .mx_BaseAvatar_initial { - font-size: 40px !important; // override the other override because here the avatar is smaller + font-size: 2.667rem !important; // override the other override because here the avatar is smaller } } diff --git a/res/css/views/right_panel/_VerificationPanel.scss b/res/css/views/right_panel/_VerificationPanel.scss index 459622b277..4a10dcbbcd 100644 --- a/res/css/views/right_panel/_VerificationPanel.scss +++ b/res/css/views/right_panel/_VerificationPanel.scss @@ -95,7 +95,7 @@ limitations under the License. } .mx_VerificationPanel_QRPhase_helpText { - font-size: 14px; + font-size: 0.933rem; margin-top: 71px; text-align: center; } diff --git a/res/css/views/rooms/_AppsDrawer.scss b/res/css/views/rooms/_AppsDrawer.scss index a3fe573ad0..171cf49ba5 100644 --- a/res/css/views/rooms/_AppsDrawer.scss +++ b/res/css/views/rooms/_AppsDrawer.scss @@ -46,7 +46,7 @@ $AppsDrawerBodyHeight: 273px; padding: 0; margin: 5px auto 5px auto; color: $accent-color; - font-size: 12px; + font-size: 0.8rem; } .mx_AddWidget_button_full_width { @@ -59,7 +59,7 @@ $AppsDrawerBodyHeight: 273px; padding: 9px; color: $primary-hairline-color; background-color: $primary-bg-color; - font-size: 15px; + font-size: 1rem; } .mx_AppTile { @@ -102,7 +102,7 @@ $AppsDrawerBodyHeight: 273px; .mx_AppTileMenuBar { margin: 0; - font-size: 12px; + font-size: 0.8rem; background-color: $widget-menu-bar-bg-color; display: flex; flex-direction: row; @@ -272,7 +272,7 @@ form.mx_Custom_Widget_Form div { flex-direction: column; justify-content: center; align-items: center; - font-size: 16px; + font-size: 1.067rem; } .mx_AppPermissionWarning_row { @@ -280,7 +280,7 @@ form.mx_Custom_Widget_Form div { } .mx_AppPermissionWarning_smallText { - font-size: 12px; + font-size: 0.8rem; } .mx_AppPermissionWarning_bolder { diff --git a/res/css/views/rooms/_BasicMessageComposer.scss b/res/css/views/rooms/_BasicMessageComposer.scss index ce519b1ea7..c1f9663ea3 100644 --- a/res/css/views/rooms/_BasicMessageComposer.scss +++ b/res/css/views/rooms/_BasicMessageComposer.scss @@ -63,8 +63,8 @@ limitations under the License. border-radius: 8px; text-align: center; font-weight: normal; - line-height: 16px; - font-size: 10.4px; + line-height: 1.067rem; + font-size: 0.667rem; } } } diff --git a/res/css/views/rooms/_EntityTile.scss b/res/css/views/rooms/_EntityTile.scss index a2867de3a7..d66e4efe5c 100644 --- a/res/css/views/rooms/_EntityTile.scss +++ b/res/css/views/rooms/_EntityTile.scss @@ -78,7 +78,7 @@ limitations under the License. .mx_GroupRoomTile_name { flex: 1 1 0; overflow: hidden; - font-size: 14px; + font-size: 0.933rem; text-overflow: ellipsis; white-space: nowrap; } @@ -116,7 +116,7 @@ limitations under the License. } .mx_EntityTile_subtext { - font-size: 11px; + font-size: 0.733rem; opacity: 0.5; overflow: hidden; white-space: nowrap; @@ -125,7 +125,7 @@ limitations under the License. .mx_EntityTile_power { padding-inline-start: 6px; - font-size: 10px; + font-size: 0.667rem; color: $notice-secondary-color; max-width: 6em; overflow: hidden; diff --git a/res/css/views/rooms/_EventTile.scss b/res/css/views/rooms/_EventTile.scss index 2fa9994155..436b158644 100644 --- a/res/css/views/rooms/_EventTile.scss +++ b/res/css/views/rooms/_EventTile.scss @@ -19,7 +19,7 @@ limitations under the License. max-width: 100%; clear: both; padding-top: 18px; - font-size: 14px; + font-size: 0.933rem; position: relative; } @@ -64,7 +64,7 @@ limitations under the License. .mx_EventTile .mx_SenderProfile { color: $primary-fg-color; - font-size: 14px; + font-size: 0.933rem; display: inline-block; /* anti-zalgo, with overflow hidden */ overflow: hidden; cursor: pointer; @@ -72,7 +72,7 @@ limitations under the License. padding-bottom: 0px; padding-top: 0px; margin: 0px; - line-height: 17px; + line-height: 1.133rem; /* the next three lines, along with overflow hidden, truncate long display names */ white-space: nowrap; text-overflow: ellipsis; @@ -117,7 +117,7 @@ limitations under the License. padding-bottom: 2px; border-radius: 4px; min-height: 24px; - line-height: 22px; + line-height: 1.467rem; } .mx_RoomView_timeline_rr_enabled { @@ -152,8 +152,8 @@ limitations under the License. /* HACK to override line-height which is already marked important elsewhere */ .mx_EventTile_bigEmoji.mx_EventTile_bigEmoji { - font-size: 48px !important; - line-height: 57px !important; + font-size: 3.200rem !important; + line-height: 3.800rem !important; } .mx_MessagePanel_alwaysShowTimestamps .mx_MessageTimestamp { @@ -312,7 +312,7 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody { .mx_EventTile_readAvatarRemainder { color: $event-timestamp-color; - font-size: 11px; + font-size: 0.733rem; position: absolute; } @@ -341,7 +341,7 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody { .mx_EventTile_spoiler_reason { color: $event-timestamp-color; - font-size: 11px; + font-size: 0.733rem; } .mx_EventTile_spoiler_content { @@ -393,7 +393,7 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody { } .mx_EventTile_keyRequestInfo { - font-size: 12px; + font-size: 0.8rem; } .mx_EventTile_keyRequestInfo_text { @@ -471,7 +471,7 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody { .mx_EventTile_content .mx_EventTile_edited { user-select: none; - font-size: 12px; + font-size: 0.8rem; color: $roomtopic-color; display: inline-block; margin-left: 9px; @@ -489,7 +489,7 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody { white-space: normal !important; line-height: inherit !important; color: inherit; // inherit the colour from the dark or light theme by default (but not for code blocks) - font-size: 14px; + font-size: 0.933rem; pre, code { font-family: $monospace-font-family !important; @@ -589,9 +589,9 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody { .mx_EventTile.mx_EventTile_info { // same as the padding for non-compact .mx_EventTile.mx_EventTile_info padding-top: 0px; - font-size: 13px; + font-size: 0.867rem; .mx_EventTile_line, .mx_EventTile_reply { - line-height: 20px; + line-height: 1.333rem; } .mx_EventTile_avatar { top: 4px; @@ -599,7 +599,7 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody { } .mx_EventTile .mx_SenderProfile { - font-size: 13px; + font-size: 0.867rem; } .mx_EventTile.mx_EventTile_emote { diff --git a/res/css/views/rooms/_JumpToBottomButton.scss b/res/css/views/rooms/_JumpToBottomButton.scss index 7f458092fb..2c44eed1b8 100644 --- a/res/css/views/rooms/_JumpToBottomButton.scss +++ b/res/css/views/rooms/_JumpToBottomButton.scss @@ -34,8 +34,8 @@ limitations under the License. top: -12px; border-radius: 16px; font-weight: bold; - font-size: 12px; - line-height: 14px; + font-size: 0.8rem; + line-height: 0.933rem; text-align: center; // to be able to get it centered // with text-align in parent diff --git a/res/css/views/rooms/_MemberDeviceInfo.scss b/res/css/views/rooms/_MemberDeviceInfo.scss index 15b4832dc5..fe5a4b7659 100644 --- a/res/css/views/rooms/_MemberDeviceInfo.scss +++ b/res/css/views/rooms/_MemberDeviceInfo.scss @@ -59,7 +59,7 @@ limitations under the License. .mx_MemberDeviceInfo_deviceId { word-break: break-word; - font-size: 13px; + font-size: 0.867rem; } .mx_MemberDeviceInfo_deviceInfo { diff --git a/res/css/views/rooms/_MemberInfo.scss b/res/css/views/rooms/_MemberInfo.scss index e3f746e9d3..d4c8fbb097 100644 --- a/res/css/views/rooms/_MemberInfo.scss +++ b/res/css/views/rooms/_MemberInfo.scss @@ -48,7 +48,7 @@ limitations under the License. } .mx_MemberInfo h2 { - font-size: 18px; + font-size: 1.2rem; font-weight: 600; margin: 16px 0 16px 15px; } @@ -94,12 +94,12 @@ limitations under the License. text-transform: uppercase; color: $input-darker-fg-color; font-weight: bold; - font-size: 12px; + font-size: 0.8rem; margin: 4px 0; } .mx_MemberInfo_profileField { - font-size: 15px; + font-size: 1rem; position: relative; } @@ -109,10 +109,10 @@ limitations under the License. .mx_MemberInfo_field { cursor: pointer; - font-size: 15px; + font-size: 1rem; color: $primary-fg-color; margin-left: 8px; - line-height: 23px; + line-height: 1.533rem; } .mx_MemberInfo_createRoom { @@ -128,7 +128,7 @@ limitations under the License. } .mx_MemberInfo label { - font-size: 13px; + font-size: 0.867rem; } .mx_MemberInfo label .mx_MemberInfo_label_text { @@ -144,7 +144,7 @@ limitations under the License. } .mx_MemberInfo_statusMessage { - font-size: 11px; + font-size: 0.733rem; opacity: 0.5; overflow: hidden; white-space: nowrap; diff --git a/res/css/views/rooms/_MemberList.scss b/res/css/views/rooms/_MemberList.scss index 6e4465583c..0f676645a9 100644 --- a/res/css/views/rooms/_MemberList.scss +++ b/res/css/views/rooms/_MemberList.scss @@ -30,7 +30,7 @@ limitations under the License. text-transform: uppercase; color: $h3-color; font-weight: 600; - font-size: 13px; + font-size: 0.867rem; padding-left: 3px; padding-right: 12px; margin-top: 8px; diff --git a/res/css/views/rooms/_MessageComposer.scss b/res/css/views/rooms/_MessageComposer.scss index a05b4c0c0e..3777acf423 100644 --- a/res/css/views/rooms/_MessageComposer.scss +++ b/res/css/views/rooms/_MessageComposer.scss @@ -105,7 +105,7 @@ limitations under the License. min-height: 60px; justify-content: flex-start; align-items: flex-start; - font-size: 14px; + font-size: 0.933rem; margin-right: 6px; } @@ -161,7 +161,7 @@ limitations under the License. box-shadow: none; color: $primary-fg-color; background-color: $primary-bg-color; - font-size: 14px; + font-size: 0.933rem; max-height: 120px; overflow: auto; /* needed for FF */ @@ -242,7 +242,7 @@ limitations under the License. flex-direction: row; align-items: center; - font-size: 10px; + font-size: 0.667rem; color: $greyed-fg-color; } diff --git a/res/css/views/rooms/_MessageComposerFormatBar.scss b/res/css/views/rooms/_MessageComposerFormatBar.scss index 1b5a21bed0..0558cd48cf 100644 --- a/res/css/views/rooms/_MessageComposerFormatBar.scss +++ b/res/css/views/rooms/_MessageComposerFormatBar.scss @@ -97,13 +97,13 @@ limitations under the License. .mx_MessageComposerFormatBar_buttonTooltip { white-space: nowrap; - font-size: 13px; + font-size: 0.867rem; font-weight: 600; min-width: 54px; text-align: center; .mx_MessageComposerFormatBar_tooltipShortcut { - font-size: 9px; + font-size: 0.600rem; opacity: 0.7; } } diff --git a/res/css/views/rooms/_PresenceLabel.scss b/res/css/views/rooms/_PresenceLabel.scss index 26ed1aa6a3..6d044a69b5 100644 --- a/res/css/views/rooms/_PresenceLabel.scss +++ b/res/css/views/rooms/_PresenceLabel.scss @@ -15,6 +15,6 @@ limitations under the License. */ .mx_PresenceLabel { - font-size: 11px; + font-size: 0.733rem; opacity: 0.5; } diff --git a/res/css/views/rooms/_RoomDropTarget.scss b/res/css/views/rooms/_RoomDropTarget.scss index 1076a0563a..1ae8f73e88 100644 --- a/res/css/views/rooms/_RoomDropTarget.scss +++ b/res/css/views/rooms/_RoomDropTarget.scss @@ -28,7 +28,7 @@ limitations under the License. } .mx_RoomDropTarget { - font-size: 13px; + font-size: 0.867rem; padding-top: 5px; padding-bottom: 5px; border: 1px dashed $accent-color; @@ -41,7 +41,7 @@ limitations under the License. .mx_RoomDropTarget_label { position: relative; margin-top: 3px; - line-height: 21px; + line-height: 1.400rem; z-index: 1; text-align: center; } diff --git a/res/css/views/rooms/_RoomHeader.scss b/res/css/views/rooms/_RoomHeader.scss index 47b8131ef0..1737014248 100644 --- a/res/css/views/rooms/_RoomHeader.scss +++ b/res/css/views/rooms/_RoomHeader.scss @@ -77,9 +77,9 @@ limitations under the License. } .mx_RoomHeader_simpleHeader { - line-height: 52px; + line-height: 3.467rem; color: $roomheader-color; - font-size: 18px; + font-size: 1.2rem; font-weight: 600; overflow: hidden; margin-left: 63px; @@ -102,7 +102,7 @@ limitations under the License. overflow: hidden; color: $roomheader-color; font-weight: 600; - font-size: 18px; + font-size: 1.2rem; margin: 0 7px; border-bottom: 1px solid transparent; display: flex; @@ -161,7 +161,7 @@ limitations under the License. flex: 1; color: $roomtopic-color; font-weight: 400; - font-size: 13px; + font-size: 0.867rem; margin: 0 7px; margin-top: 4px; // to align baseline of topic with room name overflow: hidden; diff --git a/res/css/views/rooms/_RoomList.scss b/res/css/views/rooms/_RoomList.scss index 5ed22f997d..b9cb2dc8e4 100644 --- a/res/css/views/rooms/_RoomList.scss +++ b/res/css/views/rooms/_RoomList.scss @@ -47,13 +47,13 @@ limitations under the License. } .mx_RoomList_emptySubListTip { - font-size: 13px; + font-size: 0.867rem; padding: 5px; border: 1px dashed $accent-color; color: $primary-fg-color; background-color: $droptarget-bg-color; border-radius: 4px; - line-height: 16px; + line-height: 1.067rem; } .mx_RoomList_emptySubListTip .mx_RoleButton { diff --git a/res/css/views/rooms/_RoomPreviewBar.scss b/res/css/views/rooms/_RoomPreviewBar.scss index 981cf06c69..8e61524fda 100644 --- a/res/css/views/rooms/_RoomPreviewBar.scss +++ b/res/css/views/rooms/_RoomPreviewBar.scss @@ -23,7 +23,7 @@ limitations under the License. -webkit-align-items: center; h3 { - font-size: 18px; + font-size: 1.2rem; font-weight: 600; &.mx_RoomPreviewBar_spinnerTitle { @@ -48,8 +48,8 @@ limitations under the License. } .mx_RoomPreviewBar_footer { - font-size: 12px; - line-height: 20px; + font-size: 0.8rem; + line-height: 1.333rem; .mx_Spinner { vertical-align: middle; diff --git a/res/css/views/rooms/_RoomTile.scss b/res/css/views/rooms/_RoomTile.scss index 31d887cbbb..57d42f6be2 100644 --- a/res/css/views/rooms/_RoomTile.scss +++ b/res/css/views/rooms/_RoomTile.scss @@ -64,7 +64,7 @@ limitations under the License. .mx_RoomTile_subtext { display: inline-block; - font-size: 11px; + font-size: 0.733rem; padding: 0 0 0 7px; margin: 0; overflow: hidden; @@ -112,7 +112,7 @@ limitations under the License. } .mx_RoomTile_name { - font-size: 14px; + font-size: 0.933rem; padding: 0 4px; color: $roomtile-name-color; white-space: nowrap; @@ -126,7 +126,7 @@ limitations under the License. padding: 0 0.4em; color: $roomtile-badge-fg-color; font-weight: 600; - font-size: 12px; + font-size: 0.8rem; } .collapsed { diff --git a/res/css/views/rooms/_SearchBar.scss b/res/css/views/rooms/_SearchBar.scss index b6748e5ad2..5b80585cef 100644 --- a/res/css/views/rooms/_SearchBar.scss +++ b/res/css/views/rooms/_SearchBar.scss @@ -22,7 +22,7 @@ limitations under the License. .mx_SearchBar_input { // border: 1px solid $input-border-color; - // font-size: 15px; + // font-size: 1rem; flex: 1 1 0; margin-left: 22px; } @@ -45,7 +45,7 @@ limitations under the License. border: 0; margin: 0 0 0 22px; padding: 5px; - font-size: 15px; + font-size: 1rem; cursor: pointer; color: $primary-fg-color; border-bottom: 2px solid $accent-color; diff --git a/res/css/views/rooms/_SendMessageComposer.scss b/res/css/views/rooms/_SendMessageComposer.scss index d20f7107b3..7233d373a3 100644 --- a/res/css/views/rooms/_SendMessageComposer.scss +++ b/res/css/views/rooms/_SendMessageComposer.scss @@ -18,7 +18,7 @@ limitations under the License. flex: 1; display: flex; flex-direction: column; - font-size: 14px; + font-size: 0.933rem; justify-content: center; margin-right: 6px; // don't grow wider than available space diff --git a/res/css/views/rooms/_WhoIsTypingTile.scss b/res/css/views/rooms/_WhoIsTypingTile.scss index 579ea7e73e..a1e6f3a3bf 100644 --- a/res/css/views/rooms/_WhoIsTypingTile.scss +++ b/res/css/views/rooms/_WhoIsTypingTile.scss @@ -49,7 +49,7 @@ limitations under the License. border-radius: 40px; width: 24px; height: 24px; - line-height: 24px; + line-height: 1.600rem; font-size: 0.8em; vertical-align: top; text-align: center; @@ -57,7 +57,7 @@ limitations under the License. .mx_WhoIsTypingTile_label { flex: 1; - font-size: 14px; + font-size: 0.933rem; font-weight: 600; color: $eventtile-meta-color; } diff --git a/res/css/views/settings/tabs/_SettingsTab.scss b/res/css/views/settings/tabs/_SettingsTab.scss index 01a1d94956..03bd3221cd 100644 --- a/res/css/views/settings/tabs/_SettingsTab.scss +++ b/res/css/views/settings/tabs/_SettingsTab.scss @@ -19,7 +19,7 @@ limitations under the License. } .mx_SettingsTab_heading { - font-size: 20px; + font-size: 1.333rem; font-weight: 600; color: $primary-fg-color; } @@ -29,7 +29,7 @@ limitations under the License. } .mx_SettingsTab_subheading { - font-size: 16px; + font-size: 1.067rem; display: block; font-family: $font-family; font-weight: 600; @@ -40,7 +40,7 @@ limitations under the License. .mx_SettingsTab_subsectionText { color: $settings-subsection-fg-color; - font-size: 14px; + font-size: 0.933rem; display: block; margin: 10px 100px 10px 0; // Align with the rest of the view } @@ -61,7 +61,7 @@ limitations under the License. .mx_SettingsTab_section .mx_SettingsFlag .mx_SettingsFlag_label { vertical-align: middle; display: inline-block; - font-size: 14px; + font-size: 0.933rem; color: $primary-fg-color; max-width: calc(100% - 48px); // Force word wrap instead of colliding with the switch box-sizing: border-box; diff --git a/res/css/views/terms/_InlineTermsAgreement.scss b/res/css/views/terms/_InlineTermsAgreement.scss index e00dcf31d1..1f9ea7a33d 100644 --- a/res/css/views/terms/_InlineTermsAgreement.scss +++ b/res/css/views/terms/_InlineTermsAgreement.scss @@ -16,7 +16,7 @@ limitations under the License. .mx_InlineTermsAgreement_cbContainer { margin-bottom: 10px; - font-size: 14px; + font-size: 0.933rem; a { color: $accent-color; diff --git a/res/css/views/verification/_VerificationShowSas.scss b/res/css/views/verification/_VerificationShowSas.scss index 5038d40b73..fd83bf7ad4 100644 --- a/res/css/views/verification/_VerificationShowSas.scss +++ b/res/css/views/verification/_VerificationShowSas.scss @@ -48,14 +48,14 @@ limitations under the License. } .mx_VerificationShowSas_emojiSas_emoji { - font-size: 32px; + font-size: 2.133rem; } .mx_VerificationShowSas_emojiSas_label { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; - font-size: 12px; + font-size: 0.8rem; } .mx_VerificationShowSas_emojiSas_break { diff --git a/res/css/views/voip/_CallView.scss b/res/css/views/voip/_CallView.scss index b01fbf8c66..06c9f7bed6 100644 --- a/res/css/views/voip/_CallView.scss +++ b/res/css/views/voip/_CallView.scss @@ -21,5 +21,5 @@ limitations under the License. text-align: center; padding: 6px; font-weight: bold; - font-size: 13px; + font-size: 0.867rem; } diff --git a/res/css/views/voip/_IncomingCallbox.scss b/res/css/views/voip/_IncomingCallbox.scss index 64eac25d01..3c8ed46639 100644 --- a/res/css/views/voip/_IncomingCallbox.scss +++ b/res/css/views/voip/_IncomingCallbox.scss @@ -54,7 +54,7 @@ limitations under the License. vertical-align: middle; width: 80px; height: 36px; - line-height: 36px; + line-height: 2.400rem; border-radius: 36px; color: $accent-fg-color; margin: auto; diff --git a/res/themes/dark/css/_dark.scss b/res/themes/dark/css/_dark.scss index bfa2272283..1f11fd5620 100644 --- a/res/themes/dark/css/_dark.scss +++ b/res/themes/dark/css/_dark.scss @@ -185,7 +185,7 @@ $user-tile-hover-bg-color: $header-panel-bg-color; border: 0px; border-radius: 4px; font-family: $font-family; - font-size: 14px; + font-size: 0.933rem; color: $button-fg-color; background-color: $button-bg-color; width: auto; diff --git a/res/themes/light/css/_light.scss b/res/themes/light/css/_light.scss index 9bdd712e07..2a993a7934 100644 --- a/res/themes/light/css/_light.scss +++ b/res/themes/light/css/_light.scss @@ -310,7 +310,7 @@ $user-tile-hover-bg-color: $header-panel-bg-color; border: 0px; border-radius: 4px; font-family: $font-family; - font-size: 14px; + font-size: 0.933rem; color: $button-fg-color; background-color: $button-bg-color; width: auto; @@ -331,7 +331,7 @@ $user-tile-hover-bg-color: $header-panel-bg-color; @define-mixin mx_DialogButton_small { @mixin mx_DialogButton; - font-size: 15px; + font-size: 1rem; padding: 0px 1.5em 0px 1.5em; } From 147e7bc57ea5332fdf25129599773c3ed4e974fa Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Mon, 30 Mar 2020 18:42:47 +0100 Subject: [PATCH 0049/2751] Field: mark id as optional in propTypes Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/components/views/elements/Field.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/views/elements/Field.js b/src/components/views/elements/Field.js index 797c83bc06..2ebb90da26 100644 --- a/src/components/views/elements/Field.js +++ b/src/components/views/elements/Field.js @@ -32,7 +32,7 @@ function getId() { export default class Field extends React.PureComponent { static propTypes = { // The field's ID, which binds the input and label together. Immutable. - id: PropTypes.string.isRequired, + id: PropTypes.string, // The element to create. Defaults to "input". // To define options for a select, use element: PropTypes.oneOf(["input", "select", "textarea"]), From dd4331cd18ee048dd684bd879dd0ddc4a83e1f0a Mon Sep 17 00:00:00 2001 From: waylon531 Date: Sun, 29 Mar 2020 12:45:06 -0700 Subject: [PATCH 0050/2751] Added the /html command This command lets you send html messages through riot. This is incredibly useful for doing advanced formatting not supported by markdown and lets riot support even more html tags. Signed-off-by: Waylon Cude --- src/SlashCommands.js | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/src/SlashCommands.js b/src/SlashCommands.js index d306978f78..72ca4b1566 100644 --- a/src/SlashCommands.js +++ b/src/SlashCommands.js @@ -128,6 +128,15 @@ export const CommandMap = { }, category: CommandCategories.messages, }), + html: new Command({ + name: 'html', + args: '', + description: _td('Sends a message as html, without interpreting it as markdown'), + runFn: function(roomId, messages) { + return success(MatrixClientPeg.get().sendHtmlMessage(roomId, messages, messages)); + }, + category: CommandCategories.messages, + }), ddg: new Command({ name: 'ddg', args: '', From 9cf82d8743846efbaf1f40914cf24ffbbcb4f417 Mon Sep 17 00:00:00 2001 From: waylon531 Date: Sun, 29 Mar 2020 13:10:53 -0700 Subject: [PATCH 0051/2751] Updated strings I added a new string for the /html command and had to regerate strings for i18 Signed-off-by: Waylon Cude --- src/i18n/strings/en_EN.json | 1 + 1 file changed, 1 insertion(+) diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index a6e195aa16..3962899223 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -153,6 +153,7 @@ "Usage": "Usage", "Prepends ¯\\_(ツ)_/¯ to a plain-text message": "Prepends ¯\\_(ツ)_/¯ to a plain-text message", "Sends a message as plain text, without interpreting it as markdown": "Sends a message as plain text, without interpreting it as markdown", + "Sends a message as html, without interpreting it as markdown": "Sends a message as html, without interpreting it as markdown", "Searches DuckDuckGo for results": "Searches DuckDuckGo for results", "/ddg is not a command": "/ddg is not a command", "To use it, just wait for autocomplete results to load and tab through them.": "To use it, just wait for autocomplete results to load and tab through them.", From 690b5945d01134d8fd88672432a93befb03ce710 Mon Sep 17 00:00:00 2001 From: "J. Ryan Stinnett" Date: Mon, 30 Mar 2020 21:40:09 +0100 Subject: [PATCH 0052/2751] Pass new secret storage key to bootstrap path This passes the newly created secret storage key down to the bootstrap path for temporary caching to avoid prompting the user for it again in the later stages of bootstrapping. Fixes https://github.com/vector-im/riot-web/issues/12867 --- .../CreateSecretStorageDialog.js | 19 +++++++++++++++---- 1 file changed, 15 insertions(+), 4 deletions(-) diff --git a/src/async-components/views/dialogs/secretstorage/CreateSecretStorageDialog.js b/src/async-components/views/dialogs/secretstorage/CreateSecretStorageDialog.js index 78e750b817..1149f230ef 100644 --- a/src/async-components/views/dialogs/secretstorage/CreateSecretStorageDialog.js +++ b/src/async-components/views/dialogs/secretstorage/CreateSecretStorageDialog.js @@ -69,6 +69,7 @@ export default class CreateSecretStorageDialog extends React.PureComponent { this._keyInfo = null; this._encodedRecoveryKey = null; + this._recoveryKey = null; this._recoveryKeyNode = null; this._setZxcvbnResultTimeout = null; @@ -234,14 +235,22 @@ export default class CreateSecretStorageDialog extends React.PureComponent { if (force) { await cli.bootstrapSecretStorage({ authUploadDeviceSigningKeys: this._doBootstrapUIAuth, - createSecretStorageKey: async () => this._keyInfo, + createSecretStorageKey: async () => [ + this._keyInfo, + this._encodedRecoveryKey, + this._recoveryKey, + ], setupNewKeyBackup: true, setupNewSecretStorage: true, }); } else { await cli.bootstrapSecretStorage({ authUploadDeviceSigningKeys: this._doBootstrapUIAuth, - createSecretStorageKey: async () => this._keyInfo, + createSecretStorageKey: async () => [ + this._keyInfo, + this._encodedRecoveryKey, + this._recoveryKey, + ], keyBackupInfo: this.state.backupInfo, setupNewKeyBackup: !this.state.backupInfo && this.state.useKeyBackup, getKeyBackupPassphrase: promptForBackupPassphrase, @@ -299,10 +308,11 @@ export default class CreateSecretStorageDialog extends React.PureComponent { } _onSkipPassPhraseClick = async () => { - const [keyInfo, encodedRecoveryKey] = + const [keyInfo, encodedRecoveryKey, recoveryKey] = await MatrixClientPeg.get().createRecoveryKeyFromPassphrase(); this._keyInfo = keyInfo; this._encodedRecoveryKey = encodedRecoveryKey; + this._recoveryKey = recoveryKey; this.setState({ copied: false, downloaded: false, @@ -335,10 +345,11 @@ export default class CreateSecretStorageDialog extends React.PureComponent { if (this.state.passPhrase !== this.state.passPhraseConfirm) return; - const [keyInfo, encodedRecoveryKey] = + const [keyInfo, encodedRecoveryKey, recoveryKey] = await MatrixClientPeg.get().createRecoveryKeyFromPassphrase(this.state.passPhrase); this._keyInfo = keyInfo; this._encodedRecoveryKey = encodedRecoveryKey; + this._recoveryKey = recoveryKey; this.setState({ copied: false, downloaded: false, From bbb9a67ced8f431c0a7a91d76d387d55959a2169 Mon Sep 17 00:00:00 2001 From: Hubert Chathi Date: Mon, 30 Mar 2020 17:28:01 -0400 Subject: [PATCH 0053/2751] use new method for checking key --- src/CrossSigningManager.js | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/src/CrossSigningManager.js b/src/CrossSigningManager.js index 5c254bbd00..f6a4c914b7 100644 --- a/src/CrossSigningManager.js +++ b/src/CrossSigningManager.js @@ -96,11 +96,8 @@ async function getSecretStorageKey({ keys: keyInfos }, ssssItemName) { { keyInfo: info, checkPrivateKey: async (input) => { - if (!info.pubkey) { - return true; - } const key = await inputToKey(input); - return MatrixClientPeg.get().checkSecretStoragePrivateKey(key, info.pubkey); + return await MatrixClientPeg.get().checkSecretStorageKey(key, info); }, }, /* className= */ null, From ffa75ef48c47a0d75caeb1490bb1d4066ede2728 Mon Sep 17 00:00:00 2001 From: Travis Ralston Date: Mon, 30 Mar 2020 20:03:46 -0600 Subject: [PATCH 0054/2751] Wire up all the dialog parts for SSO, using device deletion as a POC --- .../auth/_InteractiveAuthEntryComponents.scss | 11 ++ res/css/views/elements/_AccessibleButton.scss | 17 ++- src/components/structures/InteractiveAuth.js | 29 ++++- .../auth/InteractiveAuthEntryComponents.js | 100 ++++++++++++++---- .../views/dialogs/InteractiveAuthDialog.js | 68 +++++++++++- src/components/views/settings/DevicesPanel.js | 19 ++++ src/i18n/strings/en_EN.json | 9 +- 7 files changed, 224 insertions(+), 29 deletions(-) diff --git a/res/css/views/auth/_InteractiveAuthEntryComponents.scss b/res/css/views/auth/_InteractiveAuthEntryComponents.scss index 85007aeecb..05cddf2c48 100644 --- a/res/css/views/auth/_InteractiveAuthEntryComponents.scss +++ b/res/css/views/auth/_InteractiveAuthEntryComponents.scss @@ -60,3 +60,14 @@ limitations under the License. .mx_InteractiveAuthEntryComponents_passwordSection { width: 300px; } + +.mx_InteractiveAuthEntryComponents_sso_buttons { + display: flex; + flex-direction: row; + justify-content: flex-end; + margin-top: 20px; + + .mx_AccessibleButton { + margin-left: 5px; + } +} diff --git a/res/css/views/elements/_AccessibleButton.scss b/res/css/views/elements/_AccessibleButton.scss index b87071745d..0c48a07ccf 100644 --- a/res/css/views/elements/_AccessibleButton.scss +++ b/res/css/views/elements/_AccessibleButton.scss @@ -36,6 +36,13 @@ limitations under the License. font-weight: 600; } +.mx_AccessibleButton_kind_primary_outline { + color: $button-primary-bg-color; + background-color: $button-secondary-bg-color; + border: 1px solid $button-primary-bg-color; + font-weight: 600; +} + .mx_AccessibleButton_kind_secondary { color: $accent-color; font-weight: 600; @@ -60,7 +67,15 @@ limitations under the License. background-color: $button-danger-bg-color; } -.mx_AccessibleButton_kind_danger.mx_AccessibleButton_disabled { +.mx_AccessibleButton_kind_danger_outline { + color: $button-danger-bg-color; + background-color: $button-secondary-bg-color; + border: 1px solid $button-danger-bg-color; +} + +.mx_AccessibleButton_kind_danger.mx_AccessibleButton_disabled, +mx_AccessibleButton_kind_danger_outline.mx_AccessibleButton_disabled +{ color: $button-danger-disabled-fg-color; background-color: $button-danger-disabled-bg-color; } diff --git a/src/components/structures/InteractiveAuth.js b/src/components/structures/InteractiveAuth.js index f4adb5751f..2492bf79a0 100644 --- a/src/components/structures/InteractiveAuth.js +++ b/src/components/structures/InteractiveAuth.js @@ -1,6 +1,6 @@ /* Copyright 2017 Vector Creations Ltd. -Copyright 2019 The Matrix.org Foundation C.I.C. +Copyright 2019, 2020 The Matrix.org Foundation C.I.C. Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. @@ -24,6 +24,8 @@ import getEntryComponentForLoginType from '../views/auth/InteractiveAuthEntryCom import * as sdk from '../../index'; +export const ERROR_USER_CANCELLED = new Error("User cancelled auth session"); + export default createReactClass({ displayName: 'InteractiveAuth', @@ -47,7 +49,7 @@ export default createReactClass({ // @param {bool} status True if the operation requiring // auth was completed sucessfully, false if canceled. // @param {object} result The result of the authenticated call - // if successful, otherwise the error object + // if successful, otherwise the error object. // @param {object} extra Additional information about the UI Auth // process: // * emailSid {string} If email auth was performed, the sid of @@ -75,6 +77,15 @@ export default createReactClass({ // is managed by some other party and should not be managed by // the component itself. continueIsManaged: PropTypes.bool, + + // Called when the stage changes, or the stage's phase changes. First + // argument is the stage, second is the phase. Some stages do not have + // phases and will be counted as 0 (numeric). + onStagePhaseChange: PropTypes.func, + + // continueText and continueKind are passed straight through to the AuthEntryComponent. + continueText: PropTypes.string, + continueKind: PropTypes.string, }, getInitialState: function() { @@ -204,6 +215,16 @@ export default createReactClass({ this._authLogic.submitAuthDict(authData); }, + _onPhaseChange: function(newPhase) { + if (this.props.onStagePhaseChange) { + this.props.onStagePhaseChange(this.state.authStage, newPhase || 0); + } + }, + + _onStageCancel: function() { + this.props.onAuthFinished(false, ERROR_USER_CANCELLED); + }, + _renderCurrentStage: function() { const stage = this.state.authStage; if (!stage) { @@ -232,6 +253,10 @@ export default createReactClass({ fail={this._onAuthStageFailed} setEmailSid={this._setEmailSid} showContinue={!this.props.continueIsManaged} + onPhaseChange={this._onPhaseChange} + continueText={this.props.continueText} + continueKind={this.props.continueKind} + onCancel={this._onStageCancel} /> ); }, diff --git a/src/components/views/auth/InteractiveAuthEntryComponents.js b/src/components/views/auth/InteractiveAuthEntryComponents.js index 26a293724a..d262a5525d 100644 --- a/src/components/views/auth/InteractiveAuthEntryComponents.js +++ b/src/components/views/auth/InteractiveAuthEntryComponents.js @@ -25,6 +25,7 @@ import classnames from 'classnames'; import * as sdk from '../../../index'; import { _t } from '../../../languageHandler'; import SettingsStore from "../../../settings/SettingsStore"; +import AccessibleButton from "../elements/AccessibleButton"; /* This file contains a collection of components which are used by the * InteractiveAuth to prompt the user to enter the information needed @@ -59,11 +60,21 @@ import SettingsStore from "../../../settings/SettingsStore"; * session to be failed and the process to go back to the start. * setEmailSid: m.login.email.identity only: a function to be called with the * email sid after a token is requested. + * onPhaseChange: A function which is called when the stage's phase changes. If + * the stage has no phases, call this with DEFAULT_PHASE. Takes + * one argument, the phase, and is always defined/required. + * continueText: For stages which have a continue button, the text to use. + * continueKind: For stages which have a continue button, the style of button to + * use. For example, 'danger' or 'primary'. + * onCancel A function with no arguments which is called by the stage if the + * user knowingly cancelled/dismissed the authentication attempt. * * Each component may also provide the following functions (beyond the standard React ones): * focus: set the input focus appropriately in the form. */ +export const DEFAULT_PHASE = 0; + export const PasswordAuthEntry = createReactClass({ displayName: 'PasswordAuthEntry', @@ -78,6 +89,11 @@ export const PasswordAuthEntry = createReactClass({ // is the auth logic currently waiting for something to // happen? busy: PropTypes.bool, + onPhaseChange: PropTypes.func.isRequired, + }, + + componentDidMount: function() { + this.props.onPhaseChange(DEFAULT_PHASE); }, getInitialState: function() { @@ -175,6 +191,11 @@ export const RecaptchaAuthEntry = createReactClass({ stageParams: PropTypes.object.isRequired, errorText: PropTypes.string, busy: PropTypes.bool, + onPhaseChange: PropTypes.func.isRequired, + }, + + componentDidMount: function() { + this.props.onPhaseChange(DEFAULT_PHASE); }, _onCaptchaResponse: function(response) { @@ -236,6 +257,11 @@ export const TermsAuthEntry = createReactClass({ errorText: PropTypes.string, busy: PropTypes.bool, showContinue: PropTypes.bool, + onPhaseChange: PropTypes.func.isRequired, + }, + + componentDidMount: function() { + this.props.onPhaseChange(DEFAULT_PHASE); }, componentWillMount: function() { @@ -378,6 +404,11 @@ export const EmailIdentityAuthEntry = createReactClass({ stageState: PropTypes.object.isRequired, fail: PropTypes.func.isRequired, setEmailSid: PropTypes.func.isRequired, + onPhaseChange: PropTypes.func.isRequired, + }, + + componentDidMount: function() { + this.props.onPhaseChange(DEFAULT_PHASE); }, getInitialState: function() { @@ -420,6 +451,11 @@ export const MsisdnAuthEntry = createReactClass({ clientSecret: PropTypes.func, submitAuthDict: PropTypes.func.isRequired, matrixClient: PropTypes.object, + onPhaseChange: PropTypes.func.isRequired, + }, + + componentDidMount: function() { + this.props.onPhaseChange(DEFAULT_PHASE); }, getInitialState: function() { @@ -571,13 +607,17 @@ export class SSOAuthEntry extends React.Component { loginType: PropTypes.string.isRequired, submitAuthDict: PropTypes.func.isRequired, errorText: PropTypes.string, + onPhaseChange: PropTypes.func.isRequired, + continueText: PropTypes.string, + continueKind: PropTypes.string, + onCancel: PropTypes.func, }; static LOGIN_TYPE = "m.login.sso"; static UNSTABLE_LOGIN_TYPE = "org.matrix.login.sso"; - static STAGE_PREAUTH = 1; // button to start SSO - static STAGE_POSTAUTH = 2; // button to confirm SSO completed + static PHASE_PREAUTH = 1; // button to start SSO + static PHASE_POSTAUTH = 2; // button to confirm SSO completed constructor(props) { super(props); @@ -589,39 +629,56 @@ export class SSOAuthEntry extends React.Component { this.props.loginType, this.props.authSessionId, ), - stage: SSOAuthEntry.STAGE_PREAUTH, + phase: SSOAuthEntry.PHASE_PREAUTH, }; } - onStartAuthClick = (e) => { - e.preventDefault(); - e.stopPropagation(); + componentDidMount(): void { + this.props.onPhaseChange(SSOAuthEntry.PHASE_PREAUTH); + } + onStartAuthClick = () => { // Note: We don't use PlatformPeg's startSsoAuth functions because we almost // certainly will need to open the thing in a new tab to avoid loosing application // context. - window.open(e.target.href, '_blank'); - this.setState({stage: SSOAuthEntry.STAGE_POSTAUTH}); + window.open(this.state.ssoUrl, '_blank'); + this.setState({phase: SSOAuthEntry.PHASE_POSTAUTH}); + this.props.onPhaseChange(SSOAuthEntry.PHASE_POSTAUTH); }; - onConfirmClick = (e) => { - e.preventDefault(); - e.stopPropagation(); - + onConfirmClick = () => { this.props.submitAuthDict({}); }; render () { - if (this.state.stage === SSOAuthEntry.STAGE_PREAUTH) { - return - {_t("Single Sign On")} - ; + let continueButton = null; + const cancelButton = ( + {_t("Cancel")} + ); + if (this.state.phase === SSOAuthEntry.PHASE_PREAUTH) { + continueButton = ( + {this.props.continueText || _t("Single Sign On")} + ); } else { - return - {_t("Continue")} - ; + continueButton = ( + {this.props.continueText || _t("Confirm")} + ); } + + return
+ {cancelButton} + {continueButton} +
; } } @@ -634,6 +691,11 @@ export const FallbackAuthEntry = createReactClass({ loginType: PropTypes.string.isRequired, submitAuthDict: PropTypes.func.isRequired, errorText: PropTypes.string, + onPhaseChange: PropTypes.func.isRequired, + }, + + componentDidMount: function() { + this.props.onPhaseChange(DEFAULT_PHASE); }, componentWillMount: function() { diff --git a/src/components/views/dialogs/InteractiveAuthDialog.js b/src/components/views/dialogs/InteractiveAuthDialog.js index ff9f55cb74..c070cc6589 100644 --- a/src/components/views/dialogs/InteractiveAuthDialog.js +++ b/src/components/views/dialogs/InteractiveAuthDialog.js @@ -1,6 +1,7 @@ /* Copyright 2016 OpenMarket Ltd Copyright 2017 Vector Creations Ltd +Copyright 2020 The Matrix.org Foundation C.I.C. Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. @@ -23,6 +24,7 @@ import * as sdk from '../../../index'; import { _t } from '../../../languageHandler'; import AccessibleButton from '../elements/AccessibleButton'; +import {ERROR_USER_CANCELLED} from "../../structures/InteractiveAuth"; export default createReactClass({ displayName: 'InteractiveAuthDialog', @@ -44,12 +46,36 @@ export default createReactClass({ onFinished: PropTypes.func.isRequired, + // Optional title and body to show when not showing a particular stage title: PropTypes.string, + body: PropTypes.string, + + // Optional title and body pairs for particular stages and phases within + // those stages. Object structure/example is: + // { + // "org.example.stage_type": { + // 1: { + // "body": "This is a body for phase 1" of org.example.stage_type, + // "title": "Title for phase 1 of org.example.stage_type" + // }, + // 2: { + // "body": "This is a body for phase 2 of org.example.stage_type", + // "title": "Title for phase 2 of org.example.stage_type" + // "continueText": "Confirm identity with Example Auth", + // "continueKind": "danger" + // } + // } + // } + aestheticsForStagePhases: PropTypes.object, }, getInitialState: function() { return { authError: null, + + // See _onUpdateStagePhase() + uiaStage: null, + uiaStagePhase: null, }; }, @@ -57,12 +83,22 @@ export default createReactClass({ if (success) { this.props.onFinished(true, result); } else { - this.setState({ - authError: result, - }); + if (result === ERROR_USER_CANCELLED) { + this.props.onFinished(false, null); + } else { + this.setState({ + authError: result, + }); + } } }, + _onUpdateStagePhase: function(newStage, newPhase) { + console.log({newStage, newPhase}); + // We copy the stage and stage phase params into state for title selection in render() + this.setState({uiaStage: newStage, uiaStagePhase: newPhase}); + }, + _onDismissClick: function() { this.props.onFinished(false); }, @@ -71,6 +107,23 @@ export default createReactClass({ const InteractiveAuth = sdk.getComponent("structures.InteractiveAuth"); const BaseDialog = sdk.getComponent('views.dialogs.BaseDialog'); + // Let's pick a title, body, and other params text that we'll show to the user. The order + // is most specific first, so stagePhase > our props > defaults. + + let title = this.state.authError ? 'Error' : (this.props.title || _t('Authentication')); + let body = this.state.authError ? null : this.props.body; + let continueText = null; + let continueKind = null; + if (!this.state.authError && this.props.aestheticsForStagePhases) { + if (this.props.aestheticsForStagePhases[this.state.uiaStage]) { + const aesthetics = this.props.aestheticsForStagePhases[this.state.uiaStage][this.state.uiaStagePhase]; + if (aesthetics && aesthetics.title) title = aesthetics.title; + if (aesthetics && aesthetics.body) body = aesthetics.body; + if (aesthetics && aesthetics.continueText) continueText = aesthetics.continueText; + if (aesthetics && aesthetics.continueKind) continueKind = aesthetics.continueKind; + } + } + let content; if (this.state.authError) { content = ( @@ -88,11 +141,16 @@ export default createReactClass({ } else { content = (
-
); @@ -101,7 +159,7 @@ export default createReactClass({ return ( { content } diff --git a/src/components/views/settings/DevicesPanel.js b/src/components/views/settings/DevicesPanel.js index 2120801a81..61e7724a6f 100644 --- a/src/components/views/settings/DevicesPanel.js +++ b/src/components/views/settings/DevicesPanel.js @@ -23,6 +23,7 @@ import * as sdk from '../../../index'; import {MatrixClientPeg} from '../../../MatrixClientPeg'; import { _t } from '../../../languageHandler'; import Modal from '../../../Modal'; +import {SSOAuthEntry} from "../auth/InteractiveAuthEntryComponents"; export default class DevicesPanel extends React.Component { constructor(props) { @@ -123,11 +124,29 @@ export default class DevicesPanel extends React.Component { // pop up an interactive auth dialog const InteractiveAuthDialog = sdk.getComponent("dialogs.InteractiveAuthDialog"); + const dialogAesthetics = { + [SSOAuthEntry.PHASE_PREAUTH]: { + title: _t("Use Single Sign On to continue"), + body: _t("Confirm deleting these sessions by using Single Sign On to prove your identity."), + continueText: _t("Single Sign On"), + continueKind: "primary", + }, + [SSOAuthEntry.PHASE_POSTAUTH]: { + title: _t("Confirm deleting these sessions"), + body: _t("Click the button below to confirm deleting these sessions."), + continueText: _t("Delete sessions"), + continueKind: "danger", + }, + }; Modal.createTrackedDialog('Delete Device Dialog', '', InteractiveAuthDialog, { title: _t("Authentication"), matrixClient: MatrixClientPeg.get(), authData: error.data, makeRequest: this._makeDeleteRequest.bind(this), + aestheticsForStagePhases: { + [SSOAuthEntry.LOGIN_TYPE]: dialogAesthetics, + [SSOAuthEntry.UNSTABLE_LOGIN_TYPE]: dialogAesthetics, + }, }); }).catch((e) => { console.error("Error deleting sessions", e); diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index e867623cc9..ecc2698f6d 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -598,6 +598,12 @@ "up to date": "up to date", "Your homeserver does not support session management.": "Your homeserver does not support session management.", "Unable to load session list": "Unable to load session list", + "Use Single Sign On to continue": "Use Single Sign On to continue", + "Confirm deleting these sessions by using Single Sign On to prove your identity.": "Confirm deleting these sessions by using Single Sign On to prove your identity.", + "Single Sign On": "Single Sign On", + "Confirm deleting these sessions": "Confirm deleting these sessions", + "Click the button below to confirm deleting these sessions.": "Click the button below to confirm deleting these sessions.", + "Delete sessions": "Delete sessions", "Authentication": "Authentication", "Delete %(count)s sessions|other": "Delete %(count)s sessions", "Delete %(count)s sessions|one": "Delete %(count)s session", @@ -1831,7 +1837,7 @@ "Please enter the code it contains:": "Please enter the code it contains:", "Code": "Code", "Submit": "Submit", - "Single Sign On": "Single Sign On", + "Confirm": "Confirm", "Start authentication": "Start authentication", "Unable to validate homeserver/identity server": "Unable to validate homeserver/identity server", "Your Modular server": "Your Modular server", @@ -1862,7 +1868,6 @@ "Use lowercase letters, numbers, dashes and underscores only": "Use lowercase letters, numbers, dashes and underscores only", "Enter username": "Enter username", "Email (optional)": "Email (optional)", - "Confirm": "Confirm", "Phone (optional)": "Phone (optional)", "Create your Matrix account on %(serverName)s": "Create your Matrix account on %(serverName)s", "Create your Matrix account on ": "Create your Matrix account on ", From 6112d92f809c952fe80520a93b0f98d0993057d3 Mon Sep 17 00:00:00 2001 From: Travis Ralston Date: Mon, 30 Mar 2020 20:11:23 -0600 Subject: [PATCH 0055/2751] Remove debugging --- src/components/views/dialogs/InteractiveAuthDialog.js | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/views/dialogs/InteractiveAuthDialog.js b/src/components/views/dialogs/InteractiveAuthDialog.js index c070cc6589..af5dc5108c 100644 --- a/src/components/views/dialogs/InteractiveAuthDialog.js +++ b/src/components/views/dialogs/InteractiveAuthDialog.js @@ -94,7 +94,6 @@ export default createReactClass({ }, _onUpdateStagePhase: function(newStage, newPhase) { - console.log({newStage, newPhase}); // We copy the stage and stage phase params into state for title selection in render() this.setState({uiaStage: newStage, uiaStagePhase: newPhase}); }, From de7952015086e8e5d3bab204fd23665def9435c2 Mon Sep 17 00:00:00 2001 From: Travis Ralston Date: Mon, 30 Mar 2020 20:18:52 -0600 Subject: [PATCH 0056/2751] Add SSO dialog copy for 3PID adding (email/phone) --- src/AddThreepid.js | 38 +++++++++++++++++++++++++++++++++++++ src/i18n/strings/en_EN.json | 12 +++++++++--- 2 files changed, 47 insertions(+), 3 deletions(-) diff --git a/src/AddThreepid.js b/src/AddThreepid.js index 7a3250d0ca..1fc492ef85 100644 --- a/src/AddThreepid.js +++ b/src/AddThreepid.js @@ -21,6 +21,7 @@ import * as sdk from './index'; import Modal from './Modal'; import { _t } from './languageHandler'; import IdentityAuthClient from './IdentityAuthClient'; +import {SSOAuthEntry} from "./components/views/auth/InteractiveAuthEntryComponents"; function getIdServerDomain() { return MatrixClientPeg.get().idBaseUrl.split("://")[1]; @@ -188,11 +189,30 @@ export default class AddThreepid { // pop up an interactive auth dialog const InteractiveAuthDialog = sdk.getComponent("dialogs.InteractiveAuthDialog"); + + const dialogAesthetics = { + [SSOAuthEntry.PHASE_PREAUTH]: { + title: _t("Use Single Sign On to continue"), + body: _t("Confirm adding this email address by using Single Sign On to prove your identity."), + continueText: _t("Single Sign On"), + continueKind: "primary", + }, + [SSOAuthEntry.PHASE_POSTAUTH]: { + title: _t("Confirm adding email"), + body: _t("Click the button below to confirm adding this email address."), + continueText: _t("Confirm"), + continueKind: "primary", + }, + }; const { finished } = Modal.createTrackedDialog('Add Email', '', InteractiveAuthDialog, { title: _t("Add Email Address"), matrixClient: MatrixClientPeg.get(), authData: e.data, makeRequest: this._makeAddThreepidOnlyRequest, + aestheticsForStagePhases: { + [SSOAuthEntry.LOGIN_TYPE]: dialogAesthetics, + [SSOAuthEntry.UNSTABLE_LOGIN_TYPE]: dialogAesthetics, + }, }); return finished; } @@ -285,11 +305,29 @@ export default class AddThreepid { // pop up an interactive auth dialog const InteractiveAuthDialog = sdk.getComponent("dialogs.InteractiveAuthDialog"); + const dialogAesthetics = { + [SSOAuthEntry.PHASE_PREAUTH]: { + title: _t("Use Single Sign On to continue"), + body: _t("Confirm adding this phone number by using Single Sign On to prove your identity."), + continueText: _t("Single Sign On"), + continueKind: "primary", + }, + [SSOAuthEntry.PHASE_POSTAUTH]: { + title: _t("Confirm adding phone number"), + body: _t("Click the button below to confirm adding this phone number."), + continueText: _t("Confirm"), + continueKind: "primary", + }, + }; const { finished } = Modal.createTrackedDialog('Add MSISDN', '', InteractiveAuthDialog, { title: _t("Add Phone Number"), matrixClient: MatrixClientPeg.get(), authData: e.data, makeRequest: this._makeAddThreepidOnlyRequest, + aestheticsForStagePhases: { + [SSOAuthEntry.LOGIN_TYPE]: dialogAesthetics, + [SSOAuthEntry.UNSTABLE_LOGIN_TYPE]: dialogAesthetics, + }, }); return finished; } diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index ecc2698f6d..572268f90d 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -1,8 +1,17 @@ { "This email address is already in use": "This email address is already in use", "This phone number is already in use": "This phone number is already in use", + "Use Single Sign On to continue": "Use Single Sign On to continue", + "Confirm adding this email address by using Single Sign On to prove your identity.": "Confirm adding this email address by using Single Sign On to prove your identity.", + "Single Sign On": "Single Sign On", + "Confirm adding email": "Confirm adding email", + "Click the button below to confirm adding this email address.": "Click the button below to confirm adding this email address.", + "Confirm": "Confirm", "Add Email Address": "Add Email Address", "Failed to verify email address: make sure you clicked the link in the email": "Failed to verify email address: make sure you clicked the link in the email", + "Confirm adding this phone number by using Single Sign On to prove your identity.": "Confirm adding this phone number by using Single Sign On to prove your identity.", + "Confirm adding phone number": "Confirm adding phone number", + "Click the button below to confirm adding this phone number.": "Click the button below to confirm adding this phone number.", "Add Phone Number": "Add Phone Number", "The platform you're on": "The platform you're on", "The version of Riot": "The version of Riot", @@ -598,9 +607,7 @@ "up to date": "up to date", "Your homeserver does not support session management.": "Your homeserver does not support session management.", "Unable to load session list": "Unable to load session list", - "Use Single Sign On to continue": "Use Single Sign On to continue", "Confirm deleting these sessions by using Single Sign On to prove your identity.": "Confirm deleting these sessions by using Single Sign On to prove your identity.", - "Single Sign On": "Single Sign On", "Confirm deleting these sessions": "Confirm deleting these sessions", "Click the button below to confirm deleting these sessions.": "Click the button below to confirm deleting these sessions.", "Delete sessions": "Delete sessions", @@ -1837,7 +1844,6 @@ "Please enter the code it contains:": "Please enter the code it contains:", "Code": "Code", "Submit": "Submit", - "Confirm": "Confirm", "Start authentication": "Start authentication", "Unable to validate homeserver/identity server": "Unable to validate homeserver/identity server", "Your Modular server": "Your Modular server", From 8bc86deaaaf93928c722a077bd17ece980a0821d Mon Sep 17 00:00:00 2001 From: Travis Ralston Date: Mon, 30 Mar 2020 20:23:34 -0600 Subject: [PATCH 0057/2751] Appease the style linter --- res/css/views/elements/_AccessibleButton.scss | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/res/css/views/elements/_AccessibleButton.scss b/res/css/views/elements/_AccessibleButton.scss index 0c48a07ccf..de39525588 100644 --- a/res/css/views/elements/_AccessibleButton.scss +++ b/res/css/views/elements/_AccessibleButton.scss @@ -48,7 +48,8 @@ limitations under the License. font-weight: 600; } -.mx_AccessibleButton_kind_primary.mx_AccessibleButton_disabled { +.mx_AccessibleButton_kind_primary.mx_AccessibleButton_disabled, +.mx_AccessibleButton_kind_primary_outline.mx_AccessibleButton_disabled { opacity: 0.4; } @@ -74,8 +75,7 @@ limitations under the License. } .mx_AccessibleButton_kind_danger.mx_AccessibleButton_disabled, -mx_AccessibleButton_kind_danger_outline.mx_AccessibleButton_disabled -{ +.mx_AccessibleButton_kind_danger_outline.mx_AccessibleButton_disabled { color: $button-danger-disabled-fg-color; background-color: $button-danger-disabled-bg-color; } From d899576578b6b2bfc66ceef7a8b13c857c8857f3 Mon Sep 17 00:00:00 2001 From: Travis Ralston Date: Mon, 30 Mar 2020 20:24:53 -0600 Subject: [PATCH 0058/2751] Appease the linter --- src/AddThreepid.js | 6 ++++-- src/components/views/auth/InteractiveAuthEntryComponents.js | 2 +- 2 files changed, 5 insertions(+), 3 deletions(-) diff --git a/src/AddThreepid.js b/src/AddThreepid.js index 1fc492ef85..f06f7c187d 100644 --- a/src/AddThreepid.js +++ b/src/AddThreepid.js @@ -193,7 +193,8 @@ export default class AddThreepid { const dialogAesthetics = { [SSOAuthEntry.PHASE_PREAUTH]: { title: _t("Use Single Sign On to continue"), - body: _t("Confirm adding this email address by using Single Sign On to prove your identity."), + body: _t("Confirm adding this email address by using " + + "Single Sign On to prove your identity."), continueText: _t("Single Sign On"), continueKind: "primary", }, @@ -308,7 +309,8 @@ export default class AddThreepid { const dialogAesthetics = { [SSOAuthEntry.PHASE_PREAUTH]: { title: _t("Use Single Sign On to continue"), - body: _t("Confirm adding this phone number by using Single Sign On to prove your identity."), + body: _t("Confirm adding this phone number by using " + + "Single Sign On to prove your identity."), continueText: _t("Single Sign On"), continueKind: "primary", }, diff --git a/src/components/views/auth/InteractiveAuthEntryComponents.js b/src/components/views/auth/InteractiveAuthEntryComponents.js index d262a5525d..a59b1354b6 100644 --- a/src/components/views/auth/InteractiveAuthEntryComponents.js +++ b/src/components/views/auth/InteractiveAuthEntryComponents.js @@ -651,7 +651,7 @@ export class SSOAuthEntry extends React.Component { this.props.submitAuthDict({}); }; - render () { + render() { let continueButton = null; const cancelButton = ( Date: Mon, 30 Mar 2020 19:05:47 +0000 Subject: [PATCH 0059/2751] Translated using Weblate (German) Currently translated at 77.2% (1730 of 2242 strings) Translation: Riot Web/matrix-react-sdk Translate-URL: https://translate.riot.im/projects/riot-web/matrix-react-sdk/de/ --- src/i18n/strings/de_DE.json | 58 +++++++++++++++++++++++++++++++++---- 1 file changed, 52 insertions(+), 6 deletions(-) diff --git a/src/i18n/strings/de_DE.json b/src/i18n/strings/de_DE.json index 9565299b8d..a808ebd33c 100644 --- a/src/i18n/strings/de_DE.json +++ b/src/i18n/strings/de_DE.json @@ -1526,7 +1526,7 @@ "Use an Integration Manager to manage bots, widgets, and sticker packs.": "Verwende einen Integrationsmanager um Bots, Widgets und Sticker Packs zu verwalten.", "Manage integrations": "Integrationen verwalten", "Agree to the identity server (%(serverName)s) Terms of Service to allow yourself to be discoverable by email address or phone number.": "Stimme den Nutzungsbedingungen des Identitätsservers %(serverName)s zu, um dich per Email Adresse und Telefonnummer auffindbar zu machen.", - "Clear cache and reload": "Cache löschen und neu laden", + "Clear cache and reload": "Zwischenspeicher löschen und neu laden", "Customise your experience with experimental labs features. Learn more.": "Passe deine Erfahrung mit experimentellen Lab Funktionen an. Mehr erfahren.", "Ignored/Blocked": "Ignoriert/Blockiert", "Something went wrong. Please try again or view your console for hints.": "Etwas ist schief gelaufen. Bitte versuche es erneut oder sieh für weitere Hinweise in deiner Konsole nach.", @@ -1571,9 +1571,9 @@ "Notification sound": "Benachrichtigungston", "Set a new custom sound": "Setze einen neuen benutzerdefinierten Sound", "Browse": "Durchsuche", - "Direct Messages": "Direkte Nachrichten", + "Direct Messages": "Direktnachrichten", "You can use /help to list available commands. Did you mean to send this as a message?": "Sie können /help benutzen, um verfügbare Befehle aufzulisten. Wollten Sie dies als Nachricht senden?", - "Direct message": "Direkte Nachricht", + "Direct message": "Direktnachricht", "Set a room alias to easily share your room with other people.": "Setze ein Raum-Alias, um deinen Raum einfach mit anderen Personen zu teilen.", "Suggestions": "Vorschläge", "Recently Direct Messaged": "Kürzlich direkt verschickt", @@ -1625,7 +1625,7 @@ "Create a private room": "Erstelle einen privaten Raum", "Topic (optional)": "Thema (optional)", "Make this room public": "Machen Sie diesen Raum öffentlich", - "Hide advanced": "Fortgeschrittenes ausblenden", + "Hide advanced": "Weitere Einstellungen ausblenden", "Block users on other matrix homeservers from joining this room (This setting cannot be changed later!)": "Hindere Benutzer auf anderen Matrix-Homeservern daran, diesem Raum beizutreten (Diese Einstellung kann später nicht geändert werden!)", "Session name": "Name der Sitzung", "This will allow you to return to your account after signing out, and sign in on other sessions.": "So können Sie nach der Abmeldung zu Ihrem Konto zurückkehren und sich bei anderen Sitzungen anmelden.", @@ -1657,7 +1657,7 @@ "or": "oder", "Compare unique emoji": "Vergleiche einzigartige Emojis", "Start": "Starte", - "Discovery": "Entdeckung", + "Discovery": "Kontakte", "Done": "Erledigt", "Manually Verify": "Manuell verifizieren", "Trusted": "Vertrauenswürdig", @@ -1739,5 +1739,51 @@ "Start chatting": "Chat starten", "Reject & Ignore user": "Ablehnen & Nutzer ignorieren", "%(senderName)s changed a rule that was banning users matching %(oldGlob)s to matching %(newGlob)s for %(reason)s": "%(senderName)s ändert eine Ausschluss-Regel von %(oldGlob)s nach %(newGlob)s, wegen %(reason)s", - "%(senderName)s changed a rule that was banning rooms matching %(oldGlob)s to matching %(newGlob)s for %(reason)s": "%(senderName)s ändert eine Ausschluss-Regel für Räume von %(oldGlob)s nach %(newGlob)s, wegen %(reason)s" + "%(senderName)s changed a rule that was banning rooms matching %(oldGlob)s to matching %(newGlob)s for %(reason)s": "%(senderName)s ändert eine Ausschluss-Regel für Räume von %(oldGlob)s nach %(newGlob)s, wegen %(reason)s", + "Allow fallback call assist server turn.matrix.org when your homeserver does not offer one (your IP address would be shared during a call)": "Erlaube den Standard-Server zur Anrufunterstützung (turn.matrix.org) zu verwenden wenn dein Heimserver keinen eigenen anbietet (deine IP Adresse wird bei dem Anruf übermittelt)", + "Show more": "mehr", + "This session is not backing up your keys, but you do have an existing backup you can restore from and add to going forward.": "Diese Sitzung speichert deine Schlüssel nicht, du kannst sie aber an die Schlüsselsicherung anschließen.", + "Connect this session to key backup before signing out to avoid losing any keys that may only be on this session.": "Verbinde diese Sitzung mit deiner Schlüsselsicherung bevor du dich abmeldest, um den Verlust von Schlüsseln zu vermeiden.", + "This backup is trusted because it has been restored on this session": "Dieser Sicherung wird vertraut, da sie während dieser Sitzung wiederhergestellt wurde", + "Enable desktop notifications for this session": "Desktop-Benachrichtigungen für diese Sitzung aktivieren", + "Enable audible notifications for this session": "Aktiviere die akustischen Benachrichtigungen für diese Sitzung", + "Integration Managers receive configuration data, and can modify widgets, send room invites, and set power levels on your behalf.": "Integrationsserver können für dich Widgets einstellen, Raum-Einladungen verschicken oder deine Berechtigungen setzen.", + "Read Marker lifetime (ms)": "Gültigkeitsdauer der Gelesen-Markierung (ms)", + "Read Marker off-screen lifetime (ms)": "Gültigkeitsdauer der Gelesen-Markierung außerhalb des Bildschirms (ms)", + "Session key:": "Sitzungsschlüssel:", + "A session's public name is visible to people you communicate with": "Der Sitzungsname ist sichtbar für die Personen mit denen du kommunizierst", + "Sounds": "Töne", + "Upgrade the room": "Raum hochstufen", + "Enable room encryption": "Verschlüsselung aktivieren", + "This message cannot be decrypted": "Diese Nachricht konnte nicht entschlüsselt werden", + "Encrypted by an unverified session": "Verschlüsselt von einer unbekannten Sitzung", + "Unencrypted": "Unverschlüsselt", + "Encrypted by a deleted session": "Verschlüsselt von einer gelöschten Sitzung", + "The encryption used by this room isn't supported.": "Die Verschlüsselung, die dieser Raum verwendet, wird nicht unterstützt.", + "React": "Reaktion hinzufügen", + "e.g. my-room": "z.B. mein-raum", + "Use an identity server to invite by email. Use the default (%(defaultIdentityServerName)s) or manage in Settings.": "Verwende einen Identitätsserver um mit einer E-Mail-Adresse einzuladen. Benutzer den Standard-Identitätsserver (%(defaultIdentityServerName)s) oder konfiguriere einen in den Einstellungen.", + "Use an identity server to invite by email. Manage in Settings.": "Verwende einen Identitätsserver um mit einer E-Mail-Adresse einzuladen. Diese können in den Einstellungen konfiguriert werden.", + "Create a public room": "Erstelle einen öffentlichen Raum", + "Show advanced": "Weitere Einstellungen anzeigen", + "Verify session": "Sitzung verifizieren", + "To verify that this session can be trusted, please contact its owner using some other means (e.g. in person or a phone call) and ask them whether the key they see in their User Settings for this session matches the key below:": "Um diese Sitzung zu verifizieren kontaktiere bitte den Benutzer über einen anderen Kanal (z.B. persönlich oder mit einem Telefonanruf) und frage ihn ob der Sitzungsschlüssel in seinen Benutzereinstellungen mit dem hier angezeigten übereinstimmt:", + "Session key": "Sitzungsschlüssel", + "If it matches, press the verify button below. If it doesn't, then someone else is intercepting this session and you probably want to press the blacklist button instead.": "Wenn die Sitzungsschlüssel übereinstimmen, drücke den Knopf zur Bestätigung. Stimmen sie nicht überein versucht jemand diese Sitzung abzufangen und du solltest diese Sitzung blockieren.", + "Recent Conversations": "Letzte Unterhaltungen", + "Report Content to Your Homeserver Administrator": "Inhalte an den Administrator deines Heimservers melden", + "Reporting this message will send its unique 'event ID' to the administrator of your homeserver. If messages in this room are encrypted, your homeserver administrator will not be able to read the message text or view any files or images.": "Wenn du diese Nachricht meldest wird dessen einzigartige 'event ID' an den Administrator deines Heimservers übermittelt. Wenn die Nachrichten in diesem Raum verschlüsselt sind wird dein Administrator nicht in der Lage sein den Text zu lesen oder Medien einzusehen.", + "Send report": "Bericht senden", + "Enter recovery passphrase": "Gib die Wiederherstellungspassphrase ein", + "Enter recovery key": "Wiederherstellungspassphrase eingeben", + "Report Content": "Inhalte melden", + "Set an email for account recovery. Use email to optionally be discoverable by existing contacts.": "Gib eine E-Mail-Adresse an um dein Konto wiederherstellen zu können. Die E-Mail-Adresse kann auch genutzt werden um deinen Kontakt zu finden.", + "Enter your custom homeserver URL What does this mean?": "Gib eine andere Heimserver-Adresse an Was bedeutet das?", + "%(creator)s created and configured the room.": "%(creator)s hat den Raum erstellt und konfiguriert.", + "Sender session information": "Absender Sitzungsinformationen", + "Set up with a recovery key": "Mit einem Wiederherstellungsschlüssel einrichten", + "Keep a copy of it somewhere secure, like a password manager or even a safe.": "Bewahre ihn sicher auf, wie in einem Passwort-Manager oder einem Safe.", + "Your recovery key": "Dein Wiederherstellungsschlüssel", + "Copy": "In Zwischenablage kopieren", + "Make a copy of your recovery key": "Speichere deinen Wiederherstellungsschlüssel" } From b44c83aad7fc60575e0121140ab60734fd059df0 Mon Sep 17 00:00:00 2001 From: Jeff Huang Date: Tue, 31 Mar 2020 06:05:09 +0000 Subject: [PATCH 0060/2751] Translated using Weblate (Chinese (Traditional)) Currently translated at 100.0% (2243 of 2243 strings) Translation: Riot Web/matrix-react-sdk Translate-URL: https://translate.riot.im/projects/riot-web/matrix-react-sdk/zh_Hant/ --- src/i18n/strings/zh_Hant.json | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/i18n/strings/zh_Hant.json b/src/i18n/strings/zh_Hant.json index a2d6f82c6b..03d49e0499 100644 --- a/src/i18n/strings/zh_Hant.json +++ b/src/i18n/strings/zh_Hant.json @@ -2305,5 +2305,7 @@ "Verified": "已驗證", "Verification cancelled": "驗證已取消", "Compare emoji": "比較顏文字", - "Session backup key:": "工作階段備份金鑰：" + "Session backup key:": "工作階段備份金鑰：", + "Sends a message as html, without interpreting it as markdown": "以 html 形式傳送訊息，不將其翻譯為 markdown", + "Cancel replying to a message": "取消回覆訊息" } From a2a9dc6cd066da25a0fd609f7ac22215ebd72173 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Tue, 31 Mar 2020 10:37:56 +0100 Subject: [PATCH 0061/2751] Fix peeking keeping two timeline update mechanisms in play Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/components/structures/RoomView.js | 5 +++++ src/stores/RoomViewStore.js | 12 +++++++----- 2 files changed, 12 insertions(+), 5 deletions(-) diff --git a/src/components/structures/RoomView.js b/src/components/structures/RoomView.js index 1a1f60c7bd..50b66bee93 100644 --- a/src/components/structures/RoomView.js +++ b/src/components/structures/RoomView.js @@ -236,6 +236,11 @@ export default createReactClass({ showReadReceipts: SettingsStore.getValue("showReadReceipts", roomId), }; + if (!initial && this.state.shouldPeek && !newState.shouldPeek) { + // Stop peeking because we have joined this room now + this.context.stopPeeking(); + } + // Temporary logging to diagnose https://github.com/vector-im/riot-web/issues/4307 console.log( 'RVS update:', diff --git a/src/stores/RoomViewStore.js b/src/stores/RoomViewStore.js index 64dfd56b2f..b32e088a76 100644 --- a/src/stores/RoomViewStore.js +++ b/src/stores/RoomViewStore.js @@ -123,6 +123,9 @@ class RoomViewStore extends Store { case 'join_room_error': this._joinRoomError(payload); break; + case 'join_room_ready': + this._setState({ shouldPeek: false }); + break; case 'on_client_not_viable': case 'on_logged_out': this.reset(); @@ -259,11 +262,10 @@ class RoomViewStore extends Store { MatrixClientPeg.get().joinRoom( this._state.roomAlias || this._state.roomId, payload.opts, ).then(() => { - // We don't actually need to do anything here: we do *not* - // clear the 'joining' flag because the Room object and/or - // our 'joined' member event may not have come down the sync - // stream yet, and that's the point at which we'd consider - // the user joined to the room. + // We do *not* clear the 'joining' flag because the Room object and/or our 'joined' member event may not + // have come down the sync stream yet, and that's the point at which we'd consider the user joined to the + // room. + dis.dispatch({ action: 'join_room_ready' }); }, (err) => { dis.dispatch({ action: 'join_room_error', From 24c09cc4c8e647db9c6bfe69a681606cce4a3e68 Mon Sep 17 00:00:00 2001 From: "J. Ryan Stinnett" Date: Tue, 31 Mar 2020 10:45:53 +0100 Subject: [PATCH 0062/2751] Convert secret storage key creation to object --- .../CreateSecretStorageDialog.js | 28 ++++--------------- 1 file changed, 6 insertions(+), 22 deletions(-) diff --git a/src/async-components/views/dialogs/secretstorage/CreateSecretStorageDialog.js b/src/async-components/views/dialogs/secretstorage/CreateSecretStorageDialog.js index 1149f230ef..01a2856df0 100644 --- a/src/async-components/views/dialogs/secretstorage/CreateSecretStorageDialog.js +++ b/src/async-components/views/dialogs/secretstorage/CreateSecretStorageDialog.js @@ -67,8 +67,6 @@ export default class CreateSecretStorageDialog extends React.PureComponent { constructor(props) { super(props); - this._keyInfo = null; - this._encodedRecoveryKey = null; this._recoveryKey = null; this._recoveryKeyNode = null; this._setZxcvbnResultTimeout = null; @@ -181,7 +179,7 @@ export default class CreateSecretStorageDialog extends React.PureComponent { } _onDownloadClick = () => { - const blob = new Blob([this._encodedRecoveryKey], { + const blob = new Blob([this._recoveryKey.encodedPrivateKey], { type: 'text/plain;charset=us-ascii', }); FileSaver.saveAs(blob, 'recovery-key.txt'); @@ -235,22 +233,14 @@ export default class CreateSecretStorageDialog extends React.PureComponent { if (force) { await cli.bootstrapSecretStorage({ authUploadDeviceSigningKeys: this._doBootstrapUIAuth, - createSecretStorageKey: async () => [ - this._keyInfo, - this._encodedRecoveryKey, - this._recoveryKey, - ], + createSecretStorageKey: async () => this._recoveryKey, setupNewKeyBackup: true, setupNewSecretStorage: true, }); } else { await cli.bootstrapSecretStorage({ authUploadDeviceSigningKeys: this._doBootstrapUIAuth, - createSecretStorageKey: async () => [ - this._keyInfo, - this._encodedRecoveryKey, - this._recoveryKey, - ], + createSecretStorageKey: async () => this._recoveryKey, keyBackupInfo: this.state.backupInfo, setupNewKeyBackup: !this.state.backupInfo && this.state.useKeyBackup, getKeyBackupPassphrase: promptForBackupPassphrase, @@ -308,11 +298,8 @@ export default class CreateSecretStorageDialog extends React.PureComponent { } _onSkipPassPhraseClick = async () => { - const [keyInfo, encodedRecoveryKey, recoveryKey] = + this._recoveryKey = await MatrixClientPeg.get().createRecoveryKeyFromPassphrase(); - this._keyInfo = keyInfo; - this._encodedRecoveryKey = encodedRecoveryKey; - this._recoveryKey = recoveryKey; this.setState({ copied: false, downloaded: false, @@ -345,11 +332,8 @@ export default class CreateSecretStorageDialog extends React.PureComponent { if (this.state.passPhrase !== this.state.passPhraseConfirm) return; - const [keyInfo, encodedRecoveryKey, recoveryKey] = + this._recoveryKey = await MatrixClientPeg.get().createRecoveryKeyFromPassphrase(this.state.passPhrase); - this._keyInfo = keyInfo; - this._encodedRecoveryKey = encodedRecoveryKey; - this._recoveryKey = recoveryKey; this.setState({ copied: false, downloaded: false, @@ -624,7 +608,7 @@ export default class CreateSecretStorageDialog extends React.PureComponent {
- {this._encodedRecoveryKey} + {this._recoveryKey.encodedPrivateKey}
From 80479195c82e2c91da865962724846429b9461b2 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Tue, 31 Mar 2020 11:53:26 +0100 Subject: [PATCH 0063/2751] iterate PR based on feedback. Remove newballsplease cmd alias Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/SlashCommands.tsx | 45 ++++++++++++++++++------------------------- 1 file changed, 19 insertions(+), 26 deletions(-) diff --git a/src/SlashCommands.tsx b/src/SlashCommands.tsx index 9fb0a151cf..c62aa9c3e5 100644 --- a/src/SlashCommands.tsx +++ b/src/SlashCommands.tsx @@ -71,6 +71,16 @@ export const CommandCategories = { type RunFn = ((roomId: string, args: string, cmd: string) => {error: any} | {promise: Promise}); +interface ICommandOpts { + command: string; + aliases?: string[]; + args?: string; + description: string; + runFn?: RunFn; + category: string; + hideCompletionAfterSpace?: boolean; +} + class Command { command: string; aliases: string[]; @@ -80,30 +90,14 @@ class Command { category: string; hideCompletionAfterSpace: boolean; - constructor({ - command, - aliases = [], - args = '', - description, - runFn = undefined, - category = CommandCategories.other, - hideCompletionAfterSpace = false, - }: { - command: string; - aliases?: string[]; - args?: string; - description: string; - runFn?: RunFn; - category: string; - hideCompletionAfterSpace?: boolean; - }) { - this.command = command; - this.aliases = aliases; - this.args = args; - this.description = description; - this.runFn = runFn; - this.category = category; - this.hideCompletionAfterSpace = hideCompletionAfterSpace; + constructor(opts: ICommandOpts) { + this.command = opts.command; + this.aliases = opts.aliases || []; + this.args = opts.args || ""; + this.description = opts.description; + this.runFn = opts.runFn; + this.category = opts.category || CommandCategories.other; + this.hideCompletionAfterSpace = opts.hideCompletionAfterSpace || false; } getCommand() { @@ -853,7 +847,6 @@ export const Commands = [ }), new Command({ command: 'discardsession', - aliases: ['newballsplease'], description: _td('Forces the current outbound group session in an encrypted room to be discarded'), runFn: function(roomId) { try { @@ -900,7 +893,7 @@ export const Commands = [ command: "whois", description: _td("Displays information about a user"), args: "", - runFn: function (roomId, userId) { + runFn: function(roomId, userId) { if (!userId || !userId.startsWith("@") || !userId.includes(":")) { return reject(this.getUsage()); } From 9e8a401dc88af6fc09ed711b9aa13a911bb8acd4 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Tue, 31 Mar 2020 12:29:58 +0100 Subject: [PATCH 0064/2751] Fix EventListSummary when RR rendering is disabled Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- res/css/views/rooms/_EventTile.scss | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/res/css/views/rooms/_EventTile.scss b/res/css/views/rooms/_EventTile.scss index 2fa9994155..1cf9fb6edb 100644 --- a/res/css/views/rooms/_EventTile.scss +++ b/res/css/views/rooms/_EventTile.scss @@ -120,7 +120,9 @@ limitations under the License. line-height: 22px; } -.mx_RoomView_timeline_rr_enabled { +.mx_RoomView_timeline_rr_enabled, +// on ELS we need the margin to allow interaction with the expand/collapse button which is normally in the RR gutter +.mx_EventListSummary { .mx_EventTile_line, .mx_EventTile_reply { /* ideally should be 100px, but 95px gives us a max thumbnail size of 800x600, which is nice */ margin-right: 110px; From 2624017ab9a4c2837a3d04cbad49cd7bae992414 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Tue, 31 Mar 2020 12:51:03 +0100 Subject: [PATCH 0065/2751] Also stop peeking on unmount Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/components/structures/RoomView.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/components/structures/RoomView.js b/src/components/structures/RoomView.js index 50b66bee93..2c9e798bd8 100644 --- a/src/components/structures/RoomView.js +++ b/src/components/structures/RoomView.js @@ -472,6 +472,10 @@ export default createReactClass({ RoomScrollStateStore.setScrollState(this.state.roomId, this._getScrollState()); } + if (this.state.shouldPeek) { + this.context.stopPeeking(); + } + // stop tracking room changes to format permalinks this._stopAllPermalinkCreators(); From 6cf9166c4a3e4a85406679e997a9e0e8c3538468 Mon Sep 17 00:00:00 2001 From: Jorik Schellekens Date: Tue, 31 Mar 2020 15:26:23 +0100 Subject: [PATCH 0066/2751] Use variables for the rem values. It's become obvious that these random floating points everywhere are unwieldy. Now they're all in one place with some fairly logical variable names which will help out in design->implementation phase. --- res/css/_common.scss | 18 +++---- res/css/_font-sizes.scss | 47 +++++++++++++++++++ res/css/rethemendex.sh | 2 +- res/css/structures/_ContextualMenu.scss | 2 +- res/css/structures/_CreateRoom.scss | 2 +- res/css/structures/_FilePanel.scss | 8 ++-- res/css/structures/_GroupView.scss | 10 ++-- res/css/structures/_LeftPanel.scss | 2 +- res/css/structures/_MyGroups.scss | 8 ++-- res/css/structures/_NotificationPanel.scss | 4 +- res/css/structures/_RightPanel.scss | 2 +- res/css/structures/_RoomDirectory.scss | 10 ++-- res/css/structures/_RoomStatusBar.scss | 14 +++--- res/css/structures/_RoomSubList.scss | 4 +- res/css/structures/_RoomView.scss | 4 +- res/css/structures/_TabbedView.scss | 2 +- res/css/structures/_TagPanel.scss | 4 +- res/css/structures/_ToastContainer.scss | 6 +-- res/css/structures/_TopLeftMenuButton.scss | 2 +- res/css/structures/_ViewSource.scss | 2 +- .../structures/auth/_CompleteSecurity.scss | 2 +- res/css/views/auth/_AuthBody.scss | 8 ++-- res/css/views/auth/_AuthButtons.scss | 2 +- res/css/views/auth/_AuthFooter.scss | 2 +- res/css/views/auth/_CompleteSecurityBody.scss | 4 +- res/css/views/auth/_LanguageSelector.scss | 2 +- res/css/views/auth/_ServerTypeSelector.scss | 2 +- .../context_menus/_RoomTileContextMenu.scss | 2 +- .../_StatusMessageContextMenu.scss | 2 +- .../context_menus/_TagTileContextMenu.scss | 2 +- res/css/views/context_menus/_TopLeftMenu.scss | 4 +- .../views/dialogs/_AddressPickerDialog.scss | 4 +- .../dialogs/_ConfirmUserActionDialog.scss | 8 ++-- res/css/views/dialogs/_CreateGroupDialog.scss | 4 +- res/css/views/dialogs/_CreateRoomDialog.scss | 2 +- res/css/views/dialogs/_DevtoolsDialog.scss | 4 +- res/css/views/dialogs/_InviteDialog.scss | 18 +++---- .../dialogs/_MessageEditHistoryDialog.scss | 4 +- .../dialogs/_NewSessionReviewDialog.scss | 2 +- res/css/views/dialogs/_SetEmailDialog.scss | 2 +- res/css/views/dialogs/_SetMxIdDialog.scss | 2 +- res/css/views/dialogs/_SetPasswordDialog.scss | 2 +- res/css/views/dialogs/_TermsDialog.scss | 2 +- .../views/dialogs/_UnknownDeviceDialog.scss | 2 +- res/css/views/directory/_NetworkDropdown.scss | 14 +++--- res/css/views/elements/_AccessibleButton.scss | 2 +- res/css/views/elements/_AddressTile.scss | 4 +- .../views/elements/_DirectorySearchBox.scss | 2 +- res/css/views/elements/_Dropdown.scss | 4 +- res/css/views/elements/_EventListSummary.scss | 14 +++--- res/css/views/elements/_Field.scss | 6 +-- res/css/views/elements/_FormButton.scss | 4 +- res/css/views/elements/_ImageView.scss | 10 ++-- .../views/elements/_InteractiveTooltip.scss | 2 +- res/css/views/elements/_RichText.scss | 2 +- res/css/views/elements/_Tooltip.scss | 6 +-- res/css/views/elements/_TooltipButton.scss | 4 +- res/css/views/emojipicker/_EmojiPicker.scss | 8 ++-- res/css/views/messages/_DateSeparator.scss | 2 +- res/css/views/messages/_MessageActionBar.scss | 2 +- res/css/views/messages/_MessageTimestamp.scss | 2 +- res/css/views/messages/_ReactionsRow.scss | 2 +- .../views/messages/_ReactionsRowButton.scss | 2 +- res/css/views/messages/_ViewSourceEvent.scss | 2 +- .../views/messages/_common_CryptoEvent.scss | 4 +- res/css/views/right_panel/_UserInfo.scss | 18 +++---- .../views/right_panel/_VerificationPanel.scss | 2 +- res/css/views/rooms/_AppsDrawer.scss | 10 ++-- .../views/rooms/_BasicMessageComposer.scss | 4 +- res/css/views/rooms/_EntityTile.scss | 6 +-- res/css/views/rooms/_EventTile.scss | 28 +++++------ res/css/views/rooms/_JumpToBottomButton.scss | 4 +- res/css/views/rooms/_MemberDeviceInfo.scss | 2 +- res/css/views/rooms/_MemberInfo.scss | 14 +++--- res/css/views/rooms/_MemberList.scss | 2 +- res/css/views/rooms/_MessageComposer.scss | 6 +-- .../rooms/_MessageComposerFormatBar.scss | 4 +- res/css/views/rooms/_PresenceLabel.scss | 2 +- res/css/views/rooms/_RoomDropTarget.scss | 4 +- res/css/views/rooms/_RoomHeader.scss | 8 ++-- res/css/views/rooms/_RoomList.scss | 4 +- res/css/views/rooms/_RoomPreviewBar.scss | 6 +-- res/css/views/rooms/_RoomTile.scss | 6 +-- res/css/views/rooms/_SearchBar.scss | 4 +- res/css/views/rooms/_SendMessageComposer.scss | 2 +- res/css/views/rooms/_WhoIsTypingTile.scss | 4 +- res/css/views/settings/tabs/_SettingsTab.scss | 8 ++-- .../views/terms/_InlineTermsAgreement.scss | 2 +- .../verification/_VerificationShowSas.scss | 4 +- res/css/views/voip/_CallView.scss | 2 +- res/css/views/voip/_IncomingCallbox.scss | 2 +- res/themes/dark-custom/css/dark-custom.scss | 1 + res/themes/dark/css/_dark.scss | 2 +- res/themes/dark/css/dark.scss | 1 + res/themes/light-custom/css/light-custom.scss | 1 + res/themes/light/css/_light.scss | 4 +- res/themes/light/css/light.scss | 1 + 97 files changed, 280 insertions(+), 227 deletions(-) create mode 100644 res/css/_font-sizes.scss diff --git a/res/css/_common.scss b/res/css/_common.scss index 657fb21244..03442ca510 100644 --- a/res/css/_common.scss +++ b/res/css/_common.scss @@ -16,6 +16,8 @@ See the License for the specific language governing permissions and limitations under the License. */ +@import "./_font-sizes.scss"; + :root { font-size: 15px; } @@ -29,7 +31,7 @@ html { body { font-family: $font-family; - font-size: 1rem; + font-size: $font-15px; background-color: $primary-bg-color; color: $primary-fg-color; border: 0px; @@ -64,7 +66,7 @@ b { h2 { color: $primary-fg-color; font-weight: 400; - font-size: 1.2rem; + font-size: $font-18px; margin-top: 16px; margin-bottom: 16px; } @@ -80,7 +82,7 @@ input[type=search], input[type=password] { padding: 9px; font-family: $font-family; - font-size: 0.933rem; + font-size: $font-14px; font-weight: 600; min-width: 0; } @@ -257,7 +259,7 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus { color: $light-fg-color; z-index: 4012; font-weight: 300; - font-size: 1rem; + font-size: $font-15px; position: relative; padding: 25px 30px 30px 30px; max-height: 80%; @@ -325,8 +327,8 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus { } .mx_Dialog_title { - font-size: 1.467rem; - line-height: 2.400rem; + font-size: $font-22px; + line-height: $font-36px; color: $dialog-title-fg-color; } @@ -354,7 +356,7 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus { .mx_Dialog_content { margin: 24px 0 68px; - font-size: 0.933rem; + font-size: $font-14px; color: $primary-fg-color; word-wrap: break-word; } @@ -450,7 +452,7 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus { } .mx_TextInputDialog_input { - font-size: 1rem; + font-size: $font-15px; border-radius: 3px; border: 1px solid $input-border-color; padding: 9px; diff --git a/res/css/_font-sizes.scss b/res/css/_font-sizes.scss new file mode 100644 index 0000000000..6baf11e9d6 --- /dev/null +++ b/res/css/_font-sizes.scss @@ -0,0 +1,47 @@ +$font-8px: 0.533rem; +$font-9px: 0.600rem; +$font-10px: 0.667rem; +$font-10-4px: 0.693rem; +$font-11px: 0.733rem; +$font-12px: 0.800rem; +$font-13px: 0.867rem; +$font-14px: 0.933rem; +$font-15px: 1.000rem; +$font-16px: 1.067rem; +$font-17px: 1.133rem; +$font-18px: 1.200rem; +$font-19px: 1.267rem; +$font-20px: 1.333rem; +$font-21px: 1.400rem; +$font-22px: 1.467rem; +$font-23px: 1.533rem; +$font-24px: 1.600rem; +$font-25px: 1.667rem; +$font-26px: 1.733rem; +$font-27px: 1.800rem; +$font-28px: 1.867rem; +$font-29px: 1.933rem; +$font-30px: 2.000rem; +$font-31px: 2.067rem; +$font-32px: 2.133rem; +$font-33px: 2.200rem; +$font-34px: 2.267rem; +$font-35px: 2.333rem; +$font-36px: 2.400rem; +$font-37px: 2.467rem; +$font-38px: 2.533rem; +$font-39px: 2.600rem; +$font-40px: 2.667rem; +$font-41px: 2.733rem; +$font-42px: 2.800rem; +$font-43px: 2.867rem; +$font-44px: 2.933rem; +$font-45px: 3.000rem; +$font-46px: 3.067rem; +$font-47px: 3.133rem; +$font-48px: 3.200rem; +$font-49px: 3.267rem; +$font-50px: 3.333rem; +$font-51px: 3.400rem; +$font-52px: 3.467rem; +$font-400px: 26.667rem; diff --git a/res/css/rethemendex.sh b/res/css/rethemendex.sh index 13be73f9a9..5d9e789982 100755 --- a/res/css/rethemendex.sh +++ b/res/css/rethemendex.sh @@ -8,7 +8,7 @@ cd `dirname $0` # we used to have exclude /themes from the find at this point. # as themes are no longer a spurious subdirectory of css/, we don't # need it any more. - find . -iname _\*.scss | fgrep -v _components.scss | LC_ALL=C sort | + find . -iname _\*.scss | sort | fgrep -v _components.scss | LC_ALL=C sort | while read i; do echo "@import \"$i\";" done diff --git a/res/css/structures/_ContextualMenu.scss b/res/css/structures/_ContextualMenu.scss index 67e7a7a8d6..61070a0541 100644 --- a/res/css/structures/_ContextualMenu.scss +++ b/res/css/structures/_ContextualMenu.scss @@ -36,7 +36,7 @@ limitations under the License. background-color: $menu-bg-color; color: $primary-fg-color; position: absolute; - font-size: 0.933rem; + font-size: $font-14px; z-index: 5001; } diff --git a/res/css/structures/_CreateRoom.scss b/res/css/structures/_CreateRoom.scss index 3a66805bfe..e859beb20e 100644 --- a/res/css/structures/_CreateRoom.scss +++ b/res/css/structures/_CreateRoom.scss @@ -26,7 +26,7 @@ limitations under the License. border-radius: 3px; border: 1px solid $strong-input-border-color; font-weight: 300; - font-size: 0.867rem; + font-size: $font-13px; padding: 9px; margin-top: 6px; } diff --git a/res/css/structures/_FilePanel.scss b/res/css/structures/_FilePanel.scss index eceeab2e1b..859ee28035 100644 --- a/res/css/structures/_FilePanel.scss +++ b/res/css/structures/_FilePanel.scss @@ -49,7 +49,7 @@ limitations under the License. .mx_FilePanel .mx_EventTile .mx_MFileBody_download { display: flex; - font-size: 0.933rem; + font-size: $font-14px; color: $event-timestamp-color; } @@ -60,7 +60,7 @@ limitations under the License. .mx_FilePanel .mx_EventTile .mx_MImageBody_size { flex: 1 0 0; - font-size: 0.733rem; + font-size: $font-11px; text-align: right; white-space: nowrap; } @@ -80,7 +80,7 @@ limitations under the License. flex: 1 1 auto; line-height: initial; padding: 0px; - font-size: 0.733rem; + font-size: $font-11px; opacity: 1.0; color: $event-timestamp-color; } @@ -90,7 +90,7 @@ limitations under the License. text-align: right; visibility: visible; position: initial; - font-size: 0.733rem; + font-size: $font-11px; opacity: 1.0; color: $event-timestamp-color; } diff --git a/res/css/structures/_GroupView.scss b/res/css/structures/_GroupView.scss index 6eb5e33462..ed0cf121a4 100644 --- a/res/css/structures/_GroupView.scss +++ b/res/css/structures/_GroupView.scss @@ -134,7 +134,7 @@ limitations under the License. overflow: hidden; color: $primary-fg-color; font-weight: bold; - font-size: 1.467rem; + font-size: $font-22px; padding-left: 19px; padding-right: 16px; /* why isn't text-overflow working? */ @@ -148,7 +148,7 @@ limitations under the License. max-height: 42px; color: $settings-grey-fg-color; font-weight: 300; - font-size: 0.867rem; + font-size: $font-13px; padding-left: 19px; margin-right: 16px; overflow: hidden; @@ -196,7 +196,7 @@ limitations under the License. text-transform: uppercase; color: $h3-color; font-weight: 600; - font-size: 0.867rem; + font-size: $font-13px; margin-bottom: 10px; } @@ -226,7 +226,7 @@ limitations under the License. .mx_GroupView_rooms_header_addRow_label { display: inline-block; vertical-align: top; - line-height: 1.600rem; + line-height: $font-24px; padding-left: 28px; color: $accent-color; } @@ -258,7 +258,7 @@ limitations under the License. .mx_GroupView_membershipSection_description { /* To match textButton */ - line-height: 2.267rem; + line-height: $font-34px; } .mx_GroupView_membershipSection_description .mx_BaseAvatar { diff --git a/res/css/structures/_LeftPanel.scss b/res/css/structures/_LeftPanel.scss index 6af4b54f91..7d57425f6f 100644 --- a/res/css/structures/_LeftPanel.scss +++ b/res/css/structures/_LeftPanel.scss @@ -147,7 +147,7 @@ limitations under the License. } .mx_AccessibleButton { - font-size: 0.933rem; + font-size: $font-14px; margin: 4px 0 1px 9px; padding: 9px; padding-left: 42px; diff --git a/res/css/structures/_MyGroups.scss b/res/css/structures/_MyGroups.scss index 042994e48c..73f1332cd0 100644 --- a/res/css/structures/_MyGroups.scss +++ b/res/css/structures/_MyGroups.scss @@ -105,7 +105,7 @@ limitations under the License. .mx_MyGroups_placeholder { background-color: $info-plinth-bg-color; color: $info-plinth-fg-color; - line-height: 26.667rem; + line-height: $font-400px; border-radius: 10px; text-align: center; } @@ -149,11 +149,11 @@ limitations under the License. .mx_GroupTile_profile .mx_GroupTile_name { margin: 0px; - font-size: 1rem; + font-size: $font-15px; } .mx_GroupTile_profile .mx_GroupTile_groupId { - font-size: 0.867rem; + font-size: $font-13px; opacity: 0.7; } @@ -161,7 +161,7 @@ limitations under the License. display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; - font-size: 0.867rem; + font-size: $font-13px; max-height: 36px; overflow: hidden; } diff --git a/res/css/structures/_NotificationPanel.scss b/res/css/structures/_NotificationPanel.scss index ff95cc2dba..44205b1f01 100644 --- a/res/css/structures/_NotificationPanel.scss +++ b/res/css/structures/_NotificationPanel.scss @@ -39,7 +39,7 @@ limitations under the License. .mx_NotificationPanel .mx_EventTile_roomName { font-weight: bold; - font-size: 0.933rem; + font-size: $font-14px; } .mx_NotificationPanel .mx_EventTile_roomName a { @@ -54,7 +54,7 @@ limitations under the License. .mx_NotificationPanel .mx_EventTile .mx_SenderProfile, .mx_NotificationPanel .mx_EventTile .mx_MessageTimestamp { color: $primary-fg-color; - font-size: 0.8rem; + font-size: $font-12px; display: inline; padding-left: 0px; } diff --git a/res/css/structures/_RightPanel.scss b/res/css/structures/_RightPanel.scss index b0c2b4650f..10878322e3 100644 --- a/res/css/structures/_RightPanel.scss +++ b/res/css/structures/_RightPanel.scss @@ -96,7 +96,7 @@ limitations under the License. } .mx_RightPanel_headerButton_badge { - font-size: 0.533rem; + font-size: $font-8px; border-radius: 8px; color: $accent-fg-color; background-color: $accent-color; diff --git a/res/css/structures/_RoomDirectory.scss b/res/css/structures/_RoomDirectory.scss index b62f726d09..e0814182f5 100644 --- a/res/css/structures/_RoomDirectory.scss +++ b/res/css/structures/_RoomDirectory.scss @@ -64,7 +64,7 @@ limitations under the License. } .mx_RoomDirectory_table { - font-size: 0.8rem; + font-size: $font-12px; color: $primary-fg-color; width: 100%; text-align: left; @@ -112,7 +112,7 @@ limitations under the License. .mx_RoomDirectory_name { display: inline-block; - font-size: 1.2rem; + font-size: $font-18px; font-weight: 600; } @@ -124,7 +124,7 @@ limitations under the License. border-radius: 10px; display: inline-block; height: 20px; - line-height: 1.333rem; + line-height: $font-20px; padding: 0 5px; color: $accent-fg-color; background-color: $rte-room-pill-color; @@ -136,7 +136,7 @@ limitations under the License. } .mx_RoomDirectory_alias { - font-size: 0.8rem; + font-size: $font-12px; color: $settings-grey-fg-color; } @@ -150,7 +150,7 @@ limitations under the License. } .mx_RoomDirectory > span { - font-size: 1rem; + font-size: $font-15px; margin-top: 0; .mx_AccessibleButton { diff --git a/res/css/structures/_RoomStatusBar.scss b/res/css/structures/_RoomStatusBar.scss index 1dc99b26f0..cd4390ee5c 100644 --- a/res/css/structures/_RoomStatusBar.scss +++ b/res/css/structures/_RoomStatusBar.scss @@ -32,7 +32,7 @@ limitations under the License. .mx_RoomStatusBar_callBar { height: 50px; - line-height: 3.333rem; + line-height: $font-50px; } .mx_RoomStatusBar_placeholderIndicator span { @@ -94,7 +94,7 @@ limitations under the License. border-radius: 40px; width: 24px; height: 24px; - line-height: 1.600rem; + line-height: $font-24px; font-size: 0.8em; vertical-align: top; text-align: center; @@ -132,7 +132,7 @@ limitations under the License. .mx_RoomStatusBar_connectionLostBar_desc { color: $primary-fg-color; - font-size: 0.867rem; + font-size: $font-13px; opacity: 0.5; padding-bottom: 20px; } @@ -145,7 +145,7 @@ limitations under the License. .mx_RoomStatusBar_typingBar { height: 50px; - line-height: 3.333rem; + line-height: $font-50px; color: $primary-fg-color; opacity: 0.5; @@ -155,7 +155,7 @@ limitations under the License. .mx_RoomStatusBar_isAlone { height: 50px; - line-height: 3.333rem; + line-height: $font-50px; color: $primary-fg-color; opacity: 0.5; @@ -174,11 +174,11 @@ limitations under the License. .mx_RoomStatusBar_callBar { height: 40px; - line-height: 2.667rem; + line-height: $font-40px; } .mx_RoomStatusBar_typingBar { height: 40px; - line-height: 2.667rem; + line-height: $font-40px; } } diff --git a/res/css/structures/_RoomSubList.scss b/res/css/structures/_RoomSubList.scss index a76872a745..2e0c94263e 100644 --- a/res/css/structures/_RoomSubList.scss +++ b/res/css/structures/_RoomSubList.scss @@ -68,7 +68,7 @@ limitations under the License. text-transform: uppercase; color: $roomsublist-label-fg-color; font-weight: 700; - font-size: 0.8rem; + font-size: $font-12px; margin-left: 8px; } @@ -76,7 +76,7 @@ limitations under the License. flex: 0 0 auto; border-radius: 8px; font-weight: 600; - font-size: 0.8rem; + font-size: $font-12px; padding: 0 5px; color: $roomtile-badge-fg-color; background-color: $roomtile-name-color; diff --git a/res/css/structures/_RoomView.scss b/res/css/structures/_RoomView.scss index 52de9384d7..f2154ef448 100644 --- a/res/css/structures/_RoomView.scss +++ b/res/css/structures/_RoomView.scss @@ -23,7 +23,7 @@ limitations under the License. .mx_RoomView_fileDropTarget { min-width: 0px; width: 100%; - font-size: 1.2rem; + font-size: $font-18px; text-align: center; pointer-events: none; @@ -186,7 +186,7 @@ limitations under the License. .mx_RoomView_empty { flex: 1 1 auto; - font-size: 0.867rem; + font-size: $font-13px; padding-left: 3em; padding-right: 3em; margin-right: 20px; diff --git a/res/css/structures/_TabbedView.scss b/res/css/structures/_TabbedView.scss index 20e2120bfd..4a4bb125a3 100644 --- a/res/css/structures/_TabbedView.scss +++ b/res/css/structures/_TabbedView.scss @@ -39,7 +39,7 @@ limitations under the License. cursor: pointer; display: block; border-radius: 3px; - font-size: 0.933rem; + font-size: $font-14px; min-height: 24px; // use min-height instead of height to allow the label to overflow a bit margin-bottom: 6px; position: relative; diff --git a/res/css/structures/_TagPanel.scss b/res/css/structures/_TagPanel.scss index 5173358bcc..f56b318e70 100644 --- a/res/css/structures/_TagPanel.scss +++ b/res/css/structures/_TagPanel.scss @@ -139,7 +139,7 @@ limitations under the License. background-color: $neutral-badge-color; color: #ffffff; font-weight: 600; - font-size: 0.667rem; + font-size: $font-10px; text-align: center; padding-top: 1px; padding-left: 4px; @@ -157,7 +157,7 @@ limitations under the License. border-radius: 8px; color: $accent-fg-color; font-weight: 600; - font-size: 0.933rem; + font-size: $font-14px; padding: 0 5px; background-color: $roomtile-name-color; } diff --git a/res/css/structures/_ToastContainer.scss b/res/css/structures/_ToastContainer.scss index 07daf3f865..af595aaeee 100644 --- a/res/css/structures/_ToastContainer.scss +++ b/res/css/structures/_ToastContainer.scss @@ -77,7 +77,7 @@ limitations under the License. grid-column: 1 / 3; grid-row: 1; margin: 0; - font-size: 1rem; + font-size: $font-15px; font-weight: 600; } @@ -96,11 +96,11 @@ limitations under the License. white-space: nowrap; text-overflow: ellipsis; margin: 4px 0 11px 0; - font-size: 0.8rem; + font-size: $font-12px; } .mx_Toast_deviceID { - font-size: 0.667rem; + font-size: $font-10px; } } } diff --git a/res/css/structures/_TopLeftMenuButton.scss b/res/css/structures/_TopLeftMenuButton.scss index 9bdffb530a..53d44e7c24 100644 --- a/res/css/structures/_TopLeftMenuButton.scss +++ b/res/css/structures/_TopLeftMenuButton.scss @@ -32,7 +32,7 @@ limitations under the License. .mx_TopLeftMenuButton_name { margin: 0 7px; - font-size: 1.2rem; + font-size: $font-18px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; diff --git a/res/css/structures/_ViewSource.scss b/res/css/structures/_ViewSource.scss index c84c48240e..421d1f03cd 100644 --- a/res/css/structures/_ViewSource.scss +++ b/res/css/structures/_ViewSource.scss @@ -29,7 +29,7 @@ limitations under the License. .mx_ViewSource pre { text-align: left; - font-size: 0.8rem; + font-size: $font-12px; padding: 0.5em 1em 0.5em 1em; word-wrap: break-word; white-space: pre-wrap; diff --git a/res/css/structures/auth/_CompleteSecurity.scss b/res/css/structures/auth/_CompleteSecurity.scss index 9367c2c996..3050840fe8 100644 --- a/res/css/structures/auth/_CompleteSecurity.scss +++ b/res/css/structures/auth/_CompleteSecurity.scss @@ -34,7 +34,7 @@ limitations under the License. } .mx_CompleteSecurity_body { - font-size: 1rem; + font-size: $font-15px; } .mx_CompleteSecurity_waiting { diff --git a/res/css/views/auth/_AuthBody.scss b/res/css/views/auth/_AuthBody.scss index 219bf6d0e7..468a4b3d62 100644 --- a/res/css/views/auth/_AuthBody.scss +++ b/res/css/views/auth/_AuthBody.scss @@ -17,7 +17,7 @@ limitations under the License. .mx_AuthBody { width: 500px; - font-size: 0.8rem; + font-size: $font-12px; color: $authpage-secondary-color; background-color: $authpage-body-bg-color; border-radius: 0 4px 4px 0; @@ -25,14 +25,14 @@ limitations under the License. box-sizing: border-box; h2 { - font-size: 1.600rem; + font-size: $font-24px; font-weight: 600; margin-top: 8px; color: $authpage-primary-color; } h3 { - font-size: 0.933rem; + font-size: $font-14px; font-weight: 600; color: $authpage-primary-color; } @@ -98,7 +98,7 @@ limitations under the License. .mx_AuthBody_editServerDetails { padding-left: 1em; - font-size: 0.8rem; + font-size: $font-12px; font-weight: normal; } diff --git a/res/css/views/auth/_AuthButtons.scss b/res/css/views/auth/_AuthButtons.scss index 109a1f4670..8deb0f80ac 100644 --- a/res/css/views/auth/_AuthButtons.scss +++ b/res/css/views/auth/_AuthButtons.scss @@ -43,7 +43,7 @@ limitations under the License. cursor: pointer; - font-size: 1rem; + font-size: $font-15px; padding: 0 11px; word-break: break-word; } diff --git a/res/css/views/auth/_AuthFooter.scss b/res/css/views/auth/_AuthFooter.scss index b1bdcb697e..0bc2743d54 100644 --- a/res/css/views/auth/_AuthFooter.scss +++ b/res/css/views/auth/_AuthFooter.scss @@ -17,7 +17,7 @@ limitations under the License. .mx_AuthFooter { text-align: center; width: 100%; - font-size: 0.933rem; + font-size: $font-14px; opacity: 0.72; padding: 20px 0; background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8)); diff --git a/res/css/views/auth/_CompleteSecurityBody.scss b/res/css/views/auth/_CompleteSecurityBody.scss index af0620c329..46b7abe2cc 100644 --- a/res/css/views/auth/_CompleteSecurityBody.scss +++ b/res/css/views/auth/_CompleteSecurityBody.scss @@ -24,13 +24,13 @@ limitations under the License. box-sizing: border-box; h2 { - font-size: 1.600rem; + font-size: $font-24px; font-weight: 600; margin-top: 0; } h3 { - font-size: 0.933rem; + font-size: $font-14px; font-weight: 600; } diff --git a/res/css/views/auth/_LanguageSelector.scss b/res/css/views/auth/_LanguageSelector.scss index e9ac8688ed..781561f876 100644 --- a/res/css/views/auth/_LanguageSelector.scss +++ b/res/css/views/auth/_LanguageSelector.scss @@ -20,7 +20,7 @@ limitations under the License. .mx_AuthBody_language .mx_Dropdown_input { border: none; - font-size: 0.933rem; + font-size: $font-14px; font-weight: 600; color: $authpage-lang-color; } diff --git a/res/css/views/auth/_ServerTypeSelector.scss b/res/css/views/auth/_ServerTypeSelector.scss index 2042358b8a..fbd3d2655d 100644 --- a/res/css/views/auth/_ServerTypeSelector.scss +++ b/res/css/views/auth/_ServerTypeSelector.scss @@ -65,5 +65,5 @@ limitations under the License. } .mx_ServerTypeSelector_description { - font-size: 0.667rem; + font-size: $font-10px; } diff --git a/res/css/views/context_menus/_RoomTileContextMenu.scss b/res/css/views/context_menus/_RoomTileContextMenu.scss index 1e1a5f889f..9697ac9bef 100644 --- a/res/css/views/context_menus/_RoomTileContextMenu.scss +++ b/res/css/views/context_menus/_RoomTileContextMenu.scss @@ -38,7 +38,7 @@ limitations under the License. white-space: nowrap; display: flex; align-items: center; - line-height: 1.067rem; + line-height: $font-16px; } .mx_RoomTileContextMenu_tag_field.mx_RoomTileContextMenu_tag_fieldSet { diff --git a/res/css/views/context_menus/_StatusMessageContextMenu.scss b/res/css/views/context_menus/_StatusMessageContextMenu.scss index b68d16281a..fceb7fba34 100644 --- a/res/css/views/context_menus/_StatusMessageContextMenu.scss +++ b/res/css/views/context_menus/_StatusMessageContextMenu.scss @@ -44,7 +44,7 @@ input.mx_StatusMessageContextMenu_message { .mx_StatusMessageContextMenu_clear { @mixin mx_DialogButton; align-self: start; - font-size: 0.8rem; + font-size: $font-12px; padding: 6px 1em; border: 1px solid transparent; margin-right: 10px; diff --git a/res/css/views/context_menus/_TagTileContextMenu.scss b/res/css/views/context_menus/_TagTileContextMenu.scss index 20f95d7f84..e4ccc030a2 100644 --- a/res/css/views/context_menus/_TagTileContextMenu.scss +++ b/res/css/views/context_menus/_TagTileContextMenu.scss @@ -22,7 +22,7 @@ limitations under the License. white-space: nowrap; display: flex; align-items: center; - line-height: 1.067rem; + line-height: $font-16px; } .mx_TagTileContextMenu_item object { diff --git a/res/css/views/context_menus/_TopLeftMenu.scss b/res/css/views/context_menus/_TopLeftMenu.scss index abcaa4fcb5..973c306695 100644 --- a/res/css/views/context_menus/_TopLeftMenu.scss +++ b/res/css/views/context_menus/_TopLeftMenu.scss @@ -19,12 +19,12 @@ limitations under the License. border-radius: 4px; .mx_TopLeftMenu_greyedText { - font-size: 0.8rem; + font-size: $font-12px; opacity: 0.5; } .mx_TopLeftMenu_upgradeLink { - font-size: 0.8rem; + font-size: $font-12px; img { margin-left: 5px; diff --git a/res/css/views/dialogs/_AddressPickerDialog.scss b/res/css/views/dialogs/_AddressPickerDialog.scss index 6b107b3253..136e497994 100644 --- a/res/css/views/dialogs/_AddressPickerDialog.scss +++ b/res/css/views/dialogs/_AddressPickerDialog.scss @@ -28,7 +28,7 @@ limitations under the License. .mx_AddressPickerDialog_input, .mx_AddressPickerDialog_input:focus { height: 26px; - font-size: 0.933rem; + font-size: $font-14px; font-family: $font-family; padding-left: 12px; padding-right: 12px; @@ -50,7 +50,7 @@ limitations under the License. .mx_AddressPickerDialog_inputContainer { border-radius: 3px; border: solid 1px $input-border-color; - line-height: 2.400rem; + line-height: $font-36px; padding-left: 4px; padding-right: 4px; padding-top: 1px; diff --git a/res/css/views/dialogs/_ConfirmUserActionDialog.scss b/res/css/views/dialogs/_ConfirmUserActionDialog.scss index e589ef0450..823f4d1e28 100644 --- a/res/css/views/dialogs/_ConfirmUserActionDialog.scss +++ b/res/css/views/dialogs/_ConfirmUserActionDialog.scss @@ -26,22 +26,22 @@ limitations under the License. } .mx_ConfirmUserActionDialog_name { - font-size: 1.2rem; + font-size: $font-18px; } .mx_ConfirmUserActionDialog_userId { - font-size: 0.867rem; + font-size: $font-13px; } .mx_ConfirmUserActionDialog_reasonField { font-family: $font-family; - font-size: 0.933rem; + font-size: $font-14px; color: $primary-fg-color; background-color: $primary-bg-color; border-radius: 3px; border: solid 1px $input-border-color; - line-height: 2.400rem; + line-height: $font-36px; padding-left: 16px; padding-right: 16px; padding-top: 1px; diff --git a/res/css/views/dialogs/_CreateGroupDialog.scss b/res/css/views/dialogs/_CreateGroupDialog.scss index 4159944e5d..f7bfc61a98 100644 --- a/res/css/views/dialogs/_CreateGroupDialog.scss +++ b/res/css/views/dialogs/_CreateGroupDialog.scss @@ -25,7 +25,7 @@ limitations under the License. } .mx_CreateGroupDialog_input { - font-size: 1rem; + font-size: $font-15px; border-radius: 3px; border: 1px solid $input-border-color; padding: 9px; @@ -44,7 +44,7 @@ limitations under the License. .mx_CreateGroupDialog_prefix, .mx_CreateGroupDialog_suffix { padding: 0px 5px; - line-height: 2.467rem; + line-height: $font-37px; background-color: $input-darker-bg-color; border: 1px solid $input-border-color; text-align: center; diff --git a/res/css/views/dialogs/_CreateRoomDialog.scss b/res/css/views/dialogs/_CreateRoomDialog.scss index 1cdbe99843..c542741c30 100644 --- a/res/css/views/dialogs/_CreateRoomDialog.scss +++ b/res/css/views/dialogs/_CreateRoomDialog.scss @@ -49,7 +49,7 @@ limitations under the License. } .mx_CreateRoomDialog_input { - font-size: 1rem; + font-size: $font-15px; border-radius: 3px; border: 1px solid $input-border-color; padding: 9px; diff --git a/res/css/views/dialogs/_DevtoolsDialog.scss b/res/css/views/dialogs/_DevtoolsDialog.scss index 399c7225f6..35cb6bc7ab 100644 --- a/res/css/views/dialogs/_DevtoolsDialog.scss +++ b/res/css/views/dialogs/_DevtoolsDialog.scss @@ -68,11 +68,11 @@ limitations under the License. width: 240px; color: $input-fg-color; font-family: $font-family; - font-size: 1.067rem; + font-size: $font-16px; } .mx_DevTools_textarea { - font-size: 0.8rem; + font-size: $font-12px; max-width: 684px; min-height: 250px; padding: 10px; diff --git a/res/css/views/dialogs/_InviteDialog.scss b/res/css/views/dialogs/_InviteDialog.scss index 22b1867002..a77d0bfbba 100644 --- a/res/css/views/dialogs/_InviteDialog.scss +++ b/res/css/views/dialogs/_InviteDialog.scss @@ -40,8 +40,8 @@ limitations under the License. textarea, textarea:focus { height: 34px; - line-height: 2.267rem; - font-size: 0.933rem; + line-height: $font-34px; + font-size: $font-14px; padding-left: 12px; margin: 0 !important; border: 0 !important; @@ -65,7 +65,7 @@ limitations under the License. min-width: 48px; margin-left: 10px; height: 25px; - line-height: 1.667rem; + line-height: $font-25px; } .mx_InviteDialog_buttonAndSpinner { @@ -84,7 +84,7 @@ limitations under the License. padding-bottom: 10px; h3 { - font-size: 0.8rem; + font-size: $font-12px; color: $muted-fg-color; font-weight: bold; text-transform: uppercase; @@ -143,23 +143,23 @@ limitations under the License. .mx_InviteDialog_roomTile_name { font-weight: 600; - font-size: 0.933rem; + font-size: $font-14px; color: $primary-fg-color; margin-left: 7px; } .mx_InviteDialog_roomTile_userId { - font-size: 0.8rem; + font-size: $font-12px; color: $muted-fg-color; margin-left: 7px; } .mx_InviteDialog_roomTile_time { text-align: right; - font-size: 0.8rem; + font-size: $font-12px; color: $muted-fg-color; float: right; - line-height: 2.400rem; // Height of the avatar to keep the time vertically aligned + line-height: $font-36px; // Height of the avatar to keep the time vertically aligned } .mx_InviteDialog_roomTile_highlight { @@ -176,7 +176,7 @@ limitations under the License. border-radius: 12px; display: inline-block; height: 24px; - line-height: 1.600rem; + line-height: $font-24px; padding-left: 8px; padding-right: 8px; color: #ffffff; // this is fine without a var because it's for both themes diff --git a/res/css/views/dialogs/_MessageEditHistoryDialog.scss b/res/css/views/dialogs/_MessageEditHistoryDialog.scss index 8d989f6a00..e9d777effd 100644 --- a/res/css/views/dialogs/_MessageEditHistoryDialog.scss +++ b/res/css/views/dialogs/_MessageEditHistoryDialog.scss @@ -35,7 +35,7 @@ limitations under the License. .mx_MessageEditHistoryDialog_edits { list-style-type: none; - font-size: 0.933rem; + font-size: $font-14px; padding: 0; color: $primary-fg-color; @@ -60,7 +60,7 @@ limitations under the License. } .mx_MessageActionBar .mx_AccessibleButton { - font-size: 0.667rem; + font-size: $font-10px; padding: 0 8px; } } diff --git a/res/css/views/dialogs/_NewSessionReviewDialog.scss b/res/css/views/dialogs/_NewSessionReviewDialog.scss index 633b3a063b..b35c570c80 100644 --- a/res/css/views/dialogs/_NewSessionReviewDialog.scss +++ b/res/css/views/dialogs/_NewSessionReviewDialog.scss @@ -32,6 +32,6 @@ limitations under the License. } .mx_NewSessionReviewDialog_deviceID { - font-size: 0.8rem; + font-size: $font-12px; color: $notice-secondary-color; } diff --git a/res/css/views/dialogs/_SetEmailDialog.scss b/res/css/views/dialogs/_SetEmailDialog.scss index a5013f79b1..37bee7a9ff 100644 --- a/res/css/views/dialogs/_SetEmailDialog.scss +++ b/res/css/views/dialogs/_SetEmailDialog.scss @@ -20,7 +20,7 @@ limitations under the License. padding: 9px; color: $input-fg-color; background-color: $primary-bg-color; - font-size: 1rem; + font-size: $font-15px; width: 100%; max-width: 280px; margin-bottom: 10px; diff --git a/res/css/views/dialogs/_SetMxIdDialog.scss b/res/css/views/dialogs/_SetMxIdDialog.scss index 8208a679fd..1df34f3408 100644 --- a/res/css/views/dialogs/_SetMxIdDialog.scss +++ b/res/css/views/dialogs/_SetMxIdDialog.scss @@ -29,7 +29,7 @@ limitations under the License. padding: 9px; color: $primary-fg-color; background-color: $primary-bg-color; - font-size: 1rem; + font-size: $font-15px; width: 100%; max-width: 280px; } diff --git a/res/css/views/dialogs/_SetPasswordDialog.scss b/res/css/views/dialogs/_SetPasswordDialog.scss index cff11c8afb..1f99353298 100644 --- a/res/css/views/dialogs/_SetPasswordDialog.scss +++ b/res/css/views/dialogs/_SetPasswordDialog.scss @@ -20,7 +20,7 @@ limitations under the License. padding: 9px; color: $primary-fg-color; background-color: $primary-bg-color; - font-size: 1rem; + font-size: $font-15px; max-width: 280px; margin-bottom: 10px; } diff --git a/res/css/views/dialogs/_TermsDialog.scss b/res/css/views/dialogs/_TermsDialog.scss index e9805d1b35..939a31dee6 100644 --- a/res/css/views/dialogs/_TermsDialog.scss +++ b/res/css/views/dialogs/_TermsDialog.scss @@ -31,7 +31,7 @@ limitations under the License. } .mx_TermsDialog_termsTable { - font-size: 0.8rem; + font-size: $font-12px; width: 100%; } diff --git a/res/css/views/dialogs/_UnknownDeviceDialog.scss b/res/css/views/dialogs/_UnknownDeviceDialog.scss index 8bb0ed4ff4..daa6bd2352 100644 --- a/res/css/views/dialogs/_UnknownDeviceDialog.scss +++ b/res/css/views/dialogs/_UnknownDeviceDialog.scss @@ -27,7 +27,7 @@ limitations under the License. // userid .mx_UnknownDeviceDialog p { font-weight: bold; - font-size: 1.067rem; + font-size: $font-16px; } .mx_UnknownDeviceDialog .mx_DeviceVerifyButtons { diff --git a/res/css/views/directory/_NetworkDropdown.scss b/res/css/views/directory/_NetworkDropdown.scss index 2f0e3e6a17..269b507e3c 100644 --- a/res/css/views/directory/_NetworkDropdown.scss +++ b/res/css/views/directory/_NetworkDropdown.scss @@ -47,9 +47,9 @@ limitations under the License. .mx_NetworkDropdown_server_title { padding: 0 10px; - font-size: 1rem; + font-size: $font-15px; font-weight: 600; - line-height: 1.333rem; + line-height: $font-20px; margin-bottom: 4px; // remove server button @@ -77,16 +77,16 @@ limitations under the License. .mx_NetworkDropdown_server_subtitle { padding: 0 10px; - font-size: 0.667rem; - line-height: 0.933rem; + font-size: $font-10px; + line-height: $font-14px; margin-top: -4px; margin-bottom: 4px; color: $muted-fg-color; } .mx_NetworkDropdown_server_network { - font-size: 0.8rem; - line-height: 1.067rem; + font-size: $font-12px; + line-height: $font-16px; padding: 4px 10px; cursor: pointer; position: relative; @@ -154,7 +154,7 @@ limitations under the License. .mx_NetworkDropdown_handle_server { color: $muted-fg-color; - font-size: 0.8rem; + font-size: $font-12px; } } diff --git a/res/css/views/elements/_AccessibleButton.scss b/res/css/views/elements/_AccessibleButton.scss index b7439d5856..0ee1186934 100644 --- a/res/css/views/elements/_AccessibleButton.scss +++ b/res/css/views/elements/_AccessibleButton.scss @@ -27,7 +27,7 @@ limitations under the License. text-align: center; border-radius: 4px; display: inline-block; - font-size: 0.933rem; + font-size: $font-14px; } .mx_AccessibleButton_kind_primary { diff --git a/res/css/views/elements/_AddressTile.scss b/res/css/views/elements/_AddressTile.scss index 94028481d4..c42f52f8f4 100644 --- a/res/css/views/elements/_AddressTile.scss +++ b/res/css/views/elements/_AddressTile.scss @@ -19,9 +19,9 @@ limitations under the License. border-radius: 3px; background-color: rgba(74, 73, 74, 0.1); border: solid 1px $input-border-color; - line-height: 1.733rem; + line-height: $font-26px; color: $primary-fg-color; - font-size: 0.933rem; + font-size: $font-14px; font-weight: normal; margin-right: 4px; } diff --git a/res/css/views/elements/_DirectorySearchBox.scss b/res/css/views/elements/_DirectorySearchBox.scss index 35fb80f5df..e4b1ac5574 100644 --- a/res/css/views/elements/_DirectorySearchBox.scss +++ b/res/css/views/elements/_DirectorySearchBox.scss @@ -32,7 +32,7 @@ limitations under the License. background-repeat: no-repeat; text-indent: 18px; font-weight: 600; - font-size: 0.8rem; + font-size: $font-12px; user-select: none; cursor: pointer; } diff --git a/res/css/views/elements/_Dropdown.scss b/res/css/views/elements/_Dropdown.scss index 64bcf7a33a..0dd9656c9c 100644 --- a/res/css/views/elements/_Dropdown.scss +++ b/res/css/views/elements/_Dropdown.scss @@ -29,7 +29,7 @@ limitations under the License. position: relative; border-radius: 3px; border: 1px solid $strong-input-border-color; - font-size: 0.8rem; + font-size: $font-12px; user-select: none; } @@ -53,7 +53,7 @@ limitations under the License. .mx_Dropdown_option { height: 35px; - line-height: 2.333rem; + line-height: $font-35px; padding-left: 8px; padding-right: 8px; } diff --git a/res/css/views/elements/_EventListSummary.scss b/res/css/views/elements/_EventListSummary.scss index a40c1384d7..f3e9f77aa3 100644 --- a/res/css/views/elements/_EventListSummary.scss +++ b/res/css/views/elements/_EventListSummary.scss @@ -19,7 +19,7 @@ limitations under the License. } .mx_TextualEvent.mx_EventListSummary_summary { - font-size: 0.933rem; + font-size: $font-14px; display: inline-flex; } @@ -27,7 +27,7 @@ limitations under the License. display: inline-block; margin-right: 8px; padding-top: 8px; - line-height: 0.8rem; + line-height: $font-12px; } .mx_EventListSummary_avatars .mx_BaseAvatar { @@ -46,19 +46,19 @@ limitations under the License. .mx_EventListSummary_line { border-bottom: 1px solid $primary-hairline-color; margin-left: 63px; - line-height: 2.000rem; + line-height: $font-30px; } .mx_MatrixChat_useCompactLayout { .mx_EventListSummary { - font-size: 0.867rem; + font-size: $font-13px; .mx_EventTile_line { - line-height: 1.333rem; + line-height: $font-20px; } } .mx_EventListSummary_line { - line-height: 1.467rem; + line-height: $font-22px; } .mx_EventListSummary_toggle { @@ -66,6 +66,6 @@ limitations under the License. } .mx_TextualEvent.mx_EventListSummary_summary { - font-size: 0.867rem; + font-size: $font-13px; } } diff --git a/res/css/views/elements/_Field.scss b/res/css/views/elements/_Field.scss index 26d24dba3a..cf5bc7ab41 100644 --- a/res/css/views/elements/_Field.scss +++ b/res/css/views/elements/_Field.scss @@ -40,7 +40,7 @@ limitations under the License. .mx_Field textarea { font-weight: normal; font-family: $font-family; - font-size: 0.933rem; + font-size: $font-14px; border: none; // Even without a border here, we still need this avoid overlapping the rounded // corners on the field above. @@ -102,7 +102,7 @@ limitations under the License. background-color 0.25s ease-out 0.1s; color: $primary-fg-color; background-color: transparent; - font-size: 0.933rem; + font-size: $font-14px; position: absolute; left: 0px; top: 0px; @@ -126,7 +126,7 @@ limitations under the License. color 0.25s ease-out 0s, top 0.25s ease-out 0s, background-color 0.25s ease-out 0s; - font-size: 0.667rem; + font-size: $font-10px; top: -13px; padding: 0 2px; background-color: $field-focused-label-bg-color; diff --git a/res/css/views/elements/_FormButton.scss b/res/css/views/elements/_FormButton.scss index c23ab6ee30..7ec01f17e6 100644 --- a/res/css/views/elements/_FormButton.scss +++ b/res/css/views/elements/_FormButton.scss @@ -15,9 +15,9 @@ limitations under the License. */ .mx_FormButton { - line-height: 1.067rem; + line-height: $font-16px; padding: 5px 15px; - font-size: 0.8rem; + font-size: $font-12px; height: min-content; &:not(:last-child) { diff --git a/res/css/views/elements/_ImageView.scss b/res/css/views/elements/_ImageView.scss index cc7fca67d3..0a4ed2a194 100644 --- a/res/css/views/elements/_ImageView.scss +++ b/res/css/views/elements/_ImageView.scss @@ -102,13 +102,13 @@ limitations under the License. } .mx_ImageView_name { - font-size: 1.2rem; + font-size: $font-18px; margin-bottom: 6px; word-wrap: break-word; } .mx_ImageView_metadata { - font-size: 1rem; + font-size: $font-15px; opacity: 0.5; } @@ -118,13 +118,13 @@ limitations under the License. margin-bottom: 6px; border-radius: 5px; background-color: $lightbox-bg-color; - font-size: 0.933rem; + font-size: $font-14px; padding: 9px; border: 1px solid $lightbox-border-color; } .mx_ImageView_size { - font-size: 0.733rem; + font-size: $font-11px; } .mx_ImageView_link { @@ -133,7 +133,7 @@ limitations under the License. } .mx_ImageView_button { - font-size: 1rem; + font-size: $font-15px; opacity: 0.5; margin-top: 18px; cursor: pointer; diff --git a/res/css/views/elements/_InteractiveTooltip.scss b/res/css/views/elements/_InteractiveTooltip.scss index 07441ef85d..db98d95709 100644 --- a/res/css/views/elements/_InteractiveTooltip.scss +++ b/res/css/views/elements/_InteractiveTooltip.scss @@ -24,7 +24,7 @@ limitations under the License. background-color: $interactive-tooltip-bg-color; color: $interactive-tooltip-fg-color; position: absolute; - font-size: 0.667rem; + font-size: $font-10px; font-weight: 600; padding: 6px; z-index: 5001; diff --git a/res/css/views/elements/_RichText.scss b/res/css/views/elements/_RichText.scss index d821f52e3d..e3f88cc779 100644 --- a/res/css/views/elements/_RichText.scss +++ b/res/css/views/elements/_RichText.scss @@ -9,7 +9,7 @@ border-radius: 16px; display: inline-block; height: 20px; - line-height: 1.333rem; + line-height: $font-20px; padding-left: 5px; } diff --git a/res/css/views/elements/_Tooltip.scss b/res/css/views/elements/_Tooltip.scss index 61762ced92..73ac9b3558 100644 --- a/res/css/views/elements/_Tooltip.scss +++ b/res/css/views/elements/_Tooltip.scss @@ -58,8 +58,8 @@ limitations under the License. z-index: 4000; // Higher than dialogs so tooltips can be used in dialogs padding: 10px; pointer-events: none; - line-height: 0.933rem; - font-size: 0.8rem; + line-height: $font-14px; + font-size: $font-12px; font-weight: 600; color: $primary-fg-color; max-width: 200px; @@ -82,7 +82,7 @@ limitations under the License. text-align: center; border: none; border-radius: 3px; - font-size: 0.933rem; + font-size: $font-14px; line-height: 1.2; padding: 6px 8px; diff --git a/res/css/views/elements/_TooltipButton.scss b/res/css/views/elements/_TooltipButton.scss index c350fc22e2..0c85dac818 100644 --- a/res/css/views/elements/_TooltipButton.scss +++ b/res/css/views/elements/_TooltipButton.scss @@ -28,7 +28,7 @@ limitations under the License. transition: opacity 0.2s ease-in; opacity: 0.6; - line-height: 0.733rem; + line-height: $font-11px; text-align: center; cursor: pointer; @@ -47,6 +47,6 @@ limitations under the License. .mx_TooltipButton_helpText { width: 400px; text-align: start; - line-height: 1.133rem !important; + line-height: 17px !important; } diff --git a/res/css/views/emojipicker/_EmojiPicker.scss b/res/css/views/emojipicker/_EmojiPicker.scss index 64b27b9ab3..24561eeeb9 100644 --- a/res/css/views/emojipicker/_EmojiPicker.scss +++ b/res/css/views/emojipicker/_EmojiPicker.scss @@ -163,7 +163,7 @@ limitations under the License. .mx_EmojiPicker_item { display: inline-block; - font-size: 1.333rem; + font-size: $font-20px; padding: 5px; width: 100%; height: 100%; @@ -183,7 +183,7 @@ limitations under the License. } .mx_EmojiPicker_category_label, .mx_EmojiPicker_preview_name { - font-size: 1.067rem; + font-size: $font-16px; font-weight: 600; margin: 0; } @@ -197,7 +197,7 @@ limitations under the License. } .mx_EmojiPicker_preview_emoji { - font-size: 2.133rem; + font-size: $font-32px; padding: 8px 16px; } @@ -212,7 +212,7 @@ limitations under the License. .mx_EmojiPicker_shortcode { color: $light-fg-color; - font-size: 0.933rem; + font-size: $font-14px; &::before, &::after { content: ":"; diff --git a/res/css/views/messages/_DateSeparator.scss b/res/css/views/messages/_DateSeparator.scss index b02e72814f..867f58d860 100644 --- a/res/css/views/messages/_DateSeparator.scss +++ b/res/css/views/messages/_DateSeparator.scss @@ -19,7 +19,7 @@ limitations under the License. margin: 4px 0; display: flex; align-items: center; - font-size: 0.933rem; + font-size: $font-14px; color: $roomtopic-color; } diff --git a/res/css/views/messages/_MessageActionBar.scss b/res/css/views/messages/_MessageActionBar.scss index 66ba0b227d..9f3971ecf0 100644 --- a/res/css/views/messages/_MessageActionBar.scss +++ b/res/css/views/messages/_MessageActionBar.scss @@ -21,7 +21,7 @@ limitations under the License. cursor: pointer; display: flex; height: 24px; - line-height: 1.600rem; + line-height: $font-24px; border-radius: 4px; background: $message-action-bar-bg-color; top: -18px; diff --git a/res/css/views/messages/_MessageTimestamp.scss b/res/css/views/messages/_MessageTimestamp.scss index 3a2a8d6336..f8d91cc083 100644 --- a/res/css/views/messages/_MessageTimestamp.scss +++ b/res/css/views/messages/_MessageTimestamp.scss @@ -16,5 +16,5 @@ limitations under the License. .mx_MessageTimestamp { color: $event-timestamp-color; - font-size: 0.667rem; + font-size: $font-10px; } diff --git a/res/css/views/messages/_ReactionsRow.scss b/res/css/views/messages/_ReactionsRow.scss index ee816e0fc0..2f5695e1fb 100644 --- a/res/css/views/messages/_ReactionsRow.scss +++ b/res/css/views/messages/_ReactionsRow.scss @@ -21,7 +21,7 @@ limitations under the License. .mx_ReactionsRow_showAll { text-decoration: none; - font-size: 0.667rem; + font-size: $font-10px; font-weight: 600; margin-left: 6px; vertical-align: top; diff --git a/res/css/views/messages/_ReactionsRowButton.scss b/res/css/views/messages/_ReactionsRowButton.scss index 7160c223be..941153ca5b 100644 --- a/res/css/views/messages/_ReactionsRowButton.scss +++ b/res/css/views/messages/_ReactionsRowButton.scss @@ -17,7 +17,7 @@ limitations under the License. .mx_ReactionsRowButton { display: inline-flex; height: 20px; - line-height: 1.400rem; + line-height: $font-21px; margin-right: 6px; padding: 0 6px; border: 1px solid $reaction-row-button-border-color; diff --git a/res/css/views/messages/_ViewSourceEvent.scss b/res/css/views/messages/_ViewSourceEvent.scss index 088b66445d..076932ee97 100644 --- a/res/css/views/messages/_ViewSourceEvent.scss +++ b/res/css/views/messages/_ViewSourceEvent.scss @@ -17,7 +17,7 @@ limitations under the License. .mx_EventTile_content.mx_ViewSourceEvent { display: flex; opacity: 0.6; - font-size: 0.8rem; + font-size: $font-12px; pre, code { flex: 1; diff --git a/res/css/views/messages/_common_CryptoEvent.scss b/res/css/views/messages/_common_CryptoEvent.scss index c9499b763f..637d25d7a1 100644 --- a/res/css/views/messages/_common_CryptoEvent.scss +++ b/res/css/views/messages/_common_CryptoEvent.scss @@ -45,7 +45,7 @@ limitations under the License. .mx_cryptoEvent_title { font-weight: 600; - font-size: 1rem; + font-size: $font-15px; grid-column: 2; grid-row: 1; } @@ -56,7 +56,7 @@ limitations under the License. } .mx_cryptoEvent_state, .mx_cryptoEvent_subtitle { - font-size: 0.8rem; + font-size: $font-12px; } .mx_cryptoEvent_state, .mx_cryptoEvent_buttons { diff --git a/res/css/views/right_panel/_UserInfo.scss b/res/css/views/right_panel/_UserInfo.scss index acc5e4641f..b45858e491 100644 --- a/res/css/views/right_panel/_UserInfo.scss +++ b/res/css/views/right_panel/_UserInfo.scss @@ -20,7 +20,7 @@ limitations under the License. flex-direction: column; flex: 1; overflow-y: auto; - font-size: 0.8rem; + font-size: $font-12px; .mx_UserInfo_cancel { cursor: pointer; @@ -43,7 +43,7 @@ limitations under the License. } h2 { - font-size: 1.2rem; + font-size: $font-18px; font-weight: 600; margin: 18px 0 0 0; } @@ -109,7 +109,7 @@ limitations under the License. justify-content: center; // override the calculated sizes so that the letter isn't HUGE - font-size: 3.733rem !important; + font-size: 56px !important; width: 100% !important; transition: font-size 0.5s; } @@ -122,7 +122,7 @@ limitations under the License. text-transform: uppercase; color: $notice-secondary-color; font-weight: bold; - font-size: 0.8rem; + font-size: $font-12px; margin: 4px 0; } @@ -134,8 +134,8 @@ limitations under the License. text-align: center; h2 { - font-size: 1.2rem; - line-height: 1.667rem; + font-size: $font-18px; + line-height: $font-25px; flex: 1; justify-content: center; align-items: center; @@ -197,7 +197,7 @@ limitations under the License. .mx_UserInfo_field { cursor: pointer; color: $accent-color; - line-height: 1.067rem; + line-height: $font-16px; margin: 8px 0; &.mx_UserInfo_destructive { @@ -206,7 +206,7 @@ limitations under the License. } .mx_UserInfo_statusMessage { - font-size: 0.733rem; + font-size: $font-11px; opacity: 0.5; overflow: hidden; white-space: nowrap; @@ -282,6 +282,6 @@ limitations under the License. } .mx_UserInfo_avatar .mx_BaseAvatar_initial { - font-size: 2.667rem !important; // override the other override because here the avatar is smaller + font-size: 40px !important; // override the other override because here the avatar is smaller } } diff --git a/res/css/views/right_panel/_VerificationPanel.scss b/res/css/views/right_panel/_VerificationPanel.scss index 4a10dcbbcd..6165420275 100644 --- a/res/css/views/right_panel/_VerificationPanel.scss +++ b/res/css/views/right_panel/_VerificationPanel.scss @@ -95,7 +95,7 @@ limitations under the License. } .mx_VerificationPanel_QRPhase_helpText { - font-size: 0.933rem; + font-size: $font-14px; margin-top: 71px; text-align: center; } diff --git a/res/css/views/rooms/_AppsDrawer.scss b/res/css/views/rooms/_AppsDrawer.scss index 171cf49ba5..1b1bab67bc 100644 --- a/res/css/views/rooms/_AppsDrawer.scss +++ b/res/css/views/rooms/_AppsDrawer.scss @@ -46,7 +46,7 @@ $AppsDrawerBodyHeight: 273px; padding: 0; margin: 5px auto 5px auto; color: $accent-color; - font-size: 0.8rem; + font-size: $font-12px; } .mx_AddWidget_button_full_width { @@ -59,7 +59,7 @@ $AppsDrawerBodyHeight: 273px; padding: 9px; color: $primary-hairline-color; background-color: $primary-bg-color; - font-size: 1rem; + font-size: $font-15px; } .mx_AppTile { @@ -102,7 +102,7 @@ $AppsDrawerBodyHeight: 273px; .mx_AppTileMenuBar { margin: 0; - font-size: 0.8rem; + font-size: $font-12px; background-color: $widget-menu-bar-bg-color; display: flex; flex-direction: row; @@ -272,7 +272,7 @@ form.mx_Custom_Widget_Form div { flex-direction: column; justify-content: center; align-items: center; - font-size: 1.067rem; + font-size: $font-16px; } .mx_AppPermissionWarning_row { @@ -280,7 +280,7 @@ form.mx_Custom_Widget_Form div { } .mx_AppPermissionWarning_smallText { - font-size: 0.8rem; + font-size: $font-12px; } .mx_AppPermissionWarning_bolder { diff --git a/res/css/views/rooms/_BasicMessageComposer.scss b/res/css/views/rooms/_BasicMessageComposer.scss index c1f9663ea3..cc76623a8c 100644 --- a/res/css/views/rooms/_BasicMessageComposer.scss +++ b/res/css/views/rooms/_BasicMessageComposer.scss @@ -63,8 +63,8 @@ limitations under the License. border-radius: 8px; text-align: center; font-weight: normal; - line-height: 1.067rem; - font-size: 0.667rem; + line-height: $font-16px; + font-size: $font-10-4px; } } } diff --git a/res/css/views/rooms/_EntityTile.scss b/res/css/views/rooms/_EntityTile.scss index d66e4efe5c..966d2c4e70 100644 --- a/res/css/views/rooms/_EntityTile.scss +++ b/res/css/views/rooms/_EntityTile.scss @@ -78,7 +78,7 @@ limitations under the License. .mx_GroupRoomTile_name { flex: 1 1 0; overflow: hidden; - font-size: 0.933rem; + font-size: $font-14px; text-overflow: ellipsis; white-space: nowrap; } @@ -116,7 +116,7 @@ limitations under the License. } .mx_EntityTile_subtext { - font-size: 0.733rem; + font-size: $font-11px; opacity: 0.5; overflow: hidden; white-space: nowrap; @@ -125,7 +125,7 @@ limitations under the License. .mx_EntityTile_power { padding-inline-start: 6px; - font-size: 0.667rem; + font-size: $font-10px; color: $notice-secondary-color; max-width: 6em; overflow: hidden; diff --git a/res/css/views/rooms/_EventTile.scss b/res/css/views/rooms/_EventTile.scss index 436b158644..9d798dcb20 100644 --- a/res/css/views/rooms/_EventTile.scss +++ b/res/css/views/rooms/_EventTile.scss @@ -19,7 +19,7 @@ limitations under the License. max-width: 100%; clear: both; padding-top: 18px; - font-size: 0.933rem; + font-size: $font-14px; position: relative; } @@ -64,7 +64,7 @@ limitations under the License. .mx_EventTile .mx_SenderProfile { color: $primary-fg-color; - font-size: 0.933rem; + font-size: $font-14px; display: inline-block; /* anti-zalgo, with overflow hidden */ overflow: hidden; cursor: pointer; @@ -72,7 +72,7 @@ limitations under the License. padding-bottom: 0px; padding-top: 0px; margin: 0px; - line-height: 1.133rem; + line-height: $font-17px; /* the next three lines, along with overflow hidden, truncate long display names */ white-space: nowrap; text-overflow: ellipsis; @@ -117,7 +117,7 @@ limitations under the License. padding-bottom: 2px; border-radius: 4px; min-height: 24px; - line-height: 1.467rem; + line-height: $font-22px; } .mx_RoomView_timeline_rr_enabled { @@ -152,8 +152,8 @@ limitations under the License. /* HACK to override line-height which is already marked important elsewhere */ .mx_EventTile_bigEmoji.mx_EventTile_bigEmoji { - font-size: 3.200rem !important; - line-height: 3.800rem !important; + font-size: 48px !important; + line-height: 57px !important; } .mx_MessagePanel_alwaysShowTimestamps .mx_MessageTimestamp { @@ -312,7 +312,7 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody { .mx_EventTile_readAvatarRemainder { color: $event-timestamp-color; - font-size: 0.733rem; + font-size: $font-11px; position: absolute; } @@ -341,7 +341,7 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody { .mx_EventTile_spoiler_reason { color: $event-timestamp-color; - font-size: 0.733rem; + font-size: $font-11px; } .mx_EventTile_spoiler_content { @@ -393,7 +393,7 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody { } .mx_EventTile_keyRequestInfo { - font-size: 0.8rem; + font-size: $font-12px; } .mx_EventTile_keyRequestInfo_text { @@ -471,7 +471,7 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody { .mx_EventTile_content .mx_EventTile_edited { user-select: none; - font-size: 0.8rem; + font-size: $font-12px; color: $roomtopic-color; display: inline-block; margin-left: 9px; @@ -489,7 +489,7 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody { white-space: normal !important; line-height: inherit !important; color: inherit; // inherit the colour from the dark or light theme by default (but not for code blocks) - font-size: 0.933rem; + font-size: $font-14px; pre, code { font-family: $monospace-font-family !important; @@ -589,9 +589,9 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody { .mx_EventTile.mx_EventTile_info { // same as the padding for non-compact .mx_EventTile.mx_EventTile_info padding-top: 0px; - font-size: 0.867rem; + font-size: $font-13px; .mx_EventTile_line, .mx_EventTile_reply { - line-height: 1.333rem; + line-height: $font-20px; } .mx_EventTile_avatar { top: 4px; @@ -599,7 +599,7 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody { } .mx_EventTile .mx_SenderProfile { - font-size: 0.867rem; + font-size: $font-13px; } .mx_EventTile.mx_EventTile_emote { diff --git a/res/css/views/rooms/_JumpToBottomButton.scss b/res/css/views/rooms/_JumpToBottomButton.scss index 2c44eed1b8..63cf574596 100644 --- a/res/css/views/rooms/_JumpToBottomButton.scss +++ b/res/css/views/rooms/_JumpToBottomButton.scss @@ -34,8 +34,8 @@ limitations under the License. top: -12px; border-radius: 16px; font-weight: bold; - font-size: 0.8rem; - line-height: 0.933rem; + font-size: $font-12px; + line-height: $font-14px; text-align: center; // to be able to get it centered // with text-align in parent diff --git a/res/css/views/rooms/_MemberDeviceInfo.scss b/res/css/views/rooms/_MemberDeviceInfo.scss index fe5a4b7659..71b05a93fc 100644 --- a/res/css/views/rooms/_MemberDeviceInfo.scss +++ b/res/css/views/rooms/_MemberDeviceInfo.scss @@ -59,7 +59,7 @@ limitations under the License. .mx_MemberDeviceInfo_deviceId { word-break: break-word; - font-size: 0.867rem; + font-size: $font-13px; } .mx_MemberDeviceInfo_deviceInfo { diff --git a/res/css/views/rooms/_MemberInfo.scss b/res/css/views/rooms/_MemberInfo.scss index d4c8fbb097..fb082843f1 100644 --- a/res/css/views/rooms/_MemberInfo.scss +++ b/res/css/views/rooms/_MemberInfo.scss @@ -48,7 +48,7 @@ limitations under the License. } .mx_MemberInfo h2 { - font-size: 1.2rem; + font-size: $font-18px; font-weight: 600; margin: 16px 0 16px 15px; } @@ -94,12 +94,12 @@ limitations under the License. text-transform: uppercase; color: $input-darker-fg-color; font-weight: bold; - font-size: 0.8rem; + font-size: $font-12px; margin: 4px 0; } .mx_MemberInfo_profileField { - font-size: 1rem; + font-size: $font-15px; position: relative; } @@ -109,10 +109,10 @@ limitations under the License. .mx_MemberInfo_field { cursor: pointer; - font-size: 1rem; + font-size: $font-15px; color: $primary-fg-color; margin-left: 8px; - line-height: 1.533rem; + line-height: $font-23px; } .mx_MemberInfo_createRoom { @@ -128,7 +128,7 @@ limitations under the License. } .mx_MemberInfo label { - font-size: 0.867rem; + font-size: $font-13px; } .mx_MemberInfo label .mx_MemberInfo_label_text { @@ -144,7 +144,7 @@ limitations under the License. } .mx_MemberInfo_statusMessage { - font-size: 0.733rem; + font-size: $font-11px; opacity: 0.5; overflow: hidden; white-space: nowrap; diff --git a/res/css/views/rooms/_MemberList.scss b/res/css/views/rooms/_MemberList.scss index 0f676645a9..99dc2338d4 100644 --- a/res/css/views/rooms/_MemberList.scss +++ b/res/css/views/rooms/_MemberList.scss @@ -30,7 +30,7 @@ limitations under the License. text-transform: uppercase; color: $h3-color; font-weight: 600; - font-size: 0.867rem; + font-size: $font-13px; padding-left: 3px; padding-right: 12px; margin-top: 8px; diff --git a/res/css/views/rooms/_MessageComposer.scss b/res/css/views/rooms/_MessageComposer.scss index 3777acf423..7b223be3a4 100644 --- a/res/css/views/rooms/_MessageComposer.scss +++ b/res/css/views/rooms/_MessageComposer.scss @@ -105,7 +105,7 @@ limitations under the License. min-height: 60px; justify-content: flex-start; align-items: flex-start; - font-size: 0.933rem; + font-size: $font-14px; margin-right: 6px; } @@ -161,7 +161,7 @@ limitations under the License. box-shadow: none; color: $primary-fg-color; background-color: $primary-bg-color; - font-size: 0.933rem; + font-size: $font-14px; max-height: 120px; overflow: auto; /* needed for FF */ @@ -242,7 +242,7 @@ limitations under the License. flex-direction: row; align-items: center; - font-size: 0.667rem; + font-size: $font-10px; color: $greyed-fg-color; } diff --git a/res/css/views/rooms/_MessageComposerFormatBar.scss b/res/css/views/rooms/_MessageComposerFormatBar.scss index 0558cd48cf..27ee7b9795 100644 --- a/res/css/views/rooms/_MessageComposerFormatBar.scss +++ b/res/css/views/rooms/_MessageComposerFormatBar.scss @@ -97,13 +97,13 @@ limitations under the License. .mx_MessageComposerFormatBar_buttonTooltip { white-space: nowrap; - font-size: 0.867rem; + font-size: $font-13px; font-weight: 600; min-width: 54px; text-align: center; .mx_MessageComposerFormatBar_tooltipShortcut { - font-size: 0.600rem; + font-size: $font-9px; opacity: 0.7; } } diff --git a/res/css/views/rooms/_PresenceLabel.scss b/res/css/views/rooms/_PresenceLabel.scss index 6d044a69b5..5be83c77d7 100644 --- a/res/css/views/rooms/_PresenceLabel.scss +++ b/res/css/views/rooms/_PresenceLabel.scss @@ -15,6 +15,6 @@ limitations under the License. */ .mx_PresenceLabel { - font-size: 0.733rem; + font-size: $font-11px; opacity: 0.5; } diff --git a/res/css/views/rooms/_RoomDropTarget.scss b/res/css/views/rooms/_RoomDropTarget.scss index 1ae8f73e88..2e8145c2c9 100644 --- a/res/css/views/rooms/_RoomDropTarget.scss +++ b/res/css/views/rooms/_RoomDropTarget.scss @@ -28,7 +28,7 @@ limitations under the License. } .mx_RoomDropTarget { - font-size: 0.867rem; + font-size: $font-13px; padding-top: 5px; padding-bottom: 5px; border: 1px dashed $accent-color; @@ -41,7 +41,7 @@ limitations under the License. .mx_RoomDropTarget_label { position: relative; margin-top: 3px; - line-height: 1.400rem; + line-height: $font-21px; z-index: 1; text-align: center; } diff --git a/res/css/views/rooms/_RoomHeader.scss b/res/css/views/rooms/_RoomHeader.scss index 1737014248..969106c9ea 100644 --- a/res/css/views/rooms/_RoomHeader.scss +++ b/res/css/views/rooms/_RoomHeader.scss @@ -77,9 +77,9 @@ limitations under the License. } .mx_RoomHeader_simpleHeader { - line-height: 3.467rem; + line-height: $font-52px; color: $roomheader-color; - font-size: 1.2rem; + font-size: $font-18px; font-weight: 600; overflow: hidden; margin-left: 63px; @@ -102,7 +102,7 @@ limitations under the License. overflow: hidden; color: $roomheader-color; font-weight: 600; - font-size: 1.2rem; + font-size: $font-18px; margin: 0 7px; border-bottom: 1px solid transparent; display: flex; @@ -161,7 +161,7 @@ limitations under the License. flex: 1; color: $roomtopic-color; font-weight: 400; - font-size: 0.867rem; + font-size: $font-13px; margin: 0 7px; margin-top: 4px; // to align baseline of topic with room name overflow: hidden; diff --git a/res/css/views/rooms/_RoomList.scss b/res/css/views/rooms/_RoomList.scss index b9cb2dc8e4..50a9e7ee1f 100644 --- a/res/css/views/rooms/_RoomList.scss +++ b/res/css/views/rooms/_RoomList.scss @@ -47,13 +47,13 @@ limitations under the License. } .mx_RoomList_emptySubListTip { - font-size: 0.867rem; + font-size: $font-13px; padding: 5px; border: 1px dashed $accent-color; color: $primary-fg-color; background-color: $droptarget-bg-color; border-radius: 4px; - line-height: 1.067rem; + line-height: $font-16px; } .mx_RoomList_emptySubListTip .mx_RoleButton { diff --git a/res/css/views/rooms/_RoomPreviewBar.scss b/res/css/views/rooms/_RoomPreviewBar.scss index 8e61524fda..8708f13ada 100644 --- a/res/css/views/rooms/_RoomPreviewBar.scss +++ b/res/css/views/rooms/_RoomPreviewBar.scss @@ -23,7 +23,7 @@ limitations under the License. -webkit-align-items: center; h3 { - font-size: 1.2rem; + font-size: $font-18px; font-weight: 600; &.mx_RoomPreviewBar_spinnerTitle { @@ -48,8 +48,8 @@ limitations under the License. } .mx_RoomPreviewBar_footer { - font-size: 0.8rem; - line-height: 1.333rem; + font-size: $font-12px; + line-height: $font-20px; .mx_Spinner { vertical-align: middle; diff --git a/res/css/views/rooms/_RoomTile.scss b/res/css/views/rooms/_RoomTile.scss index 57d42f6be2..7be2a4e3d4 100644 --- a/res/css/views/rooms/_RoomTile.scss +++ b/res/css/views/rooms/_RoomTile.scss @@ -64,7 +64,7 @@ limitations under the License. .mx_RoomTile_subtext { display: inline-block; - font-size: 0.733rem; + font-size: $font-11px; padding: 0 0 0 7px; margin: 0; overflow: hidden; @@ -112,7 +112,7 @@ limitations under the License. } .mx_RoomTile_name { - font-size: 0.933rem; + font-size: $font-14px; padding: 0 4px; color: $roomtile-name-color; white-space: nowrap; @@ -126,7 +126,7 @@ limitations under the License. padding: 0 0.4em; color: $roomtile-badge-fg-color; font-weight: 600; - font-size: 0.8rem; + font-size: $font-12px; } .collapsed { diff --git a/res/css/views/rooms/_SearchBar.scss b/res/css/views/rooms/_SearchBar.scss index 5b80585cef..fecc8d78d8 100644 --- a/res/css/views/rooms/_SearchBar.scss +++ b/res/css/views/rooms/_SearchBar.scss @@ -22,7 +22,7 @@ limitations under the License. .mx_SearchBar_input { // border: 1px solid $input-border-color; - // font-size: 1rem; + // font-size: $font-15px; flex: 1 1 0; margin-left: 22px; } @@ -45,7 +45,7 @@ limitations under the License. border: 0; margin: 0 0 0 22px; padding: 5px; - font-size: 1rem; + font-size: $font-15px; cursor: pointer; color: $primary-fg-color; border-bottom: 2px solid $accent-color; diff --git a/res/css/views/rooms/_SendMessageComposer.scss b/res/css/views/rooms/_SendMessageComposer.scss index 7233d373a3..0b646666e7 100644 --- a/res/css/views/rooms/_SendMessageComposer.scss +++ b/res/css/views/rooms/_SendMessageComposer.scss @@ -18,7 +18,7 @@ limitations under the License. flex: 1; display: flex; flex-direction: column; - font-size: 0.933rem; + font-size: $font-14px; justify-content: center; margin-right: 6px; // don't grow wider than available space diff --git a/res/css/views/rooms/_WhoIsTypingTile.scss b/res/css/views/rooms/_WhoIsTypingTile.scss index a1e6f3a3bf..8b135152d6 100644 --- a/res/css/views/rooms/_WhoIsTypingTile.scss +++ b/res/css/views/rooms/_WhoIsTypingTile.scss @@ -49,7 +49,7 @@ limitations under the License. border-radius: 40px; width: 24px; height: 24px; - line-height: 1.600rem; + line-height: $font-24px; font-size: 0.8em; vertical-align: top; text-align: center; @@ -57,7 +57,7 @@ limitations under the License. .mx_WhoIsTypingTile_label { flex: 1; - font-size: 0.933rem; + font-size: $font-14px; font-weight: 600; color: $eventtile-meta-color; } diff --git a/res/css/views/settings/tabs/_SettingsTab.scss b/res/css/views/settings/tabs/_SettingsTab.scss index 03bd3221cd..1fbfb35927 100644 --- a/res/css/views/settings/tabs/_SettingsTab.scss +++ b/res/css/views/settings/tabs/_SettingsTab.scss @@ -19,7 +19,7 @@ limitations under the License. } .mx_SettingsTab_heading { - font-size: 1.333rem; + font-size: $font-20px; font-weight: 600; color: $primary-fg-color; } @@ -29,7 +29,7 @@ limitations under the License. } .mx_SettingsTab_subheading { - font-size: 1.067rem; + font-size: $font-16px; display: block; font-family: $font-family; font-weight: 600; @@ -40,7 +40,7 @@ limitations under the License. .mx_SettingsTab_subsectionText { color: $settings-subsection-fg-color; - font-size: 0.933rem; + font-size: $font-14px; display: block; margin: 10px 100px 10px 0; // Align with the rest of the view } @@ -61,7 +61,7 @@ limitations under the License. .mx_SettingsTab_section .mx_SettingsFlag .mx_SettingsFlag_label { vertical-align: middle; display: inline-block; - font-size: 0.933rem; + font-size: $font-14px; color: $primary-fg-color; max-width: calc(100% - 48px); // Force word wrap instead of colliding with the switch box-sizing: border-box; diff --git a/res/css/views/terms/_InlineTermsAgreement.scss b/res/css/views/terms/_InlineTermsAgreement.scss index 1f9ea7a33d..1d0e3ea8c5 100644 --- a/res/css/views/terms/_InlineTermsAgreement.scss +++ b/res/css/views/terms/_InlineTermsAgreement.scss @@ -16,7 +16,7 @@ limitations under the License. .mx_InlineTermsAgreement_cbContainer { margin-bottom: 10px; - font-size: 0.933rem; + font-size: $font-14px; a { color: $accent-color; diff --git a/res/css/views/verification/_VerificationShowSas.scss b/res/css/views/verification/_VerificationShowSas.scss index fd83bf7ad4..6e26943640 100644 --- a/res/css/views/verification/_VerificationShowSas.scss +++ b/res/css/views/verification/_VerificationShowSas.scss @@ -48,14 +48,14 @@ limitations under the License. } .mx_VerificationShowSas_emojiSas_emoji { - font-size: 2.133rem; + font-size: $font-32px; } .mx_VerificationShowSas_emojiSas_label { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; - font-size: 0.8rem; + font-size: $font-12px; } .mx_VerificationShowSas_emojiSas_break { diff --git a/res/css/views/voip/_CallView.scss b/res/css/views/voip/_CallView.scss index 06c9f7bed6..4650f30c1d 100644 --- a/res/css/views/voip/_CallView.scss +++ b/res/css/views/voip/_CallView.scss @@ -21,5 +21,5 @@ limitations under the License. text-align: center; padding: 6px; font-weight: bold; - font-size: 0.867rem; + font-size: $font-13px; } diff --git a/res/css/views/voip/_IncomingCallbox.scss b/res/css/views/voip/_IncomingCallbox.scss index 3c8ed46639..ed33de470d 100644 --- a/res/css/views/voip/_IncomingCallbox.scss +++ b/res/css/views/voip/_IncomingCallbox.scss @@ -54,7 +54,7 @@ limitations under the License. vertical-align: middle; width: 80px; height: 36px; - line-height: 2.400rem; + line-height: $font-36px; border-radius: 36px; color: $accent-fg-color; margin: auto; diff --git a/res/themes/dark-custom/css/dark-custom.scss b/res/themes/dark-custom/css/dark-custom.scss index aff647ce26..03ceef45c6 100644 --- a/res/themes/dark-custom/css/dark-custom.scss +++ b/res/themes/dark-custom/css/dark-custom.scss @@ -1,3 +1,4 @@ +@import "../../../../res/css/_font-sizes.scss"; @import "../../light/css/_paths.scss"; @import "../../light/css/_fonts.scss"; @import "../../light/css/_light.scss"; diff --git a/res/themes/dark/css/_dark.scss b/res/themes/dark/css/_dark.scss index 1f11fd5620..5d6ba033c8 100644 --- a/res/themes/dark/css/_dark.scss +++ b/res/themes/dark/css/_dark.scss @@ -185,7 +185,7 @@ $user-tile-hover-bg-color: $header-panel-bg-color; border: 0px; border-radius: 4px; font-family: $font-family; - font-size: 0.933rem; + font-size: $font-14px; color: $button-fg-color; background-color: $button-bg-color; width: auto; diff --git a/res/themes/dark/css/dark.scss b/res/themes/dark/css/dark.scss index e7ae7c8cf8..d81db4595f 100644 --- a/res/themes/dark/css/dark.scss +++ b/res/themes/dark/css/dark.scss @@ -1,3 +1,4 @@ +@import "../../../../res/css/_font-sizes.scss"; @import "../../light/css/_paths.scss"; @import "../../light/css/_fonts.scss"; @import "../../light/css/_light.scss"; diff --git a/res/themes/light-custom/css/light-custom.scss b/res/themes/light-custom/css/light-custom.scss index 278ca5f0b1..4f80647eba 100644 --- a/res/themes/light-custom/css/light-custom.scss +++ b/res/themes/light-custom/css/light-custom.scss @@ -1,3 +1,4 @@ +@import "../../../../res/css/_font-sizes.scss"; @import "../../light/css/_paths.scss"; @import "../../light/css/_fonts.scss"; @import "../../light/css/_light.scss"; diff --git a/res/themes/light/css/_light.scss b/res/themes/light/css/_light.scss index 2a993a7934..f5f3013354 100644 --- a/res/themes/light/css/_light.scss +++ b/res/themes/light/css/_light.scss @@ -310,7 +310,7 @@ $user-tile-hover-bg-color: $header-panel-bg-color; border: 0px; border-radius: 4px; font-family: $font-family; - font-size: 0.933rem; + font-size: $font-14px; color: $button-fg-color; background-color: $button-bg-color; width: auto; @@ -331,7 +331,7 @@ $user-tile-hover-bg-color: $header-panel-bg-color; @define-mixin mx_DialogButton_small { @mixin mx_DialogButton; - font-size: 1rem; + font-size: $font-15px; padding: 0px 1.5em 0px 1.5em; } diff --git a/res/themes/light/css/light.scss b/res/themes/light/css/light.scss index 6acb2d9d94..4f48557648 100644 --- a/res/themes/light/css/light.scss +++ b/res/themes/light/css/light.scss @@ -1,3 +1,4 @@ +@import "../../../../res/css/_font-sizes.scss"; @import "_paths.scss"; @import "_fonts.scss"; @import "_light.scss"; From e2685b1cf0c1300af3fe794eb76379f610f8adb3 Mon Sep 17 00:00:00 2001 From: Jorik Schellekens Date: Tue, 31 Mar 2020 15:29:40 +0100 Subject: [PATCH 0067/2751] Licensing info --- res/css/_font-sizes.scss | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/res/css/_font-sizes.scss b/res/css/_font-sizes.scss index 6baf11e9d6..be6d43d3a8 100644 --- a/res/css/_font-sizes.scss +++ b/res/css/_font-sizes.scss @@ -1,3 +1,19 @@ +/* +Copyright 2020 New Vector Ltd + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + $font-8px: 0.533rem; $font-9px: 0.600rem; $font-10px: 0.667rem; From 4a9bc5e5bf46fe93e5f050aac9c10256c22bd7f7 Mon Sep 17 00:00:00 2001 From: Travis Ralston Date: Tue, 31 Mar 2020 08:29:42 -0600 Subject: [PATCH 0068/2751] Update src/components/views/auth/InteractiveAuthEntryComponents.js Co-Authored-By: David Baker --- src/components/views/auth/InteractiveAuthEntryComponents.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/views/auth/InteractiveAuthEntryComponents.js b/src/components/views/auth/InteractiveAuthEntryComponents.js index a59b1354b6..14a8791cda 100644 --- a/src/components/views/auth/InteractiveAuthEntryComponents.js +++ b/src/components/views/auth/InteractiveAuthEntryComponents.js @@ -639,7 +639,7 @@ export class SSOAuthEntry extends React.Component { onStartAuthClick = () => { // Note: We don't use PlatformPeg's startSsoAuth functions because we almost - // certainly will need to open the thing in a new tab to avoid loosing application + // certainly will need to open the thing in a new tab to avoid losing application // context. window.open(this.state.ssoUrl, '_blank'); From dcd75a801ebfd7934677d4ab51d0d56aa5982419 Mon Sep 17 00:00:00 2001 From: random Date: Tue, 31 Mar 2020 14:33:01 +0000 Subject: [PATCH 0069/2751] Translated using Weblate (Italian) Currently translated at 100.0% (2244 of 2244 strings) Translation: Riot Web/matrix-react-sdk Translate-URL: https://translate.riot.im/projects/riot-web/matrix-react-sdk/it/ --- src/i18n/strings/it.json | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/i18n/strings/it.json b/src/i18n/strings/it.json index f3aed44b05..628c857d6e 100644 --- a/src/i18n/strings/it.json +++ b/src/i18n/strings/it.json @@ -2304,5 +2304,7 @@ "Verified": "Verificato", "Verification cancelled": "Verifica annullata", "Compare emoji": "Confronta emoji", - "Cancel replying to a message": "Annulla la risposta a un messaggio" + "Cancel replying to a message": "Annulla la risposta a un messaggio", + "Sends a message as html, without interpreting it as markdown": "Invia un messaggio come html, senza interpretarlo come markdown", + "Sign in with SSO": "Accedi con SSO" } From eb901441cdda2c77c5cc377892ddc348b9cb3dc5 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Tue, 31 Mar 2020 16:14:18 +0100 Subject: [PATCH 0070/2751] Fix alignment of e2e icon in userinfo and expose full displayname in title Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- res/css/views/right_panel/_UserInfo.scss | 23 +++++++++++--------- src/components/views/right_panel/UserInfo.js | 6 +++-- 2 files changed, 17 insertions(+), 12 deletions(-) diff --git a/res/css/views/right_panel/_UserInfo.scss b/res/css/views/right_panel/_UserInfo.scss index 0e4b1bda9e..d2753f5825 100644 --- a/res/css/views/right_panel/_UserInfo.scss +++ b/res/css/views/right_panel/_UserInfo.scss @@ -134,24 +134,27 @@ limitations under the License. text-align: center; h2 { + display: flex; font-size: 18px; line-height: 25px; flex: 1; justify-content: center; - align-items: center; - // limit to 2 lines, show an ellipsis if it overflows - // this looks webkit specific but is supported by Firefox 68+ - display: -webkit-box; - -webkit-box-orient: vertical; - -webkit-line-clamp: 2; + span { + // limit to 2 lines, show an ellipsis if it overflows + // this looks webkit specific but is supported by Firefox 68+ + display: -webkit-box; + -webkit-box-orient: vertical; + -webkit-line-clamp: 2; - overflow: hidden; - word-break: break-all; - text-overflow: ellipsis; + overflow: hidden; + word-break: break-all; + text-overflow: ellipsis; + } .mx_E2EIcon { - margin: 5px; + margin: 4px 4px 4px 0; // no left-margin to improve visual centering + min-width: 18px; // convince flexbox to not collapse it } } diff --git a/src/components/views/right_panel/UserInfo.js b/src/components/views/right_panel/UserInfo.js index a2081dc9e4..82e410b361 100644 --- a/src/components/views/right_panel/UserInfo.js +++ b/src/components/views/right_panel/UserInfo.js @@ -1444,9 +1444,11 @@ const UserInfoHeader = ({onClose, member, e2eStatus}) => {
-

+

{ e2eIcon } - { displayName } + + { displayName } +

{ member.userId }
From 64c11c35650fe37a6cbf7edb115f11383a91ef89 Mon Sep 17 00:00:00 2001 From: Travis Ralston Date: Tue, 31 Mar 2020 09:26:17 -0600 Subject: [PATCH 0071/2751] Move ssoUrl to a class property --- .../auth/InteractiveAuthEntryComponents.js | 17 ++++++++++------- 1 file changed, 10 insertions(+), 7 deletions(-) diff --git a/src/components/views/auth/InteractiveAuthEntryComponents.js b/src/components/views/auth/InteractiveAuthEntryComponents.js index 14a8791cda..4e2f444844 100644 --- a/src/components/views/auth/InteractiveAuthEntryComponents.js +++ b/src/components/views/auth/InteractiveAuthEntryComponents.js @@ -619,16 +619,19 @@ export class SSOAuthEntry extends React.Component { static PHASE_PREAUTH = 1; // button to start SSO static PHASE_POSTAUTH = 2; // button to confirm SSO completed + _ssoUrl: string; + constructor(props) { super(props); + // We actually send the user through fallback auth so we don't have to + // deal with a redirect back to us, losing application context. + this._ssoUrl = props.matrixClient.getFallbackAuthUrl( + this.props.loginType, + this.props.authSessionId, + ); + this.state = { - // We actually send the user through fallback auth so we don't have to - // deal with a redirect back to us, losing application context. - ssoUrl: props.matrixClient.getFallbackAuthUrl( - this.props.loginType, - this.props.authSessionId, - ), phase: SSOAuthEntry.PHASE_PREAUTH, }; } @@ -642,7 +645,7 @@ export class SSOAuthEntry extends React.Component { // certainly will need to open the thing in a new tab to avoid losing application // context. - window.open(this.state.ssoUrl, '_blank'); + window.open(this._ssoUrl, '_blank'); this.setState({phase: SSOAuthEntry.PHASE_POSTAUTH}); this.props.onPhaseChange(SSOAuthEntry.PHASE_POSTAUTH); }; From a0e5169b59088f91419cf829baaf540949178708 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?M=C3=A4rt=20P=C3=B5der?= Date: Tue, 31 Mar 2020 19:48:13 +0000 Subject: [PATCH 0072/2751] Added translation using Weblate (Estonian) --- src/i18n/strings/et.json | 1 + 1 file changed, 1 insertion(+) create mode 100644 src/i18n/strings/et.json diff --git a/src/i18n/strings/et.json b/src/i18n/strings/et.json new file mode 100644 index 0000000000..0967ef424b --- /dev/null +++ b/src/i18n/strings/et.json @@ -0,0 +1 @@ +{} From c86d75693bbd34513b8b431961a15272bbfe9c12 Mon Sep 17 00:00:00 2001 From: Travis Ralston Date: Tue, 31 Mar 2020 14:05:56 -0600 Subject: [PATCH 0073/2751] Fix a number of minor code quality issues Most of these are complaints from my IDE. Discovered by going through nearly every file looking for React warnings. --- .../views/dialogs/EncryptedEventDialog.js | 2 +- .../views/dialogs/eventindex/ManageEventIndexDialog.js | 10 +++------- src/components/structures/GroupView.js | 1 - src/components/structures/auth/SoftLogout.js | 2 +- src/components/views/dialogs/RoomSettingsDialog.js | 2 +- src/components/views/elements/AppTile.js | 2 +- src/components/views/elements/LanguageDropdown.js | 4 ++-- src/components/views/elements/Pill.js | 2 +- src/components/views/rooms/AppsDrawer.js | 2 +- src/components/views/rooms/RoomRecoveryReminder.js | 1 - test/components/views/rooms/RoomSettings-test.js | 2 +- 11 files changed, 12 insertions(+), 18 deletions(-) diff --git a/src/async-components/views/dialogs/EncryptedEventDialog.js b/src/async-components/views/dialogs/EncryptedEventDialog.js index b602cf60fe..3e5c74335f 100644 --- a/src/async-components/views/dialogs/EncryptedEventDialog.js +++ b/src/async-components/views/dialogs/EncryptedEventDialog.js @@ -79,7 +79,7 @@ export default createReactClass({ }, onDeviceVerificationChanged: function(userId, device) { - if (userId == this.props.event.getSender()) { + if (userId === this.props.event.getSender()) { this.refreshDevice().then((dev) => { this.setState({ device: dev }); }); diff --git a/src/async-components/views/dialogs/eventindex/ManageEventIndexDialog.js b/src/async-components/views/dialogs/eventindex/ManageEventIndexDialog.js index 3d7249b5a1..4ac9bf52a3 100644 --- a/src/async-components/views/dialogs/eventindex/ManageEventIndexDialog.js +++ b/src/async-components/views/dialogs/eventindex/ManageEventIndexDialog.js @@ -30,7 +30,7 @@ import EventIndexPeg from "../../../../indexing/EventIndexPeg"; export default class ManageEventIndexDialog extends React.Component { static propTypes = { onFinished: PropTypes.func.isRequired, - } + }; constructor(props) { super(props); @@ -126,16 +126,12 @@ export default class ManageEventIndexDialog extends React.Component { import("./DisableEventIndexDialog"), null, null, /* priority = */ false, /* static = */ true, ); - } - - _onDone = () => { - this.props.onFinished(true); - } + }; _onCrawlerSleepTimeChange = (e) => { this.setState({crawlerSleepTime: e.target.value}); SettingsStore.setValue("crawlerSleepTime", null, SettingLevel.DEVICE, e.target.value); - } + }; render() { let crawlerState; diff --git a/src/components/structures/GroupView.js b/src/components/structures/GroupView.js index 524694fe95..af205f7e1b 100644 --- a/src/components/structures/GroupView.js +++ b/src/components/structures/GroupView.js @@ -433,7 +433,6 @@ export default createReactClass({ this._matrixClient = MatrixClientPeg.get(); this._matrixClient.on("Group.myMembership", this._onGroupMyMembership); - this._changeAvatarComponent = null; this._initGroupStore(this.props.groupId, true); this._dispatcherRef = dis.register(this._onAction); diff --git a/src/components/structures/auth/SoftLogout.js b/src/components/structures/auth/SoftLogout.js index 287f7e5605..08ab7e8a61 100644 --- a/src/components/structures/auth/SoftLogout.js +++ b/src/components/structures/auth/SoftLogout.js @@ -54,7 +54,7 @@ export default class SoftLogout extends React.Component { this.state = { loginView: LOGIN_VIEW.LOADING, - keyBackupNeeded: true, // assume we do while we figure it out (see componentWillMount) + keyBackupNeeded: true, // assume we do while we figure it out (see componentDidMount) busy: false, password: "", diff --git a/src/components/views/dialogs/RoomSettingsDialog.js b/src/components/views/dialogs/RoomSettingsDialog.js index 76faf60eef..5d369862b8 100644 --- a/src/components/views/dialogs/RoomSettingsDialog.js +++ b/src/components/views/dialogs/RoomSettingsDialog.js @@ -41,7 +41,7 @@ export default class RoomSettingsDialog extends React.Component { } componentWillUnmount() { - dis.unregister(this._dispatcherRef); + if (this._dispatcherRef) dis.unregister(this._dispatcherRef); } _onAction = (payload) => { diff --git a/src/components/views/elements/AppTile.js b/src/components/views/elements/AppTile.js index 0a8bf7443b..d74d8fa485 100644 --- a/src/components/views/elements/AppTile.js +++ b/src/components/views/elements/AppTile.js @@ -161,7 +161,7 @@ export default class AppTile extends React.Component { componentWillUnmount() { // Widget action listeners - dis.unregister(this.dispatcherRef); + if (this.dispatcherRef) dis.unregister(this.dispatcherRef); // if it's not remaining on screen, get rid of the PersistedElement container if (!ActiveWidgetStore.getWidgetPersistence(this.props.id)) { diff --git a/src/components/views/elements/LanguageDropdown.js b/src/components/views/elements/LanguageDropdown.js index cb4e2e4da6..d2546644a0 100644 --- a/src/components/views/elements/LanguageDropdown.js +++ b/src/components/views/elements/LanguageDropdown.js @@ -24,8 +24,8 @@ import SettingsStore from "../../../settings/SettingsStore"; import { _t } from "../../../languageHandler"; function languageMatchesSearchQuery(query, language) { - if (language.label.toUpperCase().indexOf(query.toUpperCase()) == 0) return true; - if (language.value.toUpperCase() == query.toUpperCase()) return true; + if (language.label.toUpperCase().includes(query.toUpperCase())) return true; + if (language.value.toUpperCase() === query.toUpperCase()) return true; return false; } diff --git a/src/components/views/elements/Pill.js b/src/components/views/elements/Pill.js index 5f143a06a6..627c51967a 100644 --- a/src/components/views/elements/Pill.js +++ b/src/components/views/elements/Pill.js @@ -158,7 +158,7 @@ const Pill = createReactClass({ componentWillMount() { this._unmounted = false; this._matrixClient = MatrixClientPeg.get(); - this.componentWillReceiveProps(this.props); + this.componentWillReceiveProps(this.props); // HACK: We shouldn't be calling lifecycle functions ourselves. }, componentWillUnmount() { diff --git a/src/components/views/rooms/AppsDrawer.js b/src/components/views/rooms/AppsDrawer.js index f81a5630a4..56c7476060 100644 --- a/src/components/views/rooms/AppsDrawer.js +++ b/src/components/views/rooms/AppsDrawer.js @@ -71,7 +71,7 @@ export default createReactClass({ MatrixClientPeg.get().removeListener('RoomState.events', this.onRoomStateEvents); } WidgetEchoStore.removeListener('update', this._updateApps); - dis.unregister(this.dispatcherRef); + if (this.dispatcherRef) dis.unregister(this.dispatcherRef); }, componentWillReceiveProps(newProps) { diff --git a/src/components/views/rooms/RoomRecoveryReminder.js b/src/components/views/rooms/RoomRecoveryReminder.js index 50521cdd37..4fe1e0bc54 100644 --- a/src/components/views/rooms/RoomRecoveryReminder.js +++ b/src/components/views/rooms/RoomRecoveryReminder.js @@ -61,7 +61,6 @@ export default class RoomRecoveryReminder extends React.PureComponent { loading: false, error: e, }); - return; } } diff --git a/test/components/views/rooms/RoomSettings-test.js b/test/components/views/rooms/RoomSettings-test.js index 870d7f0aab..5e21f729d0 100644 --- a/test/components/views/rooms/RoomSettings-test.js +++ b/test/components/views/rooms/RoomSettings-test.js @@ -134,7 +134,7 @@ describe.skip('RoomSettings', () => { }); }); - // XXX: Can't test this because we `getRoomDirectoryVisibility` in `componentWillMount` + // XXX: Can't test this because we `getRoomDirectoryVisibility` in `componentDidMount` xit('should set room directory publicity when set to true', (done) => { const isRoomPublished = true; roomSettings.setState({ From 3f99332f4b985fbd23a437e2ac06e23d8d96d5d7 Mon Sep 17 00:00:00 2001 From: Travis Ralston Date: Tue, 31 Mar 2020 14:14:17 -0600 Subject: [PATCH 0074/2751] Use componentDidMount in place of componentWillMount where possible This fixes a common React warning we see. Most of these components should be using constructors instead, however componentDidMount is just as good (and doesn't require converting most of these). Conversion to classes will be done in a later stage of React warning fixes. For https://github.com/vector-im/riot-web/issues/12877 --- src/AsyncWrapper.js | 2 +- .../views/dialogs/EncryptedEventDialog.js | 2 +- .../views/dialogs/eventindex/ManageEventIndexDialog.js | 2 +- src/components/structures/CustomRoomTagPanel.js | 2 +- src/components/structures/EmbeddedPage.js | 2 +- src/components/structures/GroupView.js | 2 +- src/components/structures/LeftPanel.js | 2 +- src/components/structures/MatrixChat.js | 4 +--- src/components/structures/MyGroups.js | 2 +- src/components/structures/RightPanel.js | 2 +- src/components/structures/RoomDirectory.js | 4 +--- src/components/structures/RoomStatusBar.js | 2 +- src/components/structures/TagPanel.js | 2 +- src/components/structures/UserView.js | 2 +- src/components/structures/auth/ForgotPassword.js | 2 +- src/components/structures/auth/Login.js | 2 +- src/components/structures/auth/PostRegistration.js | 2 +- src/components/structures/auth/Registration.js | 2 +- src/components/views/auth/CountryDropdown.js | 2 +- .../views/auth/InteractiveAuthEntryComponents.js | 2 +- src/components/views/avatars/MemberStatusMessageAvatar.js | 2 +- src/components/views/context_menus/MessageContextMenu.js | 2 +- src/components/views/context_menus/RoomTileContextMenu.js | 2 +- .../views/context_menus/StatusMessageContextMenu.js | 2 +- src/components/views/dialogs/ConfirmUserActionDialog.js | 2 +- src/components/views/dialogs/RoomSettingsDialog.js | 2 +- src/components/views/dialogs/RoomUpgradeDialog.js | 2 +- src/components/views/dialogs/SetPasswordDialog.js | 4 ++-- src/components/views/dialogs/ShareDialog.js | 2 +- src/components/views/dialogs/UnknownDeviceDialog.js | 2 +- src/components/views/elements/AppTile.js | 4 +--- src/components/views/elements/DeviceVerifyButtons.js | 2 +- src/components/views/elements/EditableTextContainer.js | 2 +- src/components/views/elements/LanguageDropdown.js | 2 +- src/components/views/elements/PersistentApp.js | 2 +- src/components/views/elements/Pill.js | 2 +- src/components/views/elements/PowerSelector.js | 2 +- src/components/views/elements/ReplyThread.js | 2 +- src/components/views/elements/TintableSvg.js | 6 ++---- src/components/views/groups/GroupMemberInfo.js | 2 +- src/components/views/groups/GroupMemberList.js | 2 +- src/components/views/groups/GroupPublicityToggle.js | 2 +- src/components/views/groups/GroupRoomInfo.js | 2 +- src/components/views/groups/GroupRoomList.js | 2 +- src/components/views/groups/GroupTile.js | 2 +- src/components/views/groups/GroupUserSettings.js | 2 +- src/components/views/messages/MImageBody.js | 8 +++----- src/components/views/messages/SenderProfile.js | 2 +- src/components/views/right_panel/HeaderButtons.js | 2 +- src/components/views/rooms/AppsDrawer.js | 5 +---- src/components/views/rooms/EditMessageComposer.js | 2 +- src/components/views/rooms/ForwardMessage.js | 4 +--- src/components/views/rooms/MemberInfo.js | 4 +--- src/components/views/rooms/MemberList.js | 2 +- src/components/views/rooms/RoomBreadcrumbs.js | 2 +- src/components/views/rooms/RoomNameEditor.js | 2 +- src/components/views/rooms/RoomPreviewBar.js | 2 +- src/components/views/rooms/RoomRecoveryReminder.js | 2 +- src/components/views/rooms/RoomTopicEditor.js | 2 +- src/components/views/rooms/RoomUpgradeWarningBar.js | 2 +- src/components/views/rooms/ThirdPartyMemberInfo.js | 2 +- src/components/views/rooms/WhoIsTypingTile.js | 2 +- src/components/views/settings/ChangeAvatar.js | 2 +- src/components/views/settings/ChangePassword.js | 2 +- src/components/views/settings/EventIndexPanel.js | 2 +- src/components/views/settings/KeyBackupPanel.js | 2 +- src/components/views/settings/Notifications.js | 2 +- .../views/settings/tabs/user/HelpUserSettingsTab.js | 2 +- .../settings/tabs/user/PreferencesUserSettingsTab.js | 2 +- src/components/views/voip/CallPreview.js | 2 +- 70 files changed, 74 insertions(+), 91 deletions(-) diff --git a/src/AsyncWrapper.js b/src/AsyncWrapper.js index b7b81688e1..05054cf63a 100644 --- a/src/AsyncWrapper.js +++ b/src/AsyncWrapper.js @@ -38,7 +38,7 @@ export default createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { this._unmounted = false; // XXX: temporary logging to try to diagnose // https://github.com/vector-im/riot-web/issues/3148 diff --git a/src/async-components/views/dialogs/EncryptedEventDialog.js b/src/async-components/views/dialogs/EncryptedEventDialog.js index b602cf60fe..1aed623010 100644 --- a/src/async-components/views/dialogs/EncryptedEventDialog.js +++ b/src/async-components/views/dialogs/EncryptedEventDialog.js @@ -37,7 +37,7 @@ export default createReactClass({ return { device: null }; }, - componentWillMount: function() { + componentDidMount: function() { this._unmounted = false; const client = MatrixClientPeg.get(); diff --git a/src/async-components/views/dialogs/eventindex/ManageEventIndexDialog.js b/src/async-components/views/dialogs/eventindex/ManageEventIndexDialog.js index 3d7249b5a1..ef4f2672d4 100644 --- a/src/async-components/views/dialogs/eventindex/ManageEventIndexDialog.js +++ b/src/async-components/views/dialogs/eventindex/ManageEventIndexDialog.js @@ -82,7 +82,7 @@ export default class ManageEventIndexDialog extends React.Component { } } - async componentWillMount(): void { + async componentDidMount(): void { let eventIndexSize = 0; let crawlingRoomsCount = 0; let roomCount = 0; diff --git a/src/components/structures/CustomRoomTagPanel.js b/src/components/structures/CustomRoomTagPanel.js index e8ff6e814e..6e392ea505 100644 --- a/src/components/structures/CustomRoomTagPanel.js +++ b/src/components/structures/CustomRoomTagPanel.js @@ -30,7 +30,7 @@ class CustomRoomTagPanel extends React.Component { }; } - componentWillMount() { + componentDidMount() { this._tagStoreToken = CustomRoomTagStore.addListener(() => { this.setState({tags: CustomRoomTagStore.getSortedTags()}); }); diff --git a/src/components/structures/EmbeddedPage.js b/src/components/structures/EmbeddedPage.js index a0a95ac6f1..0aababf030 100644 --- a/src/components/structures/EmbeddedPage.js +++ b/src/components/structures/EmbeddedPage.js @@ -58,7 +58,7 @@ export default class EmbeddedPage extends React.PureComponent { return sanitizeHtml(_t(s)); } - componentWillMount() { + componentDidMount() { this._unmounted = false; if (!this.props.url) { diff --git a/src/components/structures/GroupView.js b/src/components/structures/GroupView.js index 524694fe95..843f1401c4 100644 --- a/src/components/structures/GroupView.js +++ b/src/components/structures/GroupView.js @@ -428,7 +428,7 @@ export default createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { this._unmounted = false; this._matrixClient = MatrixClientPeg.get(); this._matrixClient.on("Group.myMembership", this._onGroupMyMembership); diff --git a/src/components/structures/LeftPanel.js b/src/components/structures/LeftPanel.js index f5e0bca67e..bbeaeb10e0 100644 --- a/src/components/structures/LeftPanel.js +++ b/src/components/structures/LeftPanel.js @@ -44,7 +44,7 @@ const LeftPanel = createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { this.focusedElement = null; this._breadcrumbsWatcherRef = SettingsStore.watchSetting( diff --git a/src/components/structures/MatrixChat.js b/src/components/structures/MatrixChat.js index 258972d18d..b0d08b7673 100644 --- a/src/components/structures/MatrixChat.js +++ b/src/components/structures/MatrixChat.js @@ -221,7 +221,7 @@ export default createReactClass({ return {serverConfig: props}; }, - componentWillMount: function() { + componentDidMount: function() { SdkConfig.put(this.props.config); // Used by _viewRoom before getting state from sync @@ -261,9 +261,7 @@ export default createReactClass({ this._accountPassword = null; this._accountPasswordTimer = null; - }, - componentDidMount: function() { this.dispatcherRef = dis.register(this.onAction); this._themeWatcher = new ThemeWatcher(); this._themeWatcher.start(); diff --git a/src/components/structures/MyGroups.js b/src/components/structures/MyGroups.js index f1209b7b9e..f179cab6ad 100644 --- a/src/components/structures/MyGroups.js +++ b/src/components/structures/MyGroups.js @@ -38,7 +38,7 @@ export default createReactClass({ contextType: MatrixClientContext, }, - componentWillMount: function() { + componentDidMount: function() { this._fetch(); }, diff --git a/src/components/structures/RightPanel.js b/src/components/structures/RightPanel.js index 8d25116827..5e556419cc 100644 --- a/src/components/structures/RightPanel.js +++ b/src/components/structures/RightPanel.js @@ -108,7 +108,7 @@ export default class RightPanel extends React.Component { } } - componentWillMount() { + componentDidMount() { this.dispatcherRef = dis.register(this.onAction); const cli = this.context; cli.on("RoomState.members", this.onRoomStateMember); diff --git a/src/components/structures/RoomDirectory.js b/src/components/structures/RoomDirectory.js index 664aaaf21f..eabf097950 100644 --- a/src/components/structures/RoomDirectory.js +++ b/src/components/structures/RoomDirectory.js @@ -56,7 +56,7 @@ export default createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { this._unmounted = false; this.nextBatch = null; this.filterTimeout = null; @@ -89,9 +89,7 @@ export default createReactClass({ ), }); }); - }, - componentDidMount: function() { this.refreshRoomList(); }, diff --git a/src/components/structures/RoomStatusBar.js b/src/components/structures/RoomStatusBar.js index 13b73ec02b..639f38a119 100644 --- a/src/components/structures/RoomStatusBar.js +++ b/src/components/structures/RoomStatusBar.js @@ -96,7 +96,7 @@ export default createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { MatrixClientPeg.get().on("sync", this.onSyncStateChange); MatrixClientPeg.get().on("Room.localEchoUpdated", this._onRoomLocalEchoUpdated); diff --git a/src/components/structures/TagPanel.js b/src/components/structures/TagPanel.js index f1a39d6fcf..6642cce098 100644 --- a/src/components/structures/TagPanel.js +++ b/src/components/structures/TagPanel.js @@ -44,7 +44,7 @@ const TagPanel = createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { this.unmounted = false; this.context.on("Group.myMembership", this._onGroupMyMembership); this.context.on("sync", this._onClientSync); diff --git a/src/components/structures/UserView.js b/src/components/structures/UserView.js index 94159a1da4..c4fba137cc 100644 --- a/src/components/structures/UserView.js +++ b/src/components/structures/UserView.js @@ -35,7 +35,7 @@ export default class UserView extends React.Component { this.state = {}; } - componentWillMount() { + componentDidMount() { if (this.props.userId) { this._loadProfileInfo(); } diff --git a/src/components/structures/auth/ForgotPassword.js b/src/components/structures/auth/ForgotPassword.js index c849edf260..dc3f4a0a2b 100644 --- a/src/components/structures/auth/ForgotPassword.js +++ b/src/components/structures/auth/ForgotPassword.js @@ -69,7 +69,7 @@ export default createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { this.reset = null; this._checkServerLiveliness(this.props.serverConfig); }, diff --git a/src/components/structures/auth/Login.js b/src/components/structures/auth/Login.js index bfabc34a62..817472552a 100644 --- a/src/components/structures/auth/Login.js +++ b/src/components/structures/auth/Login.js @@ -113,7 +113,7 @@ export default createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { this._unmounted = false; // map from login step type to a function which will render a control diff --git a/src/components/structures/auth/PostRegistration.js b/src/components/structures/auth/PostRegistration.js index 8eef8dce11..687ab9a195 100644 --- a/src/components/structures/auth/PostRegistration.js +++ b/src/components/structures/auth/PostRegistration.js @@ -37,7 +37,7 @@ export default createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { // There is some assymetry between ChangeDisplayName and ChangeAvatar, // as ChangeDisplayName will auto-get the name but ChangeAvatar expects // the URL to be passed to you (because it's also used for room avatars). diff --git a/src/components/structures/auth/Registration.js b/src/components/structures/auth/Registration.js index 7c6a3ea56f..45d775059c 100644 --- a/src/components/structures/auth/Registration.js +++ b/src/components/structures/auth/Registration.js @@ -120,7 +120,7 @@ export default createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { this._unmounted = false; this._replaceClient(); }, diff --git a/src/components/views/auth/CountryDropdown.js b/src/components/views/auth/CountryDropdown.js index 63dc9d1ada..14a974668b 100644 --- a/src/components/views/auth/CountryDropdown.js +++ b/src/components/views/auth/CountryDropdown.js @@ -60,7 +60,7 @@ export default class CountryDropdown extends React.Component { }; } - componentWillMount() { + componentDidMount() { if (!this.props.value) { // If no value is given, we start with the default // country selected, but our parent component diff --git a/src/components/views/auth/InteractiveAuthEntryComponents.js b/src/components/views/auth/InteractiveAuthEntryComponents.js index e731b4cc01..04f7dc109b 100644 --- a/src/components/views/auth/InteractiveAuthEntryComponents.js +++ b/src/components/views/auth/InteractiveAuthEntryComponents.js @@ -429,7 +429,7 @@ export const MsisdnAuthEntry = createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { this._submitUrl = null; this._sid = null; this._msisdn = null; diff --git a/src/components/views/avatars/MemberStatusMessageAvatar.js b/src/components/views/avatars/MemberStatusMessageAvatar.js index 54f11e8e91..eef3f86d9a 100644 --- a/src/components/views/avatars/MemberStatusMessageAvatar.js +++ b/src/components/views/avatars/MemberStatusMessageAvatar.js @@ -49,7 +49,7 @@ export default class MemberStatusMessageAvatar extends React.Component { this._button = createRef(); } - componentWillMount() { + componentDidMount() { if (this.props.member.userId !== MatrixClientPeg.get().getUserId()) { throw new Error("Cannot use MemberStatusMessageAvatar on anyone but the logged in user"); } diff --git a/src/components/views/context_menus/MessageContextMenu.js b/src/components/views/context_menus/MessageContextMenu.js index 4fc6dd58cc..452489aa65 100644 --- a/src/components/views/context_menus/MessageContextMenu.js +++ b/src/components/views/context_menus/MessageContextMenu.js @@ -61,7 +61,7 @@ export default createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { MatrixClientPeg.get().on('RoomMember.powerLevel', this._checkPermissions); this._checkPermissions(); }, diff --git a/src/components/views/context_menus/RoomTileContextMenu.js b/src/components/views/context_menus/RoomTileContextMenu.js index 2d8dec29c7..d281656bbe 100644 --- a/src/components/views/context_menus/RoomTileContextMenu.js +++ b/src/components/views/context_menus/RoomTileContextMenu.js @@ -82,7 +82,7 @@ export default createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { this._unmounted = false; }, diff --git a/src/components/views/context_menus/StatusMessageContextMenu.js b/src/components/views/context_menus/StatusMessageContextMenu.js index d5cba45956..5e6f06dd5d 100644 --- a/src/components/views/context_menus/StatusMessageContextMenu.js +++ b/src/components/views/context_menus/StatusMessageContextMenu.js @@ -35,7 +35,7 @@ export default class StatusMessageContextMenu extends React.Component { }; } - componentWillMount() { + componentDidMount() { const { user } = this.props; if (!user) { return; diff --git a/src/components/views/dialogs/ConfirmUserActionDialog.js b/src/components/views/dialogs/ConfirmUserActionDialog.js index 14910fbf6d..d7b86d43d5 100644 --- a/src/components/views/dialogs/ConfirmUserActionDialog.js +++ b/src/components/views/dialogs/ConfirmUserActionDialog.js @@ -55,7 +55,7 @@ export default createReactClass({ askReason: false, }), - componentWillMount: function() { + componentDidMount: function() { this._reasonField = null; }, diff --git a/src/components/views/dialogs/RoomSettingsDialog.js b/src/components/views/dialogs/RoomSettingsDialog.js index 76faf60eef..96523d1e94 100644 --- a/src/components/views/dialogs/RoomSettingsDialog.js +++ b/src/components/views/dialogs/RoomSettingsDialog.js @@ -36,7 +36,7 @@ export default class RoomSettingsDialog extends React.Component { onFinished: PropTypes.func.isRequired, }; - componentWillMount() { + componentDidMount() { this._dispatcherRef = dis.register(this._onAction); } diff --git a/src/components/views/dialogs/RoomUpgradeDialog.js b/src/components/views/dialogs/RoomUpgradeDialog.js index dc734718d5..c45d82303b 100644 --- a/src/components/views/dialogs/RoomUpgradeDialog.js +++ b/src/components/views/dialogs/RoomUpgradeDialog.js @@ -30,7 +30,7 @@ export default createReactClass({ onFinished: PropTypes.func.isRequired, }, - componentWillMount: async function() { + componentDidMount: async function() { const recommended = await this.props.room.getRecommendedVersion(); this._targetVersion = recommended.version; this.setState({busy: false}); diff --git a/src/components/views/dialogs/SetPasswordDialog.js b/src/components/views/dialogs/SetPasswordDialog.js index c48690bb48..fcc6e67656 100644 --- a/src/components/views/dialogs/SetPasswordDialog.js +++ b/src/components/views/dialogs/SetPasswordDialog.js @@ -75,8 +75,8 @@ export default createReactClass({ }; }, - componentWillMount: function() { - console.info('SetPasswordDialog component will mount'); + componentDidMount: function() { + console.info('SetPasswordDialog component did mount'); }, _onPasswordChanged: function(res) { diff --git a/src/components/views/dialogs/ShareDialog.js b/src/components/views/dialogs/ShareDialog.js index b42a88ceac..cf4735f608 100644 --- a/src/components/views/dialogs/ShareDialog.js +++ b/src/components/views/dialogs/ShareDialog.js @@ -121,7 +121,7 @@ export default class ShareDialog extends React.Component { }); } - componentWillMount() { + componentDidMount() { if (this.props.target instanceof Room) { const permalinkCreator = new RoomPermalinkCreator(this.props.target); permalinkCreator.load(); diff --git a/src/components/views/dialogs/UnknownDeviceDialog.js b/src/components/views/dialogs/UnknownDeviceDialog.js index 69ebb72a6f..4cad13b047 100644 --- a/src/components/views/dialogs/UnknownDeviceDialog.js +++ b/src/components/views/dialogs/UnknownDeviceDialog.js @@ -87,7 +87,7 @@ export default createReactClass({ onSend: PropTypes.func.isRequired, }, - componentWillMount: function() { + componentDidMount: function() { MatrixClientPeg.get().on("deviceVerificationChanged", this._onDeviceVerificationChanged); }, diff --git a/src/components/views/elements/AppTile.js b/src/components/views/elements/AppTile.js index 0a8bf7443b..539eba489c 100644 --- a/src/components/views/elements/AppTile.js +++ b/src/components/views/elements/AppTile.js @@ -147,14 +147,12 @@ export default class AppTile extends React.Component { return false; } - componentWillMount() { + componentDidMount() { // Only fetch IM token on mount if we're showing and have permission to load if (this.props.show && this.state.hasPermissionToLoad) { this.setScalarToken(); } - } - componentDidMount() { // Widget action listeners this.dispatcherRef = dis.register(this._onAction); } diff --git a/src/components/views/elements/DeviceVerifyButtons.js b/src/components/views/elements/DeviceVerifyButtons.js index b4d78bb9bc..7328d50328 100644 --- a/src/components/views/elements/DeviceVerifyButtons.js +++ b/src/components/views/elements/DeviceVerifyButtons.js @@ -38,7 +38,7 @@ export default createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { const cli = MatrixClientPeg.get(); cli.on("deviceVerificationChanged", this.onDeviceVerificationChanged); }, diff --git a/src/components/views/elements/EditableTextContainer.js b/src/components/views/elements/EditableTextContainer.js index 57e1b3d2cd..bbc5560557 100644 --- a/src/components/views/elements/EditableTextContainer.js +++ b/src/components/views/elements/EditableTextContainer.js @@ -42,7 +42,7 @@ export default class EditableTextContainer extends React.Component { this._onValueChanged = this._onValueChanged.bind(this); } - componentWillMount() { + componentDidMount() { if (this.props.getInitialValue === undefined) { // use whatever was given in the initialValue property. return; diff --git a/src/components/views/elements/LanguageDropdown.js b/src/components/views/elements/LanguageDropdown.js index cb4e2e4da6..465176778c 100644 --- a/src/components/views/elements/LanguageDropdown.js +++ b/src/components/views/elements/LanguageDropdown.js @@ -40,7 +40,7 @@ export default class LanguageDropdown extends React.Component { }; } - componentWillMount() { + componentDidMount() { languageHandler.getAllLanguagesFromJson().then((langs) => { langs.sort(function(a, b) { if (a.label < b.label) return -1; diff --git a/src/components/views/elements/PersistentApp.js b/src/components/views/elements/PersistentApp.js index a807ed3b93..ee7bc46e74 100644 --- a/src/components/views/elements/PersistentApp.js +++ b/src/components/views/elements/PersistentApp.js @@ -33,7 +33,7 @@ export default createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { this._roomStoreToken = RoomViewStore.addListener(this._onRoomViewStoreUpdate); ActiveWidgetStore.on('update', this._onActiveWidgetStoreUpdate); }, diff --git a/src/components/views/elements/Pill.js b/src/components/views/elements/Pill.js index 5f143a06a6..8eda4b30b5 100644 --- a/src/components/views/elements/Pill.js +++ b/src/components/views/elements/Pill.js @@ -155,7 +155,7 @@ const Pill = createReactClass({ this.setState({resourceId, pillType, member, group, room}); }, - componentWillMount() { + componentDidMount() { this._unmounted = false; this._matrixClient = MatrixClientPeg.get(); this.componentWillReceiveProps(this.props); diff --git a/src/components/views/elements/PowerSelector.js b/src/components/views/elements/PowerSelector.js index eff14979a9..8d17c2be57 100644 --- a/src/components/views/elements/PowerSelector.js +++ b/src/components/views/elements/PowerSelector.js @@ -62,7 +62,7 @@ export default createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { this._initStateFromProps(this.props); }, diff --git a/src/components/views/elements/ReplyThread.js b/src/components/views/elements/ReplyThread.js index 0e1f230e57..eae2d13f8a 100644 --- a/src/components/views/elements/ReplyThread.js +++ b/src/components/views/elements/ReplyThread.js @@ -184,7 +184,7 @@ export default class ReplyThread extends React.Component { ref={ref} permalinkCreator={permalinkCreator} />; } - componentWillMount() { + componentDidMount() { this.unmounted = false; this.room = this.context.getRoom(this.props.parentEv.getRoomId()); this.room.on("Room.redaction", this.onRoomRedaction); diff --git a/src/components/views/elements/TintableSvg.js b/src/components/views/elements/TintableSvg.js index 3e0e41f411..66625c7b87 100644 --- a/src/components/views/elements/TintableSvg.js +++ b/src/components/views/elements/TintableSvg.js @@ -36,11 +36,9 @@ const TintableSvg = createReactClass({ idSequence: 0, }, - componentWillMount: function() { - this.fixups = []; - }, - componentDidMount: function() { + this.fixups = []; + this.id = TintableSvg.idSequence++; TintableSvg.mounts[this.id] = this; }, diff --git a/src/components/views/groups/GroupMemberInfo.js b/src/components/views/groups/GroupMemberInfo.js index f70c769ad7..95517ef548 100644 --- a/src/components/views/groups/GroupMemberInfo.js +++ b/src/components/views/groups/GroupMemberInfo.js @@ -49,7 +49,7 @@ export default createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { this._unmounted = false; this._initGroupStore(this.props.groupId); }, diff --git a/src/components/views/groups/GroupMemberList.js b/src/components/views/groups/GroupMemberList.js index 2853e70afa..ca374d1309 100644 --- a/src/components/views/groups/GroupMemberList.js +++ b/src/components/views/groups/GroupMemberList.js @@ -47,7 +47,7 @@ export default createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { this._unmounted = false; this._initGroupStore(this.props.groupId); }, diff --git a/src/components/views/groups/GroupPublicityToggle.js b/src/components/views/groups/GroupPublicityToggle.js index 602f9036d8..81f0f469ef 100644 --- a/src/components/views/groups/GroupPublicityToggle.js +++ b/src/components/views/groups/GroupPublicityToggle.js @@ -36,7 +36,7 @@ export default createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { this._initGroupStore(this.props.groupId); }, diff --git a/src/components/views/groups/GroupRoomInfo.js b/src/components/views/groups/GroupRoomInfo.js index 91d84be4d1..789396e719 100644 --- a/src/components/views/groups/GroupRoomInfo.js +++ b/src/components/views/groups/GroupRoomInfo.js @@ -47,7 +47,7 @@ export default createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { this._initGroupStore(this.props.groupId); }, diff --git a/src/components/views/groups/GroupRoomList.js b/src/components/views/groups/GroupRoomList.js index dee304e1f6..5c3e1587db 100644 --- a/src/components/views/groups/GroupRoomList.js +++ b/src/components/views/groups/GroupRoomList.js @@ -39,7 +39,7 @@ export default createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { this._unmounted = false; this._initGroupStore(this.props.groupId); }, diff --git a/src/components/views/groups/GroupTile.js b/src/components/views/groups/GroupTile.js index 12e2427e69..b845a83c2a 100644 --- a/src/components/views/groups/GroupTile.js +++ b/src/components/views/groups/GroupTile.js @@ -55,7 +55,7 @@ const GroupTile = createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { FlairStore.getGroupProfileCached(this.context, this.props.groupId).then((profile) => { this.setState({profile}); }).catch((err) => { diff --git a/src/components/views/groups/GroupUserSettings.js b/src/components/views/groups/GroupUserSettings.js index a65d23bed7..8f57eccd05 100644 --- a/src/components/views/groups/GroupUserSettings.js +++ b/src/components/views/groups/GroupUserSettings.js @@ -34,7 +34,7 @@ export default createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { this.context.getJoinedGroups().then((result) => { this.setState({groups: result.groups || [], error: null}); }, (err) => { diff --git a/src/components/views/messages/MImageBody.js b/src/components/views/messages/MImageBody.js index 64f2611caf..ad238a728e 100644 --- a/src/components/views/messages/MImageBody.js +++ b/src/components/views/messages/MImageBody.js @@ -67,11 +67,6 @@ export default class MImageBody extends React.Component { this._image = createRef(); } - componentWillMount() { - this.unmounted = false; - this.context.on('sync', this.onClientSync); - } - // FIXME: factor this out and aplpy it to MVideoBody and MAudioBody too! onClientSync(syncState, prevState) { if (this.unmounted) return; @@ -258,6 +253,9 @@ export default class MImageBody extends React.Component { } componentDidMount() { + this.unmounted = false; + this.context.on('sync', this.onClientSync); + const content = this.props.mxEvent.getContent(); if (content.file !== undefined && this.state.decryptedUrl === null) { let thumbnailPromise = Promise.resolve(null); diff --git a/src/components/views/messages/SenderProfile.js b/src/components/views/messages/SenderProfile.js index f7da1029e1..bed93b68c3 100644 --- a/src/components/views/messages/SenderProfile.js +++ b/src/components/views/messages/SenderProfile.js @@ -42,7 +42,7 @@ export default createReactClass({ }; }, - componentWillMount() { + componentDidMount() { this.unmounted = false; this._updateRelatedGroups(); diff --git a/src/components/views/right_panel/HeaderButtons.js b/src/components/views/right_panel/HeaderButtons.js index dbcae4529a..03b03218ee 100644 --- a/src/components/views/right_panel/HeaderButtons.js +++ b/src/components/views/right_panel/HeaderButtons.js @@ -40,7 +40,7 @@ export default class HeaderButtons extends React.Component { }; } - componentWillMount() { + componentDidMount() { this._storeToken = RightPanelStore.getSharedInstance().addListener(this.onRightPanelUpdate.bind(this)); this._dispatcherRef = dis.register(this.onAction.bind(this)); // used by subclasses } diff --git a/src/components/views/rooms/AppsDrawer.js b/src/components/views/rooms/AppsDrawer.js index f81a5630a4..508b149322 100644 --- a/src/components/views/rooms/AppsDrawer.js +++ b/src/components/views/rooms/AppsDrawer.js @@ -55,13 +55,10 @@ export default createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { ScalarMessaging.startListening(); MatrixClientPeg.get().on('RoomState.events', this.onRoomStateEvents); WidgetEchoStore.on('update', this._updateApps); - }, - - componentDidMount: function() { this.dispatcherRef = dis.register(this.onAction); }, diff --git a/src/components/views/rooms/EditMessageComposer.js b/src/components/views/rooms/EditMessageComposer.js index 1d01f68551..d6ea0ec5f0 100644 --- a/src/components/views/rooms/EditMessageComposer.js +++ b/src/components/views/rooms/EditMessageComposer.js @@ -223,7 +223,7 @@ export default class EditMessageComposer extends React.Component { this.props.editState.setEditorState(caret, parts); } - componentWillMount() { + componentDidMount() { this._createEditorModel(); } diff --git a/src/components/views/rooms/ForwardMessage.js b/src/components/views/rooms/ForwardMessage.js index 78466f7cb5..a3c00598a7 100644 --- a/src/components/views/rooms/ForwardMessage.js +++ b/src/components/views/rooms/ForwardMessage.js @@ -30,14 +30,12 @@ export default createReactClass({ onCancelClick: PropTypes.func.isRequired, }, - componentWillMount: function() { + componentDidMount: function() { dis.dispatch({ action: 'panel_disable', middleDisabled: true, }); - }, - componentDidMount: function() { document.addEventListener('keydown', this._onKeyDown); }, diff --git a/src/components/views/rooms/MemberInfo.js b/src/components/views/rooms/MemberInfo.js index 7c187bd17a..f83e183b85 100644 --- a/src/components/views/rooms/MemberInfo.js +++ b/src/components/views/rooms/MemberInfo.js @@ -79,7 +79,7 @@ export default createReactClass({ contextType: MatrixClientContext, }, - componentWillMount: function() { + componentDidMount: function() { this._cancelDeviceList = null; const cli = this.context; @@ -98,9 +98,7 @@ export default createReactClass({ cli.on("accountData", this.onAccountData); this._checkIgnoreState(); - }, - componentDidMount: function() { this._updateStateForNewMember(this.props.member); }, diff --git a/src/components/views/rooms/MemberList.js b/src/components/views/rooms/MemberList.js index edd2f52496..dfa7e856b4 100644 --- a/src/components/views/rooms/MemberList.js +++ b/src/components/views/rooms/MemberList.js @@ -49,7 +49,7 @@ export default createReactClass({ } }, - componentWillMount: function() { + componentDidMount: function() { this._mounted = true; const cli = MatrixClientPeg.get(); if (cli.hasLazyLoadMembersEnabled()) { diff --git a/src/components/views/rooms/RoomBreadcrumbs.js b/src/components/views/rooms/RoomBreadcrumbs.js index f9408d3259..ad8a5cfef9 100644 --- a/src/components/views/rooms/RoomBreadcrumbs.js +++ b/src/components/views/rooms/RoomBreadcrumbs.js @@ -49,7 +49,7 @@ export default class RoomBreadcrumbs extends React.Component { this._scroller = createRef(); } - componentWillMount() { + componentDidMount() { this._dispatcherRef = dis.register(this.onAction); const storedRooms = SettingsStore.getValue("breadcrumb_rooms"); diff --git a/src/components/views/rooms/RoomNameEditor.js b/src/components/views/rooms/RoomNameEditor.js index b65d89ee6f..ab355b1f9e 100644 --- a/src/components/views/rooms/RoomNameEditor.js +++ b/src/components/views/rooms/RoomNameEditor.js @@ -34,7 +34,7 @@ export default createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { const room = this.props.room; const name = room.currentState.getStateEvents('m.room.name', ''); const myId = MatrixClientPeg.get().credentials.userId; diff --git a/src/components/views/rooms/RoomPreviewBar.js b/src/components/views/rooms/RoomPreviewBar.js index 4ff5dd5198..85c41f30ec 100644 --- a/src/components/views/rooms/RoomPreviewBar.js +++ b/src/components/views/rooms/RoomPreviewBar.js @@ -97,7 +97,7 @@ export default createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { this._checkInvitedEmail(); }, diff --git a/src/components/views/rooms/RoomRecoveryReminder.js b/src/components/views/rooms/RoomRecoveryReminder.js index 50521cdd37..3678193af2 100644 --- a/src/components/views/rooms/RoomRecoveryReminder.js +++ b/src/components/views/rooms/RoomRecoveryReminder.js @@ -44,7 +44,7 @@ export default class RoomRecoveryReminder extends React.PureComponent { }; } - componentWillMount() { + componentDidMount() { this._loadBackupStatus(); } diff --git a/src/components/views/rooms/RoomTopicEditor.js b/src/components/views/rooms/RoomTopicEditor.js index 5decce02a9..0adc0ff1d6 100644 --- a/src/components/views/rooms/RoomTopicEditor.js +++ b/src/components/views/rooms/RoomTopicEditor.js @@ -33,7 +33,7 @@ export default createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { const room = this.props.room; const topic = room.currentState.getStateEvents('m.room.topic', ''); this.setState({ diff --git a/src/components/views/rooms/RoomUpgradeWarningBar.js b/src/components/views/rooms/RoomUpgradeWarningBar.js index 1240900e28..7d5bc89034 100644 --- a/src/components/views/rooms/RoomUpgradeWarningBar.js +++ b/src/components/views/rooms/RoomUpgradeWarningBar.js @@ -31,7 +31,7 @@ export default createReactClass({ recommendation: PropTypes.object.isRequired, }, - componentWillMount: function() { + componentDidMount: function() { const tombstone = this.props.room.currentState.getStateEvents("m.room.tombstone", ""); this.setState({upgraded: tombstone && tombstone.getContent().replacement_room}); diff --git a/src/components/views/rooms/ThirdPartyMemberInfo.js b/src/components/views/rooms/ThirdPartyMemberInfo.js index f8d9069ca6..3e6ed16aa4 100644 --- a/src/components/views/rooms/ThirdPartyMemberInfo.js +++ b/src/components/views/rooms/ThirdPartyMemberInfo.js @@ -51,7 +51,7 @@ export default class ThirdPartyMemberInfo extends React.Component { }; } - componentWillMount(): void { + componentDidMount(): void { MatrixClientPeg.get().on("RoomState.events", this.onRoomStateEvents); } diff --git a/src/components/views/rooms/WhoIsTypingTile.js b/src/components/views/rooms/WhoIsTypingTile.js index 9683d00e51..b56a75582f 100644 --- a/src/components/views/rooms/WhoIsTypingTile.js +++ b/src/components/views/rooms/WhoIsTypingTile.js @@ -54,7 +54,7 @@ export default createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { MatrixClientPeg.get().on("RoomMember.typing", this.onRoomMemberTyping); MatrixClientPeg.get().on("Room.timeline", this.onRoomTimeline); }, diff --git a/src/components/views/settings/ChangeAvatar.js b/src/components/views/settings/ChangeAvatar.js index 5b6b6ae3de..76644d38bc 100644 --- a/src/components/views/settings/ChangeAvatar.js +++ b/src/components/views/settings/ChangeAvatar.js @@ -55,7 +55,7 @@ export default createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { MatrixClientPeg.get().on("RoomState.events", this.onRoomStateEvents); }, diff --git a/src/components/views/settings/ChangePassword.js b/src/components/views/settings/ChangePassword.js index 6607458b40..7c88573e9c 100644 --- a/src/components/views/settings/ChangePassword.js +++ b/src/components/views/settings/ChangePassword.js @@ -78,7 +78,7 @@ export default createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { this._sessionStore = sessionStore; this._sessionStoreToken = this._sessionStore.addListener( this._setStateFromSessionStore, diff --git a/src/components/views/settings/EventIndexPanel.js b/src/components/views/settings/EventIndexPanel.js index 203a7ee46e..c9c6a5ec4f 100644 --- a/src/components/views/settings/EventIndexPanel.js +++ b/src/components/views/settings/EventIndexPanel.js @@ -63,7 +63,7 @@ export default class EventIndexPanel extends React.Component { } } - async componentWillMount(): void { + async componentDidMount(): void { this.updateState(); } diff --git a/src/components/views/settings/KeyBackupPanel.js b/src/components/views/settings/KeyBackupPanel.js index 27fdb2cb56..9d60ed1188 100644 --- a/src/components/views/settings/KeyBackupPanel.js +++ b/src/components/views/settings/KeyBackupPanel.js @@ -38,7 +38,7 @@ export default class KeyBackupPanel extends React.PureComponent { }; } - componentWillMount() { + componentDidMount() { this._checkKeyBackupStatus(); MatrixClientPeg.get().on('crypto.keyBackupStatus', this._onKeyBackupStatus); diff --git a/src/components/views/settings/Notifications.js b/src/components/views/settings/Notifications.js index 1f4bde6eab..a3173f18bb 100644 --- a/src/components/views/settings/Notifications.js +++ b/src/components/views/settings/Notifications.js @@ -87,7 +87,7 @@ export default createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { this._refreshFromServer(); }, diff --git a/src/components/views/settings/tabs/user/HelpUserSettingsTab.js b/src/components/views/settings/tabs/user/HelpUserSettingsTab.js index 9a2db8113e..146d841d58 100644 --- a/src/components/views/settings/tabs/user/HelpUserSettingsTab.js +++ b/src/components/views/settings/tabs/user/HelpUserSettingsTab.js @@ -40,7 +40,7 @@ export default class HelpUserSettingsTab extends React.Component { }; } - componentWillMount(): void { + componentDidMount(): void { PlatformPeg.get().getAppVersion().then((ver) => this.setState({vectorVersion: ver})).catch((e) => { console.error("Error getting vector version: ", e); }); diff --git a/src/components/views/settings/tabs/user/PreferencesUserSettingsTab.js b/src/components/views/settings/tabs/user/PreferencesUserSettingsTab.js index bdcb25dd51..bdb2a9ffc4 100644 --- a/src/components/views/settings/tabs/user/PreferencesUserSettingsTab.js +++ b/src/components/views/settings/tabs/user/PreferencesUserSettingsTab.js @@ -81,7 +81,7 @@ export default class PreferencesUserSettingsTab extends React.Component { }; } - async componentWillMount(): void { + async componentDidMount(): void { const platform = PlatformPeg.get(); const autoLaunchSupported = await platform.supportsAutoLaunch(); diff --git a/src/components/views/voip/CallPreview.js b/src/components/views/voip/CallPreview.js index 57bf35a719..049dd8a3c6 100644 --- a/src/components/views/voip/CallPreview.js +++ b/src/components/views/voip/CallPreview.js @@ -40,7 +40,7 @@ export default createReactClass({ }; }, - componentWillMount: function() { + componentDidMount: function() { this._roomStoreToken = RoomViewStore.addListener(this._onRoomViewStoreUpdate); this.dispatcherRef = dis.register(this._onAction); }, From 0a6f54da335b80ec4fb18812b5c93b6ac2380485 Mon Sep 17 00:00:00 2001 From: Travis Ralston Date: Tue, 31 Mar 2020 14:12:52 -0600 Subject: [PATCH 0075/2751] Label and use UNSAFE_componentWillMount to minimize warnings These TODO comments are expected to be fixed ASAP, but until that happens let's minimize the errors in the console for development. For https://github.com/vector-im/riot-web/issues/12877 These all aren't using componentDidMount because they do something which causes application instability if componentDidMount were used. Much of these calls are expected to move into constructors once they are converted to real classes. --- src/async-components/views/dialogs/ExportE2eKeysDialog.js | 3 ++- src/async-components/views/dialogs/ImportE2eKeysDialog.js | 3 ++- src/components/structures/InteractiveAuth.js | 3 ++- src/components/structures/LoggedInView.js | 3 ++- src/components/structures/RoomView.js | 3 ++- src/components/structures/ScrollPanel.js | 5 ++--- src/components/structures/SearchBox.js | 1 + src/components/structures/TimelinePanel.js | 3 ++- src/components/views/auth/CaptchaForm.js | 3 ++- src/components/views/auth/InteractiveAuthEntryComponents.js | 4 +++- src/components/views/dialogs/AddressPickerDialog.js | 1 + src/components/views/dialogs/BaseDialog.js | 3 ++- src/components/views/dialogs/SetMxIdDialog.js | 1 + src/components/views/dialogs/TextInputDialog.js | 1 + src/components/views/elements/Dropdown.js | 3 ++- src/components/views/elements/EditableText.js | 3 ++- src/components/views/elements/PowerSelector.js | 1 + src/components/views/elements/UserSelector.js | 1 + src/components/views/messages/MFileBody.js | 1 + src/components/views/messages/MessageEvent.js | 1 + src/components/views/messages/TextualBody.js | 1 + src/components/views/rooms/EventTile.js | 3 ++- src/components/views/rooms/LinkPreviewWidget.js | 3 ++- src/components/views/rooms/ReadReceiptMarker.js | 1 + src/components/views/rooms/RoomDetailRow.js | 1 + src/components/views/rooms/RoomHeader.js | 1 + src/components/views/rooms/RoomList.js | 3 ++- src/components/views/rooms/RoomTile.js | 1 + src/components/views/rooms/SearchBar.js | 1 + src/components/views/rooms/SendMessageComposer.js | 3 ++- .../views/settings/tabs/room/AdvancedRoomSettingsTab.js | 3 ++- .../views/settings/tabs/room/NotificationSettingsTab.js | 3 ++- .../views/settings/tabs/room/SecurityRoomSettingsTab.js | 3 ++- .../views/settings/tabs/user/GeneralUserSettingsTab.js | 3 ++- src/components/views/voip/CallView.js | 1 + src/components/views/voip/VideoFeed.js | 1 + src/components/views/voip/VideoView.js | 1 + 37 files changed, 58 insertions(+), 22 deletions(-) diff --git a/src/async-components/views/dialogs/ExportE2eKeysDialog.js b/src/async-components/views/dialogs/ExportE2eKeysDialog.js index 481075d0fa..7ec9da39de 100644 --- a/src/async-components/views/dialogs/ExportE2eKeysDialog.js +++ b/src/async-components/views/dialogs/ExportE2eKeysDialog.js @@ -42,7 +42,8 @@ export default createReactClass({ }; }, - componentWillMount: function() { + // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs + UNSAFE_componentWillMount: function() { this._unmounted = false; this._passphrase1 = createRef(); diff --git a/src/async-components/views/dialogs/ImportE2eKeysDialog.js b/src/async-components/views/dialogs/ImportE2eKeysDialog.js index 591c84f5d3..6b9d2c7e45 100644 --- a/src/async-components/views/dialogs/ImportE2eKeysDialog.js +++ b/src/async-components/views/dialogs/ImportE2eKeysDialog.js @@ -54,7 +54,8 @@ export default createReactClass({ }; }, - componentWillMount: function() { + // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs + UNSAFE_componentWillMount: function() { this._unmounted = false; this._file = createRef(); diff --git a/src/components/structures/InteractiveAuth.js b/src/components/structures/InteractiveAuth.js index f4adb5751f..b2441f1bf8 100644 --- a/src/components/structures/InteractiveAuth.js +++ b/src/components/structures/InteractiveAuth.js @@ -87,7 +87,8 @@ export default createReactClass({ }; }, - componentWillMount: function() { + // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs + UNSAFE_componentWillMount: function() { this._unmounted = false; this._authLogic = new InteractiveAuth({ authData: this.props.authData, diff --git a/src/components/structures/LoggedInView.js b/src/components/structures/LoggedInView.js index e7a6f4c1a9..02ca8df0a7 100644 --- a/src/components/structures/LoggedInView.js +++ b/src/components/structures/LoggedInView.js @@ -94,7 +94,8 @@ const LoggedInView = createReactClass({ this._loadResizerPreferences(); }, - componentWillMount: function() { + // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs + UNSAFE_componentWillMount: function() { // stash the MatrixClient in case we log out before we are unmounted this._matrixClient = this.props.matrixClient; diff --git a/src/components/structures/RoomView.js b/src/components/structures/RoomView.js index 2c9e798bd8..4a3666fc38 100644 --- a/src/components/structures/RoomView.js +++ b/src/components/structures/RoomView.js @@ -168,7 +168,8 @@ export default createReactClass({ }; }, - componentWillMount: function() { + // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs + UNSAFE_componentWillMount: function() { this.dispatcherRef = dis.register(this.onAction); this.context.on("Room", this.onRoom); this.context.on("Room.timeline", this.onRoomTimeline); diff --git a/src/components/structures/ScrollPanel.js b/src/components/structures/ScrollPanel.js index c218fee5d6..4f44c1a169 100644 --- a/src/components/structures/ScrollPanel.js +++ b/src/components/structures/ScrollPanel.js @@ -156,9 +156,8 @@ export default createReactClass({ }; }, - componentWillMount: function() { - this._fillRequestWhileRunning = false; - this._isFilling = false; + // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs + UNSAFE_componentWillMount: function() { this._pendingFillRequests = {b: null, f: null}; if (this.props.resizeNotifier) { diff --git a/src/components/structures/SearchBox.js b/src/components/structures/SearchBox.js index e169e09752..0f3f8a6be9 100644 --- a/src/components/structures/SearchBox.js +++ b/src/components/structures/SearchBox.js @@ -53,6 +53,7 @@ export default createReactClass({ }; }, + // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs UNSAFE_componentWillMount: function() { this._search = createRef(); }, diff --git a/src/components/structures/TimelinePanel.js b/src/components/structures/TimelinePanel.js index 25526c3139..1bea707fd3 100644 --- a/src/components/structures/TimelinePanel.js +++ b/src/components/structures/TimelinePanel.js @@ -202,7 +202,8 @@ const TimelinePanel = createReactClass({ }; }, - componentWillMount: function() { + // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs + UNSAFE_componentWillMount: function() { debuglog("TimelinePanel: mounting"); this.lastRRSentEventId = undefined; diff --git a/src/components/views/auth/CaptchaForm.js b/src/components/views/auth/CaptchaForm.js index 1b9dd3a97d..e162603b01 100644 --- a/src/components/views/auth/CaptchaForm.js +++ b/src/components/views/auth/CaptchaForm.js @@ -46,7 +46,8 @@ export default createReactClass({ }; }, - componentWillMount: function() { + // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs + UNSAFE_componentWillMount: function() { this._captchaWidgetId = null; this._recaptchaContainer = createRef(); diff --git a/src/components/views/auth/InteractiveAuthEntryComponents.js b/src/components/views/auth/InteractiveAuthEntryComponents.js index e731b4cc01..794f270cf3 100644 --- a/src/components/views/auth/InteractiveAuthEntryComponents.js +++ b/src/components/views/auth/InteractiveAuthEntryComponents.js @@ -238,6 +238,7 @@ export const TermsAuthEntry = createReactClass({ showContinue: PropTypes.bool, }, + // TODO: [REACT-WARNING] Move this to constructor componentWillMount: function() { // example stageParams: // @@ -575,7 +576,8 @@ export const FallbackAuthEntry = createReactClass({ errorText: PropTypes.string, }, - componentWillMount: function() { + // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs + UNSAFE_componentWillMount: function() { // we have to make the user click a button, as browsers will block // the popup if we open it immediately. this._popupWindow = null; diff --git a/src/components/views/dialogs/AddressPickerDialog.js b/src/components/views/dialogs/AddressPickerDialog.js index e309c3a0cf..451ec9cfde 100644 --- a/src/components/views/dialogs/AddressPickerDialog.js +++ b/src/components/views/dialogs/AddressPickerDialog.js @@ -107,6 +107,7 @@ export default createReactClass({ }; }, + // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs UNSAFE_componentWillMount: function() { this._textinput = createRef(); }, diff --git a/src/components/views/dialogs/BaseDialog.js b/src/components/views/dialogs/BaseDialog.js index 9238024b60..67d70aabe4 100644 --- a/src/components/views/dialogs/BaseDialog.js +++ b/src/components/views/dialogs/BaseDialog.js @@ -86,7 +86,8 @@ export default createReactClass({ }; }, - componentWillMount() { + // TODO: [REACT-WARNING] Move this to constructor + UNSAFE_componentWillMount() { this._matrixClient = MatrixClientPeg.get(); }, diff --git a/src/components/views/dialogs/SetMxIdDialog.js b/src/components/views/dialogs/SetMxIdDialog.js index 611ea64e49..f99d065e7e 100644 --- a/src/components/views/dialogs/SetMxIdDialog.js +++ b/src/components/views/dialogs/SetMxIdDialog.js @@ -62,6 +62,7 @@ export default createReactClass({ }; }, + // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs UNSAFE_componentWillMount: function() { this._input_value = createRef(); this._uiAuth = createRef(); diff --git a/src/components/views/dialogs/TextInputDialog.js b/src/components/views/dialogs/TextInputDialog.js index b6b29f4350..d7ca3f144d 100644 --- a/src/components/views/dialogs/TextInputDialog.js +++ b/src/components/views/dialogs/TextInputDialog.js @@ -55,6 +55,7 @@ export default createReactClass({ }; }, + // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs UNSAFE_componentWillMount: function() { this._field = createRef(); }, diff --git a/src/components/views/elements/Dropdown.js b/src/components/views/elements/Dropdown.js index 03ab8c5c68..6c73592dbb 100644 --- a/src/components/views/elements/Dropdown.js +++ b/src/components/views/elements/Dropdown.js @@ -116,7 +116,8 @@ export default class Dropdown extends React.Component { }; } - componentWillMount() { + // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs + UNSAFE_componentWillMount() { this._button = createRef(); // Listen for all clicks on the document so we can close the // menu when the user clicks somewhere else diff --git a/src/components/views/elements/EditableText.js b/src/components/views/elements/EditableText.js index fbac63cbba..af05600e3c 100644 --- a/src/components/views/elements/EditableText.js +++ b/src/components/views/elements/EditableText.js @@ -71,7 +71,8 @@ export default createReactClass({ } }, - componentWillMount: function() { + // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs + UNSAFE_componentWillMount: function() { // we track value as an JS object field rather than in React state // as React doesn't play nice with contentEditable. this.value = ''; diff --git a/src/components/views/elements/PowerSelector.js b/src/components/views/elements/PowerSelector.js index eff14979a9..5d89207024 100644 --- a/src/components/views/elements/PowerSelector.js +++ b/src/components/views/elements/PowerSelector.js @@ -63,6 +63,7 @@ export default createReactClass({ }, componentWillMount: function() { + // TODO: [REACT-WARNING] Move this to class constructor this._initStateFromProps(this.props); }, diff --git a/src/components/views/elements/UserSelector.js b/src/components/views/elements/UserSelector.js index 706c6ed2e5..ffb577e090 100644 --- a/src/components/views/elements/UserSelector.js +++ b/src/components/views/elements/UserSelector.js @@ -35,6 +35,7 @@ export default createReactClass({ }; }, + // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs UNSAFE_componentWillMount: function() { this._user_id_input = createRef(); }, diff --git a/src/components/views/messages/MFileBody.js b/src/components/views/messages/MFileBody.js index 125c538f82..2f2521f02d 100644 --- a/src/components/views/messages/MFileBody.js +++ b/src/components/views/messages/MFileBody.js @@ -170,6 +170,7 @@ export default createReactClass({ return MatrixClientPeg.get().mxcUrlToHttp(content.url); }, + // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs UNSAFE_componentWillMount: function() { this._iframe = createRef(); this._dummyLink = createRef(); diff --git a/src/components/views/messages/MessageEvent.js b/src/components/views/messages/MessageEvent.js index 604cd19c93..beba986104 100644 --- a/src/components/views/messages/MessageEvent.js +++ b/src/components/views/messages/MessageEvent.js @@ -47,6 +47,7 @@ export default createReactClass({ maxImageHeight: PropTypes.number, }, + // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs UNSAFE_componentWillMount: function() { this._body = createRef(); }, diff --git a/src/components/views/messages/TextualBody.js b/src/components/views/messages/TextualBody.js index ac0fc65ff4..c1de376385 100644 --- a/src/components/views/messages/TextualBody.js +++ b/src/components/views/messages/TextualBody.js @@ -86,6 +86,7 @@ export default createReactClass({ return successful; }, + // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs UNSAFE_componentWillMount: function() { this._content = createRef(); }, diff --git a/src/components/views/rooms/EventTile.js b/src/components/views/rooms/EventTile.js index 26c8a54f4e..a381a02d80 100644 --- a/src/components/views/rooms/EventTile.js +++ b/src/components/views/rooms/EventTile.js @@ -233,7 +233,8 @@ export default createReactClass({ contextType: MatrixClientContext, }, - componentWillMount: function() { + // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs + UNSAFE_componentWillMount: function() { // don't do RR animations until we are mounted this._suppressReadReceiptAnimation = true; this._verifyEvent(this.props.mxEvent); diff --git a/src/components/views/rooms/LinkPreviewWidget.js b/src/components/views/rooms/LinkPreviewWidget.js index 4169a763b7..1fe70dc61c 100644 --- a/src/components/views/rooms/LinkPreviewWidget.js +++ b/src/components/views/rooms/LinkPreviewWidget.js @@ -43,7 +43,8 @@ export default createReactClass({ }; }, - componentWillMount: function() { + // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs + UNSAFE_componentWillMount: function() { this.unmounted = false; MatrixClientPeg.get().getUrlPreview(this.props.link, this.props.mxEvent.getTs()).then((res)=>{ if (this.unmounted) { diff --git a/src/components/views/rooms/ReadReceiptMarker.js b/src/components/views/rooms/ReadReceiptMarker.js index 7704291631..dcb8fd4310 100644 --- a/src/components/views/rooms/ReadReceiptMarker.js +++ b/src/components/views/rooms/ReadReceiptMarker.js @@ -87,6 +87,7 @@ export default createReactClass({ }; }, + // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs UNSAFE_componentWillMount: function() { this._avatar = createRef(); }, diff --git a/src/components/views/rooms/RoomDetailRow.js b/src/components/views/rooms/RoomDetailRow.js index 2210406c18..a88fae9e42 100644 --- a/src/components/views/rooms/RoomDetailRow.js +++ b/src/components/views/rooms/RoomDetailRow.js @@ -54,6 +54,7 @@ export default createReactClass({ } }, + // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs UNSAFE_componentWillMount: function() { this._topic = createRef(); }, diff --git a/src/components/views/rooms/RoomHeader.js b/src/components/views/rooms/RoomHeader.js index 61abfe86cf..71f774248f 100644 --- a/src/components/views/rooms/RoomHeader.js +++ b/src/components/views/rooms/RoomHeader.js @@ -58,6 +58,7 @@ export default createReactClass({ }; }, + // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs UNSAFE_componentWillMount: function() { this._topic = createRef(); }, diff --git a/src/components/views/rooms/RoomList.js b/src/components/views/rooms/RoomList.js index 87299281ff..6d89f17e87 100644 --- a/src/components/views/rooms/RoomList.js +++ b/src/components/views/rooms/RoomList.js @@ -118,7 +118,8 @@ export default createReactClass({ }; }, - componentWillMount: function() { + // TODO: [REACT-WARNING] Replace component with real class, put this in the constructor. + UNSAFE_componentWillMount: function() { this.mounted = false; const cli = MatrixClientPeg.get(); diff --git a/src/components/views/rooms/RoomTile.js b/src/components/views/rooms/RoomTile.js index 0c913b32da..f0ed34ce8b 100644 --- a/src/components/views/rooms/RoomTile.js +++ b/src/components/views/rooms/RoomTile.js @@ -224,6 +224,7 @@ export default createReactClass({ }); }, + // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs UNSAFE_componentWillMount: function() { this._roomTile = createRef(); }, diff --git a/src/components/views/rooms/SearchBar.js b/src/components/views/rooms/SearchBar.js index 1f9ec87163..1d2e7ed602 100644 --- a/src/components/views/rooms/SearchBar.js +++ b/src/components/views/rooms/SearchBar.js @@ -30,6 +30,7 @@ export default createReactClass({ }); }, + // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs UNSAFE_componentWillMount: function() { this._search_term = createRef(); }, diff --git a/src/components/views/rooms/SendMessageComposer.js b/src/components/views/rooms/SendMessageComposer.js index d87d99dc46..a1caf6ee94 100644 --- a/src/components/views/rooms/SendMessageComposer.js +++ b/src/components/views/rooms/SendMessageComposer.js @@ -331,7 +331,8 @@ export default class SendMessageComposer extends React.Component { this._editorRef.getEditableRootNode().removeEventListener("paste", this._onPaste, true); } - componentWillMount() { + // TODO: [REACT-WARNING] Move this to constructor + UNSAFE_componentWillMount() { const partCreator = new CommandPartCreator(this.props.room, this.context); const parts = this._restoreStoredEditorState(partCreator) || []; this.model = new EditorModel(parts, partCreator); diff --git a/src/components/views/settings/tabs/room/AdvancedRoomSettingsTab.js b/src/components/views/settings/tabs/room/AdvancedRoomSettingsTab.js index 6be868dc40..bbc0aa7fae 100644 --- a/src/components/views/settings/tabs/room/AdvancedRoomSettingsTab.js +++ b/src/components/views/settings/tabs/room/AdvancedRoomSettingsTab.js @@ -38,7 +38,8 @@ export default class AdvancedRoomSettingsTab extends React.Component { }; } - componentWillMount() { + // TODO: [REACT-WARNING] Move this to constructor + UNSAFE_componentWillMount() { // we handle lack of this object gracefully later, so don't worry about it failing here. const room = MatrixClientPeg.get().getRoom(this.props.roomId); room.getRecommendedVersion().then((v) => { diff --git a/src/components/views/settings/tabs/room/NotificationSettingsTab.js b/src/components/views/settings/tabs/room/NotificationSettingsTab.js index 9db27651c0..478f6c2118 100644 --- a/src/components/views/settings/tabs/room/NotificationSettingsTab.js +++ b/src/components/views/settings/tabs/room/NotificationSettingsTab.js @@ -37,7 +37,8 @@ export default class NotificationsSettingsTab extends React.Component { }; } - componentWillMount() { + // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs + UNSAFE_componentWillMount() { Notifier.getSoundForRoom(this.props.roomId).then((soundData) => { if (!soundData) { return; diff --git a/src/components/views/settings/tabs/room/SecurityRoomSettingsTab.js b/src/components/views/settings/tabs/room/SecurityRoomSettingsTab.js index 3ee92c31c8..0e77a4d81f 100644 --- a/src/components/views/settings/tabs/room/SecurityRoomSettingsTab.js +++ b/src/components/views/settings/tabs/room/SecurityRoomSettingsTab.js @@ -41,7 +41,8 @@ export default class SecurityRoomSettingsTab extends React.Component { }; } - async componentWillMount(): void { + // TODO: [REACT-WARNING] Move this to constructor + async UNSAFE_componentWillMount(): void { MatrixClientPeg.get().on("RoomState.events", this._onStateEvent); const room = MatrixClientPeg.get().getRoom(this.props.roomId); diff --git a/src/components/views/settings/tabs/user/GeneralUserSettingsTab.js b/src/components/views/settings/tabs/user/GeneralUserSettingsTab.js index f67c56f3d6..1ab43dcd7a 100644 --- a/src/components/views/settings/tabs/user/GeneralUserSettingsTab.js +++ b/src/components/views/settings/tabs/user/GeneralUserSettingsTab.js @@ -68,7 +68,8 @@ export default class GeneralUserSettingsTab extends React.Component { this.dispatcherRef = dis.register(this._onAction); } - async componentWillMount() { + // TODO: [REACT-WARNING] Move this to constructor + async UNSAFE_componentWillMount() { const cli = MatrixClientPeg.get(); const serverSupportsSeparateAddAndBind = await cli.doesServerSupportSeparateAddAndBind(); diff --git a/src/components/views/voip/CallView.js b/src/components/views/voip/CallView.js index 70d7963bcb..4a5f3923e2 100644 --- a/src/components/views/voip/CallView.js +++ b/src/components/views/voip/CallView.js @@ -57,6 +57,7 @@ export default createReactClass({ }; }, + // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs UNSAFE_componentWillMount: function() { this._video = createRef(); }, diff --git a/src/components/views/voip/VideoFeed.js b/src/components/views/voip/VideoFeed.js index 4210c60177..527b071942 100644 --- a/src/components/views/voip/VideoFeed.js +++ b/src/components/views/voip/VideoFeed.js @@ -31,6 +31,7 @@ export default createReactClass({ onResize: PropTypes.func, }, + // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs UNSAFE_componentWillMount() { this._vid = createRef(); }, diff --git a/src/components/views/voip/VideoView.js b/src/components/views/voip/VideoView.js index eabf29813a..51be6db81d 100644 --- a/src/components/views/voip/VideoView.js +++ b/src/components/views/voip/VideoView.js @@ -50,6 +50,7 @@ export default createReactClass({ onResize: PropTypes.func, }, + // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs UNSAFE_componentWillMount: function() { this._local = createRef(); this._remote = createRef(); From 6d0d77f98e6132ff895a291cba313fec0fa73c34 Mon Sep 17 00:00:00 2001 From: Travis Ralston Date: Tue, 31 Mar 2020 14:21:12 -0600 Subject: [PATCH 0076/2751] Disable the linter on lines it complaints about UNSAFE_componentWillMount --- src/components/views/elements/Dropdown.js | 2 +- src/components/views/rooms/SendMessageComposer.js | 2 +- .../views/settings/tabs/room/AdvancedRoomSettingsTab.js | 2 +- .../views/settings/tabs/room/NotificationSettingsTab.js | 2 +- .../views/settings/tabs/room/SecurityRoomSettingsTab.js | 2 +- .../views/settings/tabs/user/GeneralUserSettingsTab.js | 2 +- 6 files changed, 6 insertions(+), 6 deletions(-) diff --git a/src/components/views/elements/Dropdown.js b/src/components/views/elements/Dropdown.js index 6c73592dbb..ed5928eb08 100644 --- a/src/components/views/elements/Dropdown.js +++ b/src/components/views/elements/Dropdown.js @@ -117,7 +117,7 @@ export default class Dropdown extends React.Component { } // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs - UNSAFE_componentWillMount() { + UNSAFE_componentWillMount() { // eslint-disable-line camelcase this._button = createRef(); // Listen for all clicks on the document so we can close the // menu when the user clicks somewhere else diff --git a/src/components/views/rooms/SendMessageComposer.js b/src/components/views/rooms/SendMessageComposer.js index a1caf6ee94..233bb110be 100644 --- a/src/components/views/rooms/SendMessageComposer.js +++ b/src/components/views/rooms/SendMessageComposer.js @@ -332,7 +332,7 @@ export default class SendMessageComposer extends React.Component { } // TODO: [REACT-WARNING] Move this to constructor - UNSAFE_componentWillMount() { + UNSAFE_componentWillMount() { // eslint-disable-line camelcase const partCreator = new CommandPartCreator(this.props.room, this.context); const parts = this._restoreStoredEditorState(partCreator) || []; this.model = new EditorModel(parts, partCreator); diff --git a/src/components/views/settings/tabs/room/AdvancedRoomSettingsTab.js b/src/components/views/settings/tabs/room/AdvancedRoomSettingsTab.js index bbc0aa7fae..9ee9c8d130 100644 --- a/src/components/views/settings/tabs/room/AdvancedRoomSettingsTab.js +++ b/src/components/views/settings/tabs/room/AdvancedRoomSettingsTab.js @@ -39,7 +39,7 @@ export default class AdvancedRoomSettingsTab extends React.Component { } // TODO: [REACT-WARNING] Move this to constructor - UNSAFE_componentWillMount() { + UNSAFE_componentWillMount() { // eslint-disable-line camelcase // we handle lack of this object gracefully later, so don't worry about it failing here. const room = MatrixClientPeg.get().getRoom(this.props.roomId); room.getRecommendedVersion().then((v) => { diff --git a/src/components/views/settings/tabs/room/NotificationSettingsTab.js b/src/components/views/settings/tabs/room/NotificationSettingsTab.js index 478f6c2118..96e6b3d354 100644 --- a/src/components/views/settings/tabs/room/NotificationSettingsTab.js +++ b/src/components/views/settings/tabs/room/NotificationSettingsTab.js @@ -38,7 +38,7 @@ export default class NotificationsSettingsTab extends React.Component { } // TODO: [REACT-WARNING] Replace component with real class, use constructor for refs - UNSAFE_componentWillMount() { + UNSAFE_componentWillMount() { // eslint-disable-line camelcase Notifier.getSoundForRoom(this.props.roomId).then((soundData) => { if (!soundData) { return; diff --git a/src/components/views/settings/tabs/room/SecurityRoomSettingsTab.js b/src/components/views/settings/tabs/room/SecurityRoomSettingsTab.js index 0e77a4d81f..eb2b885a22 100644 --- a/src/components/views/settings/tabs/room/SecurityRoomSettingsTab.js +++ b/src/components/views/settings/tabs/room/SecurityRoomSettingsTab.js @@ -42,7 +42,7 @@ export default class SecurityRoomSettingsTab extends React.Component { } // TODO: [REACT-WARNING] Move this to constructor - async UNSAFE_componentWillMount(): void { + async UNSAFE_componentWillMount(): void { // eslint-disable-line camelcase MatrixClientPeg.get().on("RoomState.events", this._onStateEvent); const room = MatrixClientPeg.get().getRoom(this.props.roomId); diff --git a/src/components/views/settings/tabs/user/GeneralUserSettingsTab.js b/src/components/views/settings/tabs/user/GeneralUserSettingsTab.js index 1ab43dcd7a..801062bff4 100644 --- a/src/components/views/settings/tabs/user/GeneralUserSettingsTab.js +++ b/src/components/views/settings/tabs/user/GeneralUserSettingsTab.js @@ -69,7 +69,7 @@ export default class GeneralUserSettingsTab extends React.Component { } // TODO: [REACT-WARNING] Move this to constructor - async UNSAFE_componentWillMount() { + async UNSAFE_componentWillMount() { // eslint-disable-line camelcase const cli = MatrixClientPeg.get(); const serverSupportsSeparateAddAndBind = await cli.doesServerSupportSeparateAddAndBind(); From 538147f7fa492e0a21262c6b5d97b7e65da9f4af Mon Sep 17 00:00:00 2001 From: David Baker Date: Wed, 1 Apr 2020 10:00:33 +0100 Subject: [PATCH 0077/2751] Better support for widgets overriding their URLs Move the URL processing into AppTile so that the widget can have a URL used for embedding in the page and a separate one for popping out into a browser. --- src/components/views/elements/AppTile.js | 172 ++++++++++++------ .../views/elements/PersistentApp.js | 8 +- src/components/views/rooms/AppsDrawer.js | 6 +- src/components/views/rooms/Stickerpicker.js | 13 +- src/utils/AutoDiscoveryUtils.js | 9 +- src/utils/WidgetUtils.js | 58 ------ 6 files changed, 135 insertions(+), 131 deletions(-) diff --git a/src/components/views/elements/AppTile.js b/src/components/views/elements/AppTile.js index 0a8bf7443b..1eb4e5bf90 100644 --- a/src/components/views/elements/AppTile.js +++ b/src/components/views/elements/AppTile.js @@ -2,6 +2,7 @@ Copyright 2017 Vector Creations Ltd Copyright 2018 New Vector Ltd Copyright 2019 Michael Telatynski <7t3chguy@gmail.com> +Copyright 2020 The Matrix.org Foundation C.I.C. Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. @@ -41,12 +42,30 @@ import PersistedElement from "./PersistedElement"; const ALLOWED_APP_URL_SCHEMES = ['https:', 'http:']; const ENABLE_REACT_PERF = false; +/** + * Does template substitution on a URL (or any string). Variables will be + * passed through encodeURIComponent. + * @param {string} uriTemplate The path with template variables e.g. '/foo/$bar'. + * @param {Object} variables The key/value pairs to replace the template + * variables with. E.g. { '$bar': 'baz' }. + * @return {string} The result of replacing all template variables e.g. '/foo/baz'. + */ +function uriFromTemplate(uriTemplate, variables) { + let out = uriTemplate; + for (const [key, val] of Object.entries(variables)) { + out = out.replace( + '$' + key, encodeURIComponent(val), + ); + } + return out; +} + export default class AppTile extends React.Component { constructor(props) { super(props); // The key used for PersistedElement - this._persistKey = 'widget_' + this.props.id; + this._persistKey = 'widget_' + this.props.app.id; this.state = this._getNewState(props); @@ -78,7 +97,7 @@ export default class AppTile extends React.Component { // This is a function to make the impact of calling SettingsStore slightly less const hasPermissionToLoad = () => { const currentlyAllowedWidgets = SettingsStore.getValue("allowedWidgets", newProps.room.roomId); - return !!currentlyAllowedWidgets[newProps.eventId]; + return !!currentlyAllowedWidgets[newProps.app.eventId]; }; const PersistedElement = sdk.getComponent("elements.PersistedElement"); @@ -86,7 +105,7 @@ export default class AppTile extends React.Component { initialising: true, // True while we are mangling the widget URL // True while the iframe content is loading loading: this.props.waitForIframeLoad && !PersistedElement.isMounted(this._persistKey), - widgetUrl: this._addWurlParams(newProps.url), + widgetUrl: this._addWurlParams(newProps.app.url), // Assume that widget has permission to load if we are the user who // added it to the room, or if explicitly granted by the user hasPermissionToLoad: newProps.userId === newProps.creatorUserId || hasPermissionToLoad(), @@ -103,7 +122,7 @@ export default class AppTile extends React.Component { * @return {Boolean} True if capability supported */ _hasCapability(capability) { - return ActiveWidgetStore.widgetHasCapability(this.props.id, capability); + return ActiveWidgetStore.widgetHasCapability(this.props.app.id, capability); } /** @@ -125,7 +144,7 @@ export default class AppTile extends React.Component { const params = qs.parse(u.query); // Append widget ID to query parameters - params.widgetId = this.props.id; + params.widgetId = this.props.app.id; // Append current / parent URL, minus the hash because that will change when // we view a different room (ie. may change for persistent widgets) params.parentUrl = window.location.href.split('#', 2)[0]; @@ -137,11 +156,11 @@ export default class AppTile extends React.Component { isMixedContent() { const parentContentProtocol = window.location.protocol; - const u = url.parse(this.props.url); + const u = url.parse(this.props.app.url); const childContentProtocol = u.protocol; if (parentContentProtocol === 'https:' && childContentProtocol !== 'https:') { console.warn("Refusing to load mixed-content app:", - parentContentProtocol, childContentProtocol, window.location, this.props.url); + parentContentProtocol, childContentProtocol, window.location, this.props.app.url); return true; } return false; @@ -164,8 +183,8 @@ export default class AppTile extends React.Component { dis.unregister(this.dispatcherRef); // if it's not remaining on screen, get rid of the PersistedElement container - if (!ActiveWidgetStore.getWidgetPersistence(this.props.id)) { - ActiveWidgetStore.destroyPersistentWidget(this.props.id); + if (!ActiveWidgetStore.getWidgetPersistence(this.props.app.id)) { + ActiveWidgetStore.destroyPersistentWidget(this.props.app.id); const PersistedElement = sdk.getComponent("elements.PersistedElement"); PersistedElement.destroyElement(this._persistKey); } @@ -176,11 +195,11 @@ export default class AppTile extends React.Component { * Component initialisation is only complete when this function has resolved */ setScalarToken() { - if (!WidgetUtils.isScalarUrl(this.props.url)) { + if (!WidgetUtils.isScalarUrl(this.props.app.url)) { console.warn('Non-scalar widget, not setting scalar token!', url); this.setState({ error: null, - widgetUrl: this._addWurlParams(this.props.url), + widgetUrl: this._addWurlParams(this.props.app.url), initialising: false, }); return; @@ -191,7 +210,7 @@ export default class AppTile extends React.Component { console.warn("No integration manager - not setting scalar token", url); this.setState({ error: null, - widgetUrl: this._addWurlParams(this.props.url), + widgetUrl: this._addWurlParams(this.props.app.url), initialising: false, }); return; @@ -204,7 +223,7 @@ export default class AppTile extends React.Component { console.warn('Non-scalar manager, not setting scalar token!', url); this.setState({ error: null, - widgetUrl: this._addWurlParams(this.props.url), + widgetUrl: this._addWurlParams(this.props.app.url), initialising: false, }); return; @@ -217,7 +236,7 @@ export default class AppTile extends React.Component { this._scalarClient.getScalarToken().then((token) => { // Append scalar_token as a query param if not already present this._scalarClient.scalarToken = token; - const u = url.parse(this._addWurlParams(this.props.url)); + const u = url.parse(this._addWurlParams(this.props.app.url)); const params = qs.parse(u.query); if (!params.scalar_token) { params.scalar_token = encodeURIComponent(token); @@ -246,7 +265,7 @@ export default class AppTile extends React.Component { } componentWillReceiveProps(nextProps) { - if (nextProps.url !== this.props.url) { + if (nextProps.app.url !== this.props.app.url) { this._getNewState(nextProps); // Fetch IM token for new URL if we're showing and have permission to load if (this.props.show && this.state.hasPermissionToLoad) { @@ -280,7 +299,7 @@ export default class AppTile extends React.Component { } _onEditClick() { - console.log("Edit widget ID ", this.props.id); + console.log("Edit widget ID ", this.props.app.id); if (this.props.onEditClick) { this.props.onEditClick(); } else { @@ -289,13 +308,13 @@ export default class AppTile extends React.Component { IntegrationManagers.sharedInstance().openAll( this.props.room, 'type_' + this.props.type, - this.props.id, + this.props.app.id, ); } else { IntegrationManagers.sharedInstance().getPrimaryManager().open( this.props.room, 'type_' + this.props.type, - this.props.id, + this.props.app.id, ); } } @@ -303,7 +322,7 @@ export default class AppTile extends React.Component { _onSnapshotClick() { console.warn("Requesting widget snapshot"); - ActiveWidgetStore.getWidgetMessaging(this.props.id).getScreenshot() + ActiveWidgetStore.getWidgetMessaging(this.props.app.id).getScreenshot() .catch((err) => { console.error("Failed to get screenshot", err); }) @@ -351,7 +370,7 @@ export default class AppTile extends React.Component { WidgetUtils.setRoomWidget( this.props.room.roomId, - this.props.id, + this.props.app.id, ).catch((e) => { console.error('Failed to delete widget', e); const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); @@ -369,7 +388,7 @@ export default class AppTile extends React.Component { } _onRevokeClicked() { - console.info("Revoke widget permissions - %s", this.props.id); + console.info("Revoke widget permissions - %s", this.props.app.id); this._revokeWidgetPermission(); } @@ -380,10 +399,10 @@ export default class AppTile extends React.Component { // Destroy the old widget messaging before starting it back up again. Some widgets // have startup routines that run when they are loaded, so we just need to reinitialize // the messaging for them. - ActiveWidgetStore.delWidgetMessaging(this.props.id); + ActiveWidgetStore.delWidgetMessaging(this.props.app.id); this._setupWidgetMessaging(); - ActiveWidgetStore.setRoomId(this.props.id, this.props.room.roomId); + ActiveWidgetStore.setRoomId(this.props.app.id, this.props.room.roomId); this.setState({loading: false}); } @@ -391,10 +410,10 @@ export default class AppTile extends React.Component { // FIXME: There's probably no reason to do this here: it should probably be done entirely // in ActiveWidgetStore. const widgetMessaging = new WidgetMessaging( - this.props.id, this.props.url, this.props.userWidget, this._appFrame.current.contentWindow); - ActiveWidgetStore.setWidgetMessaging(this.props.id, widgetMessaging); + this.props.app.id, this._getRenderedUrl(), this.props.userWidget, this._appFrame.current.contentWindow); + ActiveWidgetStore.setWidgetMessaging(this.props.app.id, widgetMessaging); widgetMessaging.getCapabilities().then((requestedCapabilities) => { - console.log(`Widget ${this.props.id} requested capabilities: ` + requestedCapabilities); + console.log(`Widget ${this.props.app.id} requested capabilities: ` + requestedCapabilities); requestedCapabilities = requestedCapabilities || []; // Allow whitelisted capabilities @@ -406,7 +425,7 @@ export default class AppTile extends React.Component { }, this.props.whitelistCapabilities); if (requestedWhitelistCapabilies.length > 0 ) { - console.warn(`Widget ${this.props.id} allowing requested, whitelisted properties: ` + + console.warn(`Widget ${this.props.app.id} allowing requested, whitelisted properties: ` + requestedWhitelistCapabilies, ); } @@ -414,7 +433,7 @@ export default class AppTile extends React.Component { // TODO -- Add UI to warn about and optionally allow requested capabilities - ActiveWidgetStore.setWidgetCapabilities(this.props.id, requestedWhitelistCapabilies); + ActiveWidgetStore.setWidgetCapabilities(this.props.app.id, requestedWhitelistCapabilies); if (this.props.onCapabilityRequest) { this.props.onCapabilityRequest(requestedCapabilities); @@ -422,16 +441,16 @@ export default class AppTile extends React.Component { // We only tell Jitsi widgets that we're ready because they're realistically the only ones // using this custom extension to the widget API. - if (this.props.type === 'jitsi') { + if (this.props.app.type === 'jitsi') { widgetMessaging.flagReadyToContinue(); } }).catch((err) => { - console.log(`Failed to get capabilities for widget type ${this.props.type}`, this.props.id, err); + console.log(`Failed to get capabilities for widget type ${this.props.app.type}`, this.props.app.id, err); }); } _onAction(payload) { - if (payload.widgetId === this.props.id) { + if (payload.widgetId === this.props.app.id) { switch (payload.action) { case 'm.sticker': if (this._hasCapability('m.sticker')) { @@ -460,9 +479,9 @@ export default class AppTile extends React.Component { _grantWidgetPermission() { const roomId = this.props.room.roomId; - console.info("Granting permission for widget to load: " + this.props.eventId); + console.info("Granting permission for widget to load: " + this.props.app.eventId); const current = SettingsStore.getValue("allowedWidgets", roomId); - current[this.props.eventId] = true; + current[this.props.app.eventId] = true; SettingsStore.setValue("allowedWidgets", roomId, SettingLevel.ROOM_ACCOUNT, current).then(() => { this.setState({hasPermissionToLoad: true}); @@ -476,14 +495,14 @@ export default class AppTile extends React.Component { _revokeWidgetPermission() { const roomId = this.props.room.roomId; - console.info("Revoking permission for widget to load: " + this.props.eventId); + console.info("Revoking permission for widget to load: " + this.props.app.eventId); const current = SettingsStore.getValue("allowedWidgets", roomId); - current[this.props.eventId] = false; + current[this.props.app.eventId] = false; SettingsStore.setValue("allowedWidgets", roomId, SettingLevel.ROOM_ACCOUNT, current).then(() => { this.setState({hasPermissionToLoad: false}); // Force the widget to be non-persistent (able to be deleted/forgotten) - ActiveWidgetStore.destroyPersistentWidget(this.props.id); + ActiveWidgetStore.destroyPersistentWidget(this.props.app.id); const PersistedElement = sdk.getComponent("elements.PersistedElement"); PersistedElement.destroyElement(this._persistKey); }).catch(err => { @@ -494,8 +513,8 @@ export default class AppTile extends React.Component { formatAppTileName() { let appTileName = "No name"; - if (this.props.name && this.props.name.trim()) { - appTileName = this.props.name.trim(); + if (this.props.app.name && this.props.app.name.trim()) { + appTileName = this.props.app.name.trim(); } return appTileName; } @@ -519,6 +538,60 @@ export default class AppTile extends React.Component { } } + /** + * Replace the widget template variables in a url with their values + * + * @returns {string} url with temlate variables replaced + */ + _templatedUrl(u) { + const myUserId = MatrixClientPeg.get().credentials.userId; + const myUser = MatrixClientPeg.get().getUser(myUserId); + const vars = Object.assign({ + domain: "jitsi.riot.im", // v1 widgets have this hardcoded + }, this.props.app.data, { + 'matrix_user_id': myUserId, + 'matrix_room_id': this.props.room.roomId, + 'matrix_display_name': myUser ? myUser.displayName : myUserId, + 'matrix_avatar_url': myUser ? MatrixClientPeg.get().mxcUrlToHttp(myUser.avatarUrl) : '', + + // TODO: Namespace themes through some standard + 'theme': SettingsStore.getValue("theme"), + }); + + if (vars.conferenceId === undefined) { + // we'll need to parse the conference ID out of the URL for v1 Jitsi widgets + const parsedUrl = new URL(this.props.app.url); + vars.conferenceId = parsedUrl.searchParams.get("confId"); + } + + return uriFromTemplate(u, vars); + } + + /** + * Get the URL used in the iframe + * In cases where we supply our own UI for a widget, this is an internal + * URL different to the one used if the widget is popped out to a separate + * tab / browser + * + * @returns {string} url + */ + _getRenderedUrl() { + let url; + + if (this.props.app.type === 'jitsi') { + console.log("Replacing Jitsi widget URL with local wrapper"); + url = WidgetUtils.getLocalJitsiWrapperUrl({forLocalRender: true}); + url = this._addWurlParams(url); + } else { + url = this._getSafeUrl(); + } + return this._templatedUrl(url); + } + + _getPopoutUrl() { + return this._templatedUrl(this._getSafeUrl()); + } + _getSafeUrl() { const parsedWidgetUrl = url.parse(this.state.widgetUrl, true); if (ENABLE_REACT_PERF) { @@ -526,13 +599,7 @@ export default class AppTile extends React.Component { parsedWidgetUrl.query.react_perf = true; } let safeWidgetUrl = ''; - if (ALLOWED_APP_URL_SCHEMES.includes(parsedWidgetUrl.protocol) || ( - // Check if the widget URL is a Jitsi widget in Electron - parsedWidgetUrl.protocol === 'vector:' - && parsedWidgetUrl.host === 'vector' - && parsedWidgetUrl.pathname === '/webapp/jitsi.html' - && this.props.type === 'jitsi' - )) { + if (ALLOWED_APP_URL_SCHEMES.includes(parsedWidgetUrl.protocol)) { safeWidgetUrl = url.format(parsedWidgetUrl); } return safeWidgetUrl; @@ -562,9 +629,9 @@ export default class AppTile extends React.Component { _onPopoutWidgetClick() { // Using Object.assign workaround as the following opens in a new window instead of a new tab. - // window.open(this._getSafeUrl(), '_blank', 'noopener=yes'); + // window.open(this._getPopoutUrl(), '_blank', 'noopener=yes'); Object.assign(document.createElement('a'), - { target: '_blank', href: this._getSafeUrl(), rel: 'noreferrer noopener'}).click(); + { target: '_blank', href: this._getPopoutUrl(), rel: 'noreferrer noopener'}).click(); } _onReloadWidgetClick() { @@ -641,7 +708,7 @@ export default class AppTile extends React.Component {