diff --git a/res/css/_common.scss b/res/css/_common.scss index 4399fb224e..fd93c8c967 100644 --- a/res/css/_common.scss +++ b/res/css/_common.scss @@ -82,13 +82,6 @@ input[type=search]::-webkit-search-results-decoration { display: none; } -.input[type=text]::-webkit-input-placeholder, -.input[type=text]::-moz-placeholder, -.input[type=search]::-webkit-input-placeholder, -.input[type=search]::-moz-placeholder { - color: #a5aab2; -} - // Override Firefox's UA style so we get a consistent look across browsers input::placeholder, textarea::placeholder { @@ -111,6 +104,71 @@ textarea { color: $primary-fg-color; } +// .mx_textinput is a container for a text input +// + some other controls like buttons, ... +// it has the appearance of a text box so the controls +// appear to be part of the input + +.mx_Dialog, .mx_MatrixChat { + :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=text], + :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=search], + .mx_textinput { + display: block; + box-sizing: border-box; + background-color: transparent; + color: $input-darker-fg-color; + border-radius: 4px; + border: 1px solid #c1c1c1; + // these things should probably not be defined + // globally + margin: 9px; + flex: 0 0 auto; + } + + .mx_textinput { + display: flex; + align-items: center; + + > input[type=text], + > input[type=search] { + border: none; + flex: 1; + color: $primary-fg-color; + } + } + + :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=text]::placeholder, + :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=search]::placeholder, + .mx_textinput input::placeholder { + color: $roomsublist-label-fg-color; + } +} + +/*** panels ***/ +.dark-panel { + background-color: $dark-panel-bg-color; +} + +.dark-panel { + :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=text], + :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=search], + .mx_textinput { + color: $input-darker-fg-color; + background-color: $input-darker-bg-color; + border: none; + } +} + +.light-panel { + :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=text], + :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=search], + .mx_textinput { + color: $input-lighter-fg-color; + background-color: $input-lighter-bg-color; + border: none; + } +} + /* Prevent ugly dotted highlight around selected elements in Firefox */ ::-moz-focus-inner { border: 0; diff --git a/res/css/structures/_MyGroups.scss b/res/css/structures/_MyGroups.scss index b3a5c4f473..4428eadc48 100644 --- a/res/css/structures/_MyGroups.scss +++ b/res/css/structures/_MyGroups.scss @@ -49,11 +49,11 @@ limitations under the License. height: 40px; width: 40px; border-radius: 20px; - background-color: $roomheader-addroom-color; + background-color: $roomheader-addroom-bg-color; position: relative; &:before { - background-color: $accent-fg-color; + background-color: $roomheader-addroom-fg-color; mask: url('$(res)/img/icons-create-room.svg'); mask-repeat: no-repeat; mask-position: center; diff --git a/res/css/structures/_RoomSubList.scss b/res/css/structures/_RoomSubList.scss index f76df1f683..235e636c35 100644 --- a/res/css/structures/_RoomSubList.scss +++ b/res/css/structures/_RoomSubList.scss @@ -83,15 +83,24 @@ limitations under the License. } .mx_RoomSubList_addRoom { - background-color: $roomheader-addroom-color; - color: $roomsublist-background; - background-image: url('$(res)/img/icons-room-add.svg'); - background-repeat: no-repeat; - background-position: center; + background-color: $roomheader-addroom-bg-color; border-radius: 10px; // 16/2 + 2 padding height: 16px; flex: 0 0 16px; - background-clip: content-box; + position: relative; + + &:before { + background-color: $roomheader-addroom-fg-color; + mask: url('$(res)/img/icons-room-add.svg'); + mask-repeat: no-repeat; + mask-position: center; + content: ''; + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + } } .mx_RoomSubList_badgeHighlight { diff --git a/res/css/views/rooms/_EventTile.scss b/res/css/views/rooms/_EventTile.scss index 6a847e58bc..b06e2a5391 100644 --- a/res/css/views/rooms/_EventTile.scss +++ b/res/css/views/rooms/_EventTile.scss @@ -45,14 +45,14 @@ limitations under the License. .mx_EventTile .mx_SenderProfile { color: $primary-fg-color; font-size: 14px; - display: block; /* anti-zalgo, with overflow hidden */ + display: inline-block; /* anti-zalgo, with overflow hidden */ overflow-y: hidden; cursor: pointer; padding-left: 65px; /* left gutter */ padding-bottom: 0px; padding-top: 0px; margin: 0px; - line-height: 22px; + line-height: 17px; } .mx_EventTile .mx_SenderProfile .mx_Flair { @@ -408,7 +408,13 @@ limitations under the License. .mx_EventTile_content .markdown-body code { // deliberate constants as we're behind an invert filter background-color: #f8f8f8; - color: #333; +} + +.mx_EventTile_content .markdown-body { + pre, code { + // deliberate constants as we're behind an invert filter + color: #333; + } } .mx_EventTile_pre_container { diff --git a/res/css/views/rooms/_MemberInfo.scss b/res/css/views/rooms/_MemberInfo.scss index 707c186518..60faf3ef13 100644 --- a/res/css/views/rooms/_MemberInfo.scss +++ b/res/css/views/rooms/_MemberInfo.scss @@ -34,6 +34,10 @@ limitations under the License. height: 16px; padding: 10px 15px; cursor: pointer; + mask-image: url('$(res)/img/minimise.svg'); + mask-repeat: no-repeat; + mask-position: center; + background-color: $rightpanel-button-color; } .mx_MemberInfo_name h2 { diff --git a/res/css/views/rooms/_MessageComposer.scss b/res/css/views/rooms/_MessageComposer.scss index db8eb4995d..89115669d3 100644 --- a/res/css/views/rooms/_MessageComposer.scss +++ b/res/css/views/rooms/_MessageComposer.scss @@ -255,14 +255,29 @@ limitations under the License. } .mx_MessageComposer_formatbar_markdown { + height: 17px; + width: 30px; margin-right: 64px; } .mx_MessageComposer_input_markdownIndicator { - cursor: pointer; height: 10px; + width: 12px; padding: 4px 4px 4px 0; - opacity: 0.8; +} + +.mx_MessageComposer_formatbar_markdown, +.mx_MessageComposer_input_markdownIndicator { + cursor: pointer; + mask-image: url('$(res)/img/markdown.svg'); + mask-size: contain; + mask-position: center; + mask-repeat: no-repeat; + background-color: $composer-button-color; + + &.mx_MessageComposer_markdownDisabled { + opacity: 0.2; + } } .mx_MatrixChat_useCompactLayout { diff --git a/res/img/button-md-false.png b/res/img/button-md-false.png deleted file mode 100644 index 6debbccc93..0000000000 Binary files a/res/img/button-md-false.png and /dev/null differ diff --git a/res/img/button-md-false.svg b/res/img/button-md-false.svg deleted file mode 100644 index 6414933d96..0000000000 --- a/res/img/button-md-false.svg +++ /dev/null @@ -1,29 +0,0 @@ - - - - D335F9E8-C813-47D7-B1BE-C8DEF2C8214F - Created with sketchtool. - - - - - - - - - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/res/img/button-md-false@2x.png b/res/img/button-md-false@2x.png deleted file mode 100644 index 497f5385d1..0000000000 Binary files a/res/img/button-md-false@2x.png and /dev/null differ diff --git a/res/img/button-md-false@3x.png b/res/img/button-md-false@3x.png deleted file mode 100644 index 1184e6b351..0000000000 Binary files a/res/img/button-md-false@3x.png and /dev/null differ diff --git a/res/img/button-md-true.png b/res/img/button-md-true.png deleted file mode 100644 index 2e39c55e1e..0000000000 Binary files a/res/img/button-md-true.png and /dev/null differ diff --git a/res/img/button-md-true.svg b/res/img/button-md-true.svg deleted file mode 100644 index 2acc4f675c..0000000000 --- a/res/img/button-md-true.svg +++ /dev/null @@ -1,14 +0,0 @@ - - - - 2A63B135-4281-4FBB-A88C-012AE22E9594 - Created with sketchtool. - - - - - - - - - \ No newline at end of file diff --git a/res/img/button-md-true@2x.png b/res/img/button-md-true@2x.png deleted file mode 100644 index ad9067f385..0000000000 Binary files a/res/img/button-md-true@2x.png and /dev/null differ diff --git a/res/img/button-md-true@3x.png b/res/img/button-md-true@3x.png deleted file mode 100644 index d615867dc4..0000000000 Binary files a/res/img/button-md-true@3x.png and /dev/null differ diff --git a/res/img/markdown.svg b/res/img/markdown.svg new file mode 100644 index 0000000000..9aadd3cb7f --- /dev/null +++ b/res/img/markdown.svg @@ -0,0 +1,3 @@ + + + diff --git a/res/themes/dark/css/_dark.scss b/res/themes/dark/css/_dark.scss index 11a6b5e728..35ba1ce53c 100644 --- a/res/themes/dark/css/_dark.scss +++ b/res/themes/dark/css/_dark.scss @@ -1,7 +1,7 @@ // unified palette // try to use these colors when possible $bg-color: #181b21; -$base-color: #1b1f25; +$base-color: #15171b; $base-text-color: #edf3ff; $header-panel-bg-color: #22262e; $header-panel-border-color: #000000; @@ -25,6 +25,8 @@ $focus-bg-color: $room-highlight-color; $mention-user-pill-bg-color: $warning-color; $other-user-pill-bg-color: $room-highlight-color; +$rte-room-pill-color: $room-highlight-color; +$rte-group-pill-color: $room-highlight-color; // informational plinth $info-plinth-bg-color: $header-panel-bg-color; @@ -38,7 +40,7 @@ $tagpanel-bg-color: $base-color; $selected-color: $room-highlight-color; // selected for hoverover & selected event tiles -$event-selected-color: $search-bg-color; +$event-selected-color: #111316; // used for the hairline dividers in RoomView $primary-hairline-color: $header-panel-border-color; @@ -69,6 +71,11 @@ $avatar-bg-color: $bg-color; $h3-color: $primary-fg-color; +$dialog-title-fg-color: #454545; +$dialog-backdrop-color: #000; +$dialog-shadow-color: rgba(0, 0, 0, 0.48); +$dialog-close-fg-color: #9fa9ba; + $dialog-background-bg-color: $header-panel-bg-color; $lightbox-background-bg-color: #000; @@ -82,7 +89,8 @@ $settings-subsection-fg-color: $text-secondary-color; $topleftmenu-color: $text-primary-color; $roomheader-color: $text-primary-color; -$roomheader-addroom-color: $header-panel-text-primary-color; +$roomheader-addroom-bg-color: #3c4556; // $search-placeholder-color at 0.5 opacity +$roomheader-addroom-fg-color: $text-primary-color; $tagpanel-button-color: $header-panel-text-primary-color; $roomheader-button-color: $header-panel-text-primary-color; $groupheader-button-color: $header-panel-text-primary-color; @@ -103,7 +111,7 @@ $roomtile-transparent-focused-color: rgba(0, 0, 0, 0.1); $panel-divider-color: $header-panel-border-color; -$widget-menu-bar-bg-color: $search-bg-color; +$widget-menu-bar-bg-color: $header-panel-bg-color; // event redaction $event-redacted-fg-color: #606060; @@ -131,61 +139,9 @@ $button-danger-disabled-bg-color: #f5b6bb; // TODO: Verify color $room-warning-bg-color: $header-panel-bg-color; +$dark-panel-bg-color: $header-panel-bg-color; $panel-gradient: rgba(34, 38, 46, 0), rgba(34, 38, 46, 1); -/*** form elements ***/ - -// .mx_textinput is a container for a text input -// + some other controls like buttons, ... -// it has the appearance of a text box so the controls -// appear to be part of the input - -.mx_Dialog, .mx_MatrixChat { - - :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=text], - :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=search], - .mx_textinput { - background-color: transparent; - color: $input-darker-fg-color; - border: 1px solid #c1c1c1; - } - - .mx_textinput { - > input[type=text], - > input[type=search] { - color: $primary-fg-color; - } - input::placeholder { - color: $roomsublist-label-fg-color; - } - } -} - -/*** panels ***/ -.dark-panel { - background-color: $header-panel-bg-color; -} - -.dark-panel { - :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=text], - :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=search], - .mx_textinput { - color: $input-darker-fg-color; - background-color: $input-darker-bg-color; - border: none; - } -} - -.light-panel { - :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=text], - :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=search], - .mx_textinput { - color: $input-lighter-fg-color; - background-color: $input-lighter-bg-color; - border: none; - } -} - // ***** Mixins! ***** @define-mixin mx_DialogButton { diff --git a/res/themes/light/css/_light.scss b/res/themes/light/css/_light.scss index 7bd84d6191..76dc49a838 100644 --- a/res/themes/light/css/_light.scss +++ b/res/themes/light/css/_light.scss @@ -14,7 +14,7 @@ $notice-secondary-color: #61708b; $header-panel-bg-color: #f2f5f8; // typical text (dark-on-white in light skin) -$primary-fg-color: #454545; +$primary-fg-color: #2e2f32; $primary-bg-color: #ffffff; // used for dialog box text @@ -54,7 +54,7 @@ $preview-bar-bg-color: #f7f7f7; $secondary-accent-color: #f2f5f8; $tertiary-accent-color: #d3efe1; -$tagpanel-bg-color: #2e3649; +$tagpanel-bg-color: #27303a; // used by RoomDirectory permissions $plinth-bg-color: $secondary-accent-color; @@ -105,7 +105,7 @@ $avatar-bg-color: #ffffff; $h3-color: #3d3b39; -$dialog-title-fg-color: #454545; +$dialog-title-fg-color: #2e2f32; $dialog-backdrop-color: rgba(46, 48, 51, 0.38); $dialog-shadow-color: rgba(0, 0, 0, 0.48); $dialog-close-fg-color: #9fa9ba; @@ -132,7 +132,7 @@ $settings-profile-placeholder-bg-color: #e7e7e7; $settings-profile-overlay-bg-color: #000; $settings-profile-overlay-placeholder-bg-color: transparent; $settings-profile-overlay-fg-color: #fff; -$settings-profile-overlay-placeholder-fg-color: #454545; +$settings-profile-overlay-placeholder-fg-color: #2e2f32; $settings-subsection-fg-color: #61708b; $voip-decline-color: #f48080; @@ -145,7 +145,8 @@ $rte-group-pill-color: #aaa; $topleftmenu-color: #212121; $roomheader-color: #45474a; -$roomheader-addroom-color: #91A1C0; +$roomheader-addroom-bg-color: #91A1C0; +$roomheader-addroom-fg-color: $accent-fg-color; $tagpanel-button-color: #91A1C0; $roomheader-button-color: #91A1C0; $groupheader-button-color: #91A1C0; @@ -246,111 +247,12 @@ $authpage-bg-color: #2e3649; $authpage-modal-bg-color: rgba(255, 255, 255, 0.59); $authpage-body-bg-color: #ffffff; $authpage-lang-color: #4e5054; -$authpage-primary-color: #454545; +$authpage-primary-color: #232f32; $authpage-secondary-color: #61708b; +$dark-panel-bg-color: $secondary-accent-color; $panel-gradient: rgba(242, 245, 248, 0), rgba(242, 245, 248, 1); -/*** form elements ***/ - -// .mx_textinput is a container for a text input -// + some other controls like buttons, ... -// it has the appearance of a text box so the controls -// appear to be part of the input - -.mx_Dialog, .mx_MatrixChat { - - :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=text], - :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=search], - .mx_textinput { - display: block; - box-sizing: border-box; - background-color: transparent; - color: $input-darker-fg-color; - border-radius: 4px; - border: 1px solid #c1c1c1; - // these things should probably not be defined - // globally - margin: 9px; - flex: 0 0 auto; - } - - .mx_textinput { - display: flex; - align-items: center; - - > input[type=text], - > input[type=search] { - border: none; - flex: 1; - color: $primary-fg-color; - } - input::placeholder { - color: $roomsublist-label-fg-color; - } - } -} - -/*** panels ***/ -.dark-panel { - background-color: $secondary-accent-color; -} - -.dark-panel { - :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=text], - :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=search], - .mx_textinput { - color: $input-darker-fg-color; - background-color: $input-darker-bg-color; - border: none; - } -} - -.light-panel { - :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=text], - :not(.mx_textinput):not(.mx_Field):not(.mx_no_textinput) > input[type=search], - .mx_textinput { - color: $input-lighter-fg-color; - background-color: $input-lighter-bg-color; - border: none; - } -} - -input[type=text].mx_textinput_icon, -input[type=search].mx_textinput_icon { - padding-left: 36px; - background-repeat: no-repeat; - background-position: 10px center; -} - -// FIXME THEME - Tint by CSS rather than referencing a duplicate asset -input[type=text].mx_textinput_icon.mx_textinput_search, -input[type=search].mx_textinput_icon.mx_textinput_search { - background-image: url('$(res)/img/feather-icons/search-input.svg'); -} - -// dont search UI as not all browsers support it, -// we implement it ourselves where needed instead -input[type=search]::-webkit-search-decoration, -input[type=search]::-webkit-search-cancel-button, -input[type=search]::-webkit-search-results-button, -input[type=search]::-webkit-search-results-decoration { - display: none; -} - -.input[type=text]::-webkit-input-placeholder, -.input[type=text]::-moz-placeholder, -.input[type=search]::-webkit-input-placeholder, -.input[type=search]::-moz-placeholder { - color: #a5aab2; -} - -// Override Firefox's UA style so we get a consistent look across browsers -input::placeholder, -textarea::placeholder { - opacity: initial; -} - // ***** Mixins! ***** @define-mixin mx_DialogButton { diff --git a/src/components/structures/auth/Registration.js b/src/components/structures/auth/Registration.js index 6b578f0f68..03c7645721 100644 --- a/src/components/structures/auth/Registration.js +++ b/src/components/structures/auth/Registration.js @@ -505,14 +505,9 @@ module.exports = React.createClass({ errorText =
{ err }
; } - let signIn; - if (!this.state.doingUIAuth) { - signIn = ( - - { _t('Sign in instead') } - - ); - } + const signIn = + { _t('Sign in instead') } + ; return ( diff --git a/src/components/views/auth/CaptchaForm.js b/src/components/views/auth/CaptchaForm.js index ca450c5df4..bb4785f299 100644 --- a/src/components/views/auth/CaptchaForm.js +++ b/src/components/views/auth/CaptchaForm.js @@ -17,7 +17,6 @@ limitations under the License. 'use strict'; import React from 'react'; -import ReactDOM from 'react-dom'; import PropTypes from 'prop-types'; import { _t } from '../../../languageHandler'; @@ -61,29 +60,15 @@ module.exports = React.createClass({ } else { console.log("Loading recaptcha script..."); window.mx_on_recaptcha_loaded = () => {this._onCaptchaLoaded();}; - const protocol = global.location.protocol; + let protocol = global.location.protocol; if (protocol === "vector:") { - const warning = document.createElement('div'); - // XXX: fix hardcoded app URL. Better solutions include: - // * jumping straight to a hosted captcha page (but we don't support that yet) - // * embedding the captcha in an iframe (if that works) - // * using a better captcha lib - ReactDOM.render(_t( - "Robot check is currently unavailable on desktop - please use a web browser", - {}, - { - 'a': (sub) => { - return { sub }; - }, - }), warning); - this.refs.recaptchaContainer.appendChild(warning); - } else { - const scriptTag = document.createElement('script'); - scriptTag.setAttribute( - 'src', protocol+"//www.google.com/recaptcha/api.js?onload=mx_on_recaptcha_loaded&render=explicit", - ); - this.refs.recaptchaContainer.appendChild(scriptTag); + protocol = "https:"; } + const scriptTag = document.createElement('script'); + scriptTag.setAttribute( + 'src', `${protocol}//www.google.com/recaptcha/api.js?onload=mx_on_recaptcha_loaded&render=explicit`, + ); + this.refs.recaptchaContainer.appendChild(scriptTag); } }, @@ -141,8 +126,9 @@ module.exports = React.createClass({ return (
- { _t("This homeserver would like to make sure you are not a robot.") } -
+

{_t( + "This homeserver would like to make sure you are not a robot.", + )}

{ error }
diff --git a/src/components/views/rooms/MemberInfo.js b/src/components/views/rooms/MemberInfo.js index f4c600af8d..c7ea54a4c8 100644 --- a/src/components/views/rooms/MemberInfo.js +++ b/src/components/views/rooms/MemberInfo.js @@ -983,9 +983,10 @@ module.exports = withMatrixClient(React.createClass({ return (
- - {_t('Close')} - + { e2eIconElement } { memberName }
diff --git a/src/components/views/rooms/MessageComposer.js b/src/components/views/rooms/MessageComposer.js index 10142b2b4b..7eef868ef7 100644 --- a/src/components/views/rooms/MessageComposer.js +++ b/src/components/views/rooms/MessageComposer.js @@ -499,15 +499,16 @@ export default class MessageComposer extends React.Component {
{ formatButtons } -
- +
+ + onClick={this.onToggleFormattingClicked} + className="mx_MessageComposer_formatbar_cancel mx_filterFlipColor" + src={require("../../../../res/img/icon-text-cancel.svg")} + />
; } diff --git a/src/components/views/rooms/MessageComposerInput.js b/src/components/views/rooms/MessageComposerInput.js index ab89e402ae..1954ca0d84 100644 --- a/src/components/views/rooms/MessageComposerInput.js +++ b/src/components/views/rooms/MessageComposerInput.js @@ -60,6 +60,7 @@ import ReplyPreview from "./ReplyPreview"; import RoomViewStore from '../../../stores/RoomViewStore'; import ReplyThread from "../elements/ReplyThread"; import {ContentHelpers} from 'matrix-js-sdk'; +import AccessibleButton from '../elements/AccessibleButton'; const EMOJI_UNICODE_TO_SHORTNAME = mapUnicodeToShort(); const REGEX_EMOJI_WHITESPACE = new RegExp('(?:^|\\s)(' + asciiRegexp + ')\\s$'); @@ -1582,6 +1583,11 @@ export default class MessageComposerInput extends React.Component { placeholder = undefined; } + const markdownClasses = classNames({ + mx_MessageComposer_input_markdownIndicator: true, + mx_MessageComposer_markdownDisabled: this.state.isRichTextEnabled, + }); + return (
@@ -1596,10 +1602,10 @@ export default class MessageComposerInput extends React.Component { />
- + {_t("Theme")} - + diff --git a/src/components/views/settings/tabs/RolesRoomSettingsTab.js b/src/components/views/settings/tabs/RolesRoomSettingsTab.js index 2195017782..d223e8f2e9 100644 --- a/src/components/views/settings/tabs/RolesRoomSettingsTab.js +++ b/src/components/views/settings/tabs/RolesRoomSettingsTab.js @@ -116,7 +116,8 @@ export default class RolesRoomSettingsTab extends React.Component { _onPowerLevelsChanged = (value, powerLevelKey) => { const client = MatrixClientPeg.get(); const room = client.getRoom(this.props.roomId); - let plContent = room.currentState.getStateEvents('m.room.power_levels', '').getContent() || {}; + const plEvent = room.currentState.getStateEvents('m.room.power_levels', ''); + let plContent = plEvent ? (plEvent.getContent() || {}) : {}; // Clone the power levels just in case plContent = Object.assign({}, plContent); @@ -151,7 +152,8 @@ export default class RolesRoomSettingsTab extends React.Component { const client = MatrixClientPeg.get(); const room = client.getRoom(this.props.roomId); - const plContent = room.currentState.getStateEvents('m.room.power_levels', '').getContent() || {}; + const plEvent = room.currentState.getStateEvents('m.room.power_levels', ''); + const plContent = plEvent ? (plEvent.getContent() || {}) : {}; const canChangeLevels = room.currentState.mayClientSendStateEvent('m.room.power_levels', client); const powerLevelDescriptors = { diff --git a/src/components/views/settings/tabs/SecurityRoomSettingsTab.js b/src/components/views/settings/tabs/SecurityRoomSettingsTab.js index 593e8151d2..698f67dd18 100644 --- a/src/components/views/settings/tabs/SecurityRoomSettingsTab.js +++ b/src/components/views/settings/tabs/SecurityRoomSettingsTab.js @@ -43,13 +43,31 @@ export default class SecurityRoomSettingsTab extends React.Component { const room = MatrixClientPeg.get().getRoom(this.props.roomId); const state = room.currentState; - const joinRule = state.getStateEvents("m.room.join_rules", "").getContent()['join_rule']; - const guestAccess = state.getStateEvents("m.room.guest_access", "").getContent()['guest_access']; - const history = state.getStateEvents("m.room.history_visibility", "").getContent()['history_visibility']; + + const joinRule = this._pullContentPropertyFromEvent( + state.getStateEvents("m.room.join_rules", ""), + 'join_rule', + 'invite', + ); + const guestAccess = this._pullContentPropertyFromEvent( + state.getStateEvents("m.room.guest_access", ""), + 'guest_access', + 'forbidden', + ); + const history = this._pullContentPropertyFromEvent( + state.getStateEvents("m.room.history_visibility", ""), + 'history_visibility', + 'shared', + ); const encrypted = MatrixClientPeg.get().isRoomEncrypted(this.props.roomId); this.setState({joinRule, guestAccess, history, encrypted}); } + _pullContentPropertyFromEvent(event, key, defaultValue) { + if (!event || !event.getContent()) return defaultValue; + return event.getContent()[key] || defaultValue; + } + componentWillUnmount(): void { MatrixClientPeg.get().removeListener("RoomState.events", this._onStateEvent); } diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index c53b242c3d..c8b8018b5f 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -520,7 +520,7 @@ "Phone numbers": "Phone numbers", "Language and region": "Language and region", "Theme": "Theme", - "Default theme": "Default theme", + "Light theme": "Light theme", "Dark theme": "Dark theme", "Account management": "Account management", "Deactivating your account is a permanent action - be careful!": "Deactivating your account is a permanent action - be careful!", @@ -1221,7 +1221,6 @@ "Sign in": "Sign in", "Login": "Login", "powered by Matrix": "powered by Matrix", - "Robot check is currently unavailable on desktop - please use a web browser": "Robot check is currently unavailable on desktop - please use a web browser", "This homeserver would like to make sure you are not a robot.": "This homeserver would like to make sure you are not a robot.", "Custom Server Options": "Custom Server Options", "You can use the custom server options to sign into other Matrix servers by specifying a different homeserver URL. This allows you to use this app with an existing Matrix account on a different homeserver.": "You can use the custom server options to sign into other Matrix servers by specifying a different homeserver URL. This allows you to use this app with an existing Matrix account on a different homeserver.",