From b8040a5739c168434586ffe4d510041f675181fa Mon Sep 17 00:00:00 2001 From: Kerry Date: Fri, 1 Apr 2022 08:45:50 +0200 Subject: [PATCH 01/16] Typescriptification - notification utils (#8209) * rename ContentRules to ts Signed-off-by: Kerry Archibald * prvstest to ts Signed-off-by: Kerry Archibald * QueryMatcher-test to ts Signed-off-by: Kerry Archibald * UserActivity-test to ts Signed-off-by: Kerry Archibald * fix ts issues Signed-off-by: Kerry Archibald --- ...rActivity-test.js => UserActivity-test.ts} | 0 ...ryMatcher-test.js => QueryMatcher-test.ts} | 0 ...tentRules-test.js => ContentRules-test.ts} | 24 +++--- .../notifications/PushRuleVectorState-test.js | 60 --------------- .../notifications/PushRuleVectorState-test.ts | 75 +++++++++++++++++++ 5 files changed, 88 insertions(+), 71 deletions(-) rename test/{UserActivity-test.js => UserActivity-test.ts} (100%) rename test/autocomplete/{QueryMatcher-test.js => QueryMatcher-test.ts} (100%) rename test/notifications/{ContentRules-test.js => ContentRules-test.ts} (81%) delete mode 100644 test/notifications/PushRuleVectorState-test.js create mode 100644 test/notifications/PushRuleVectorState-test.ts diff --git a/test/UserActivity-test.js b/test/UserActivity-test.ts similarity index 100% rename from test/UserActivity-test.js rename to test/UserActivity-test.ts diff --git a/test/autocomplete/QueryMatcher-test.js b/test/autocomplete/QueryMatcher-test.ts similarity index 100% rename from test/autocomplete/QueryMatcher-test.js rename to test/autocomplete/QueryMatcher-test.ts diff --git a/test/notifications/ContentRules-test.js b/test/notifications/ContentRules-test.ts similarity index 81% rename from test/notifications/ContentRules-test.js rename to test/notifications/ContentRules-test.ts index 2b18a18488..9881a1c149 100644 --- a/test/notifications/ContentRules-test.js +++ b/test/notifications/ContentRules-test.ts @@ -1,5 +1,6 @@ /* Copyright 2016 OpenMarket Ltd +Copyright 2022 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. @@ -14,16 +15,16 @@ See the License for the specific language governing permissions and limitations under the License. */ -const notifications = require('../../src/notifications'); +import { TweakName, PushRuleActionName, TweakHighlight, TweakSound } from "matrix-js-sdk/src/matrix"; -const ContentRules = notifications.ContentRules; -const PushRuleVectorState = notifications.PushRuleVectorState; +import { ContentRules, PushRuleVectorState } from "../../src/notifications"; const NORMAL_RULE = { actions: [ - "notify", - { set_tweak: "highlight", value: false }, + PushRuleActionName.Notify, + { set_tweak: TweakName.Highlight, value: false } as TweakHighlight, ], + default: false, enabled: true, pattern: "vdh2", rule_id: "vdh2", @@ -31,10 +32,11 @@ const NORMAL_RULE = { const LOUD_RULE = { actions: [ - "notify", - { set_tweak: "highlight" }, - { set_tweak: "sound", value: "default" }, + PushRuleActionName.Notify, + { set_tweak: TweakName.Highlight } as TweakHighlight, + { set_tweak: TweakName.Sound, value: "default" } as TweakSound, ], + default: false, enabled: true, pattern: "vdh2", rule_id: "vdh2", @@ -42,9 +44,9 @@ const LOUD_RULE = { const USERNAME_RULE = { actions: [ - "notify", - { set_tweak: "sound", value: "default" }, - { set_tweak: "highlight" }, + PushRuleActionName.Notify, + { set_tweak: TweakName.Sound, value: "default" } as TweakSound, + { set_tweak: TweakName.Highlight } as TweakHighlight, ], default: true, enabled: true, diff --git a/test/notifications/PushRuleVectorState-test.js b/test/notifications/PushRuleVectorState-test.js deleted file mode 100644 index 1127675791..0000000000 --- a/test/notifications/PushRuleVectorState-test.js +++ /dev/null @@ -1,60 +0,0 @@ -/* -Copyright 2016 OpenMarket 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. -*/ - -const notifications = require('../../src/notifications'); - -const prvs = notifications.PushRuleVectorState; - -describe("PushRuleVectorState", function() { - describe("contentRuleVectorStateKind", function() { - it("should understand normal notifications", function() { - const rule = { - actions: [ - "notify", - ], - }; - - expect(prvs.contentRuleVectorStateKind(rule)). - toEqual(prvs.ON); - }); - - it("should handle loud notifications", function() { - const rule = { - actions: [ - "notify", - { set_tweak: "highlight", value: true }, - { set_tweak: "sound", value: "default" }, - ], - }; - - expect(prvs.contentRuleVectorStateKind(rule)). - toEqual(prvs.LOUD); - }); - - it("should understand missing highlight.value", function() { - const rule = { - actions: [ - "notify", - { set_tweak: "highlight" }, - { set_tweak: "sound", value: "default" }, - ], - }; - - expect(prvs.contentRuleVectorStateKind(rule)). - toEqual(prvs.LOUD); - }); - }); -}); diff --git a/test/notifications/PushRuleVectorState-test.ts b/test/notifications/PushRuleVectorState-test.ts new file mode 100644 index 0000000000..031944b84c --- /dev/null +++ b/test/notifications/PushRuleVectorState-test.ts @@ -0,0 +1,75 @@ +/* +Copyright 2016 OpenMarket Ltd +Copyright 2022 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 { + PushRuleActionName, + TweakHighlight, + TweakName, + TweakSound, +} from "matrix-js-sdk/src/matrix"; + +import { PushRuleVectorState } from "../../src/notifications"; + +describe("PushRuleVectorState", function() { + describe("contentRuleVectorStateKind", function() { + it("should understand normal notifications", function() { + const rule = { + actions: [ + PushRuleActionName.Notify, + ], + default: false, + enabled: false, + rule_id: '1', + }; + + expect(PushRuleVectorState.contentRuleVectorStateKind(rule)). + toEqual(PushRuleVectorState.ON); + }); + + it("should handle loud notifications", function() { + const rule = { + actions: [ + PushRuleActionName.Notify, + { set_tweak: TweakName.Highlight, value: true } as TweakHighlight, + { set_tweak: TweakName.Sound, value: "default" } as TweakSound, + ], + default: false, + enabled: false, + rule_id: '1', + }; + + expect(PushRuleVectorState.contentRuleVectorStateKind(rule)). + toEqual(PushRuleVectorState.LOUD); + }); + + it("should understand missing highlight.value", function() { + const rule = { + actions: [ + PushRuleActionName.Notify, + { set_tweak: TweakName.Highlight } as TweakHighlight, + { set_tweak: TweakName.Sound, value: "default" } as TweakSound, + ], + default: false, + enabled: false, + rule_id: '1', + }; + + expect(PushRuleVectorState.contentRuleVectorStateKind(rule)). + toEqual(PushRuleVectorState.LOUD); + }); + }); +}); From c9ffea2b53f925d4c78d802ea137bc979c192892 Mon Sep 17 00:00:00 2001 From: Germain Date: Fri, 1 Apr 2022 10:50:51 +0100 Subject: [PATCH 02/16] Make thread panel re-render the whole timeline on prop change (#8213) --- src/components/structures/ThreadPanel.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/structures/ThreadPanel.tsx b/src/components/structures/ThreadPanel.tsx index 5d272827e9..3364fdc27c 100644 --- a/src/components/structures/ThreadPanel.tsx +++ b/src/components/structures/ThreadPanel.tsx @@ -238,6 +238,7 @@ const ThreadPanel: React.FC = ({ /> { timelineSet && ( Date: Fri, 1 Apr 2022 14:06:41 +0100 Subject: [PATCH 03/16] Fix typo error (#8214) --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 9059c5b5b8..7044bb9681 100644 --- a/README.md +++ b/README.md @@ -57,7 +57,7 @@ tracks lots of state for its child components which it passes into them for visu rendering via props. Good separation between the components is maintained by adopting various best -practices that anyone working with the SDK needs to be be aware of and uphold: +practices that anyone working with the SDK needs to be aware of and uphold: * Components are named with upper camel case (e.g. views/rooms/EventTile.js) From 1f64835fabe9f3471c368da5169d2805a800cde8 Mon Sep 17 00:00:00 2001 From: Robin Date: Fri, 1 Apr 2022 10:36:10 -0400 Subject: [PATCH 04/16] Update video rooms to new design specs (#8207) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * Remove radio component * "Voice room" → "video room" * Remove interactivity from video room tiles * Update connection state when joining via widget * Simplify room header buttons for video rooms * Split out video room creation into a separate menu option * Simplify room options for video rooms * Update video room tile layout * Tell the Jitsi widget whether it's a video channel * Update tests * "Voice" → "video" in more places * Fix tests * Re-add frame to immersive Jitsi widgets * Comment ack * Make updateDevices more readable * Type FacePile --- res/css/_components.scss | 1 - res/css/structures/_RoomView.scss | 4 +- res/css/views/elements/_FacePile.scss | 2 +- res/css/views/rooms/_RoomList.scss | 5 +- res/css/views/rooms/_RoomListHeader.scss | 5 +- res/css/views/rooms/_RoomTile.scss | 256 ++++++++--------- res/css/views/voip/_VoiceChannelRadio.scss | 121 -------- res/img/voip/voice-room.svg | 3 - src/Lifecycle.ts | 3 + src/components/structures/LeftPanel.tsx | 2 - src/components/structures/MatrixChat.tsx | 6 +- src/components/structures/RoomView.tsx | 41 ++- src/components/structures/SpaceRoomView.tsx | 51 ++-- .../views/context_menus/RoomContextMenu.tsx | 96 ++++--- .../views/dialogs/CreateRoomDialog.tsx | 38 +-- src/components/views/elements/FacePile.tsx | 54 +--- .../views/right_panel/RoomSummaryCard.tsx | 25 +- src/components/views/rooms/RoomHeader.tsx | 1 + src/components/views/rooms/RoomList.tsx | 55 +++- src/components/views/rooms/RoomListHeader.tsx | 71 +++-- src/components/views/rooms/RoomTile.tsx | 217 ++++++-------- .../views/voip/VoiceChannelRadio.tsx | 91 ------ src/createRoom.ts | 10 +- src/i18n/strings/en_EN.json | 29 +- src/settings/Settings.tsx | 4 +- src/stores/VideoChannelStore.ts | 164 +++++++++++ src/stores/VoiceChannelStore.ts | 267 ------------------ ...ceChannelUtils.ts => VideoChannelUtils.ts} | 18 +- src/utils/WidgetUtils.ts | 3 + src/utils/space.tsx | 4 +- test/components/views/rooms/RoomTile-test.tsx | 68 ++--- .../views/voip/VoiceChannelRadio-test.tsx | 107 ------- .../src/usecases/create-room.ts | 2 +- test/stores/VideoChannelStore-test.ts | 83 ++++++ test/stores/VoiceChannelStore-test.ts | 95 ------- test/test-utils/index.ts | 2 +- test/test-utils/video.ts | 39 +++ test/test-utils/voice.ts | 60 ---- 38 files changed, 798 insertions(+), 1305 deletions(-) delete mode 100644 res/css/views/voip/_VoiceChannelRadio.scss delete mode 100644 res/img/voip/voice-room.svg delete mode 100644 src/components/views/voip/VoiceChannelRadio.tsx create mode 100644 src/stores/VideoChannelStore.ts delete mode 100644 src/stores/VoiceChannelStore.ts rename src/utils/{VoiceChannelUtils.ts => VideoChannelUtils.ts} (72%) delete mode 100644 test/components/views/voip/VoiceChannelRadio-test.tsx create mode 100644 test/stores/VideoChannelStore-test.ts delete mode 100644 test/stores/VoiceChannelStore-test.ts create mode 100644 test/test-utils/video.ts delete mode 100644 test/test-utils/voice.ts diff --git a/res/css/_components.scss b/res/css/_components.scss index 4c72550c15..3f3038ccfd 100644 --- a/res/css/_components.scss +++ b/res/css/_components.scss @@ -314,4 +314,3 @@ @import "./views/voip/_DialPadModal.scss"; @import "./views/voip/_PiPContainer.scss"; @import "./views/voip/_VideoFeed.scss"; -@import "./views/voip/_VoiceChannelRadio.scss"; diff --git a/res/css/structures/_RoomView.scss b/res/css/structures/_RoomView.scss index 10dbfae0ce..3547225ce7 100644 --- a/res/css/structures/_RoomView.scss +++ b/res/css/structures/_RoomView.scss @@ -218,9 +218,9 @@ hr.mx_RoomView_myReadMarker { margin-right: calc($container-gap-width / 2); width: auto; height: 100%; + padding-top: 33px; // to match the right panel chat heading - background: none; - border: none; + border-radius: 8px; } .mx_RoomView_callStatusBar .mx_UploadBar_uploadProgressInner { diff --git a/res/css/views/elements/_FacePile.scss b/res/css/views/elements/_FacePile.scss index fcde5eab83..3e83446b0e 100644 --- a/res/css/views/elements/_FacePile.scss +++ b/res/css/views/elements/_FacePile.scss @@ -20,7 +20,7 @@ limitations under the License. flex-direction: row-reverse; vertical-align: middle; - > * + * { + > .mx_FacePile_face + .mx_FacePile_face { margin-right: -8px; } diff --git a/res/css/views/rooms/_RoomList.scss b/res/css/views/rooms/_RoomList.scss index 029c5b6cdb..2763ad653f 100644 --- a/res/css/views/rooms/_RoomList.scss +++ b/res/css/views/rooms/_RoomList.scss @@ -21,9 +21,12 @@ limitations under the License. .mx_RoomList_iconPlus::before { mask-image: url('$(res)/img/element-icons/roomlist/plus-circle.svg'); } -.mx_RoomList_iconCreateNewRoom::before { +.mx_RoomList_iconNewRoom::before { mask-image: url('$(res)/img/element-icons/roomlist/hash-plus.svg'); } +.mx_RoomList_iconNewVideoRoom::before { + mask-image: url('$(res)/img/element-icons/call/video-call.svg'); +} .mx_RoomList_iconAddExistingRoom::before { mask-image: url('$(res)/img/element-icons/roomlist/hash.svg'); } diff --git a/res/css/views/rooms/_RoomListHeader.scss b/res/css/views/rooms/_RoomListHeader.scss index 442456ff0e..c4bc8c151f 100644 --- a/res/css/views/rooms/_RoomListHeader.scss +++ b/res/css/views/rooms/_RoomListHeader.scss @@ -103,9 +103,12 @@ limitations under the License. .mx_RoomListHeader_iconStartChat::before { mask-image: url('$(res)/img/element-icons/roomlist/member-plus.svg'); } -.mx_RoomListHeader_iconCreateRoom::before { +.mx_RoomListHeader_iconNewRoom::before { mask-image: url('$(res)/img/element-icons/roomlist/hash-plus.svg'); } +.mx_RoomListHeader_iconNewVideoRoom::before { + mask-image: url('$(res)/img/element-icons/call/video-call.svg'); +} .mx_RoomListHeader_iconExplore::before { mask-image: url('$(res)/img/element-icons/roomlist/hash-search.svg'); } diff --git a/res/css/views/rooms/_RoomTile.scss b/res/css/views/rooms/_RoomTile.scss index bf19e0632f..23fb4f1e9a 100644 --- a/res/css/views/rooms/_RoomTile.scss +++ b/res/css/views/rooms/_RoomTile.scss @@ -19,11 +19,12 @@ limitations under the License. margin-bottom: 4px; padding: 4px; + // The tile is also a flexbox row itself + display: flex; contain: content; // Not strict as it will break when resizing a sublist vertically box-sizing: border-box; - // The tile is also a flexbox row itself - display: flex; + font-size: $font-13px; &.mx_RoomTile_selected, &:hover, @@ -37,163 +38,136 @@ limitations under the License. margin-right: 10px; } - .mx_RoomTile_details { + .mx_RoomTile_titleContainer { + height: 32px; + min-width: 0; + flex-basis: 0; flex-grow: 1; - min-width: 0; // allow flex to shrink it + margin-right: 8px; // spacing to buttons/badges + + // Create a new column layout flexbox for the title parts display: flex; flex-direction: column; + justify-content: center; - .mx_RoomTile_primaryDetails { - height: 32px; - display: flex; - flex-wrap: wrap; + .mx_RoomTile_title, .mx_RoomTile_subtitle { + width: 100%; - .mx_RoomTile_titleContainer { - min-width: 0; - flex-basis: 0; - flex-grow: 1; - margin-right: 8px; // spacing to buttons/badges + // Ellipsize any text overflow + text-overflow: ellipsis; + overflow: hidden; + white-space: nowrap; + } - // Create a new column layout flexbox for the title parts - display: flex; - flex-direction: column; - justify-content: center; + .mx_RoomTile_title { + font-size: $font-14px; + line-height: $font-18px; - .mx_RoomTile_title, .mx_RoomTile_subtitle { - width: 100%; - - // Ellipsize any text overflow - text-overflow: ellipsis; - overflow: hidden; - white-space: nowrap; - } - - .mx_RoomTile_title { - font-size: $font-14px; - line-height: $font-18px; - } - - .mx_RoomTile_title.mx_RoomTile_titleHasUnreadEvents { - font-weight: 600; - } - - .mx_RoomTile_subtitle { - font-size: $font-13px; - line-height: $font-18px; - color: $secondary-content; - } - - .mx_RoomTile_subtitle.mx_RoomTile_voiceIndicator { - &::before { - display: inline-block; - vertical-align: text-bottom; - content: ''; - background-color: $secondary-content; - mask-image: url('$(res)/img/voip/voice-room.svg'); - mask-size: 16px; - width: 16px; - height: 16px; - margin-right: 4px; - } - - &.mx_RoomTile_voiceIndicator_active { - color: $accent; - - &::before { - background-color: $accent; - } - } - } - - .mx_RoomTile_titleWithSubtitle { - margin-top: -3px; // shift the title up a bit more - } - } - - .mx_RoomTile_notificationsButton { - margin-left: 4px; // spacing between buttons - } - - .mx_RoomTile_badgeContainer { - height: 16px; - // don't set width so that it takes no space when there is no badge to show - margin: auto 0; // vertically align - - // Create a flexbox to make aligning dot badges easier - display: flex; - align-items: center; - - .mx_NotificationBadge { - margin-right: 2px; // centering - } - - .mx_NotificationBadge_dot { - // make the smaller dot occupy the same width for centering - margin-left: 5px; - margin-right: 7px; - } - } - - // The context menu buttons are hidden by default - .mx_RoomTile_menuButton, - .mx_RoomTile_notificationsButton { - width: 20px; - min-width: 20px; // yay flex - height: 20px; - margin-top: auto; - margin-bottom: auto; - position: relative; - display: none; - - &::before { - top: 2px; - left: 2px; - content: ''; - width: 16px; - height: 16px; - position: absolute; - mask-position: center; - mask-size: contain; - mask-repeat: no-repeat; - background: $primary-content; - } - } - - // If the room has an overriden notification setting then we always show the notifications menu button - .mx_RoomTile_notificationsButton.mx_RoomTile_notificationsButton_show { - display: block; - } - - .mx_RoomTile_menuButton::before { - mask-image: url('$(res)/img/element-icons/context-menu.svg'); + &.mx_RoomTile_titleHasUnreadEvents { + font-weight: 600; } } - .mx_RoomTile_voiceChannel { - width: 100%; - display: flex; - align-items: center; - - .mx_FacePile { - margin: 6px 0 4px; - } - - .mx_RoomTile_connectVoiceButton { - font-weight: 600; - padding-left: 10px; - padding-right: 10px; + .mx_RoomTile_subtitle { + line-height: $font-18px; + color: $secondary-content; + .mx_RoomTile_videoIndicator { &::before { + display: inline-block; + vertical-align: text-bottom; content: ''; - background-color: $accent; - mask-image: url('$(res)/img/voip/voice-room.svg'); + background-color: $secondary-content; + mask-image: url('$(res)/img/element-icons/call/video-call.svg'); mask-size: 16px; width: 16px; height: 16px; margin-right: 4px; } + + &.mx_RoomTile_videoIndicator_active { + color: $accent; + + &::before { + background-color: $accent; + } + } + } + + .mx_RoomTile_videoParticipants::before { + display: inline-block; + vertical-align: text-bottom; + content: ''; + background-color: $secondary-content; + mask-image: url('$(res)/img/element-icons/group-members.svg'); + mask-size: 16px; + width: 16px; + height: 16px; + margin-right: 2px; } } + + .mx_RoomTile_titleWithSubtitle { + margin-top: -3px; // shift the title up a bit more + } + } + + .mx_RoomTile_notificationsButton { + margin-left: 4px; // spacing between buttons + } + + .mx_RoomTile_badgeContainer { + height: 16px; + // don't set width so that it takes no space when there is no badge to show + margin: auto 0; // vertically align + + // Create a flexbox to make aligning dot badges easier + display: flex; + align-items: center; + + .mx_NotificationBadge { + margin-right: 2px; // centering + } + + .mx_NotificationBadge_dot { + // make the smaller dot occupy the same width for centering + margin-left: 5px; + margin-right: 7px; + } + } + + // The context menu buttons are hidden by default + .mx_RoomTile_menuButton, + .mx_RoomTile_notificationsButton { + width: 20px; + min-width: 20px; // yay flex + height: 20px; + margin-top: auto; + margin-bottom: auto; + position: relative; + display: none; + + &::before { + top: 2px; + left: 2px; + content: ''; + width: 16px; + height: 16px; + position: absolute; + mask-position: center; + mask-size: contain; + mask-repeat: no-repeat; + background: $primary-content; + } + } + + // If the room has an overriden notification setting then we always show the notifications menu button + .mx_RoomTile_notificationsButton.mx_RoomTile_notificationsButton_show { + display: block; + } + + .mx_RoomTile_menuButton::before { + mask-image: url('$(res)/img/element-icons/context-menu.svg'); } &:not(.mx_RoomTile_minimized) { @@ -222,10 +196,6 @@ limitations under the License. .mx_DecoratedRoomAvatar, .mx_RoomTile_avatarContainer { margin-right: 0; } - - .mx_RoomTile_details { - display: none; - } } } diff --git a/res/css/views/voip/_VoiceChannelRadio.scss b/res/css/views/voip/_VoiceChannelRadio.scss deleted file mode 100644 index d67a5b312f..0000000000 --- a/res/css/views/voip/_VoiceChannelRadio.scss +++ /dev/null @@ -1,121 +0,0 @@ -/* -Copyright 2022 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. -*/ - -.mx_VoiceChannelRadio { - background-color: $system; - - > .mx_VoiceChannelRadio_statusBar { - display: flex; - padding: 12px 16px; - align-items: center; - gap: 12px; - - > .mx_VoiceChannelRadio_titleContainer { - flex-grow: 1; - - > .mx_VoiceChannelRadio_status { - font-size: $font-15px; - color: $accent; - - &::before { - content: ''; - display: inline-block; - margin-right: 4px; - width: 11px; - height: 11px; - background-color: $accent; - mask-image: url('$(res)/img/voip/signal-bars.svg'); - mask-position: center; - mask-size: contain; - mask-repeat: no-repeat; - } - } - - > .mx_VoiceChannelRadio_name { - font-size: $font-13px; - color: $secondary-content; - } - } - - > .mx_VoiceChannelRadio_disconnectButton::before { - content: ''; - display: block; - width: 36px; - height: 36px; - background-color: $tertiary-content; - mask-image: url('$(res)/img/element-icons/call/hangup.svg'); - mask-position: center; - mask-size: 24px; - mask-repeat: no-repeat; - } - } - - > .mx_VoiceChannelRadio_controlBar { - display: flex; - border-top: 1px solid $quinary-content; - padding: 12px 16px; - align-items: center; - justify-content: space-between; - - > .mx_AccessibleButton { - font-size: $font-15px; - padding: 6px 0; - - &.mx_VoiceChannelRadio_button_active { - padding: 6px 12px; - background-color: $quinary-content; - border-radius: 8px; - font-weight: 600; - } - } - - > .mx_VoiceChannelRadio_videoButton::before { - content: ''; - display: inline-block; - margin-right: 8px; - width: 16px; - height: 16px; - background-color: $primary-content; - vertical-align: sub; - mask-image: url('$(res)/img/voip/call-view/cam-off.svg'); - mask-position: center; - mask-size: contain; - mask-repeat: no-repeat; - } - - > .mx_VoiceChannelRadio_videoButton.mx_VoiceChannelRadio_button_active::before { - mask-image: url('$(res)/img/voip/call-view/cam-on.svg'); - } - - > .mx_VoiceChannelRadio_audioButton::before { - content: ''; - display: inline-block; - margin-right: 4px; - width: 16px; - height: 16px; - background-color: $primary-content; - vertical-align: sub; - mask-image: url('$(res)/img/voip/call-view/mic-off.svg'); - mask-position: center; - mask-size: contain; - mask-repeat: no-repeat; - } - - > .mx_VoiceChannelRadio_audioButton.mx_VoiceChannelRadio_button_active::before { - mask-image: url('$(res)/img/voip/call-view/mic-on.svg'); - } - } -} diff --git a/res/img/voip/voice-room.svg b/res/img/voip/voice-room.svg deleted file mode 100644 index db62957ee3..0000000000 --- a/res/img/voip/voice-room.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/src/Lifecycle.ts b/src/Lifecycle.ts index 85f0535851..a919a9c287 100644 --- a/src/Lifecycle.ts +++ b/src/Lifecycle.ts @@ -36,6 +36,7 @@ import dis from './dispatcher/dispatcher'; import DMRoomMap from './utils/DMRoomMap'; import Modal from './Modal'; import ActiveWidgetStore from './stores/ActiveWidgetStore'; +import VideoChannelStore from "./stores/VideoChannelStore"; import PlatformPeg from "./PlatformPeg"; import { sendLoginRequest } from "./Login"; import * as StorageManager from './utils/StorageManager'; @@ -796,6 +797,7 @@ async function startMatrixClient(startSyncing = true): Promise { IntegrationManagers.sharedInstance().startWatching(); ActiveWidgetStore.instance.start(); CallHandler.instance.start(); + if (SettingsStore.getValue("feature_video_rooms")) VideoChannelStore.instance.start(); // Start Mjolnir even though we haven't checked the feature flag yet. Starting // the thing just wastes CPU cycles, but should result in no actual functionality @@ -909,6 +911,7 @@ export function stopMatrixClient(unsetClient = true): void { UserActivity.sharedInstance().stop(); TypingStore.sharedInstance().reset(); Presence.stop(); + if (SettingsStore.getValue("feature_video_rooms")) VideoChannelStore.instance.stop(); ActiveWidgetStore.instance.stop(); IntegrationManagers.sharedInstance().stopWatching(); Mjolnir.sharedInstance().stop(); diff --git a/src/components/structures/LeftPanel.tsx b/src/components/structures/LeftPanel.tsx index 987e8c2966..db6d4be1d8 100644 --- a/src/components/structures/LeftPanel.tsx +++ b/src/components/structures/LeftPanel.tsx @@ -41,7 +41,6 @@ import { UPDATE_EVENT } from "../../stores/AsyncStore"; import IndicatorScrollbar from "./IndicatorScrollbar"; import RoomBreadcrumbs from "../views/rooms/RoomBreadcrumbs"; import SettingsStore from "../../settings/SettingsStore"; -import VoiceChannelRadio from "../views/voip/VoiceChannelRadio"; import { KeyBindingAction } from "../../accessibility/KeyboardShortcuts"; import { shouldShowComponent } from "../../customisations/helpers/UIComponents"; import { UIComponent } from "../../settings/UIFeature"; @@ -441,7 +440,6 @@ export default class LeftPanel extends React.Component { { roomList } - { SettingsStore.getValue("feature_voice_rooms") && } ); diff --git a/src/components/structures/MatrixChat.tsx b/src/components/structures/MatrixChat.tsx index 302989ed5f..969486c536 100644 --- a/src/components/structures/MatrixChat.tsx +++ b/src/components/structures/MatrixChat.tsx @@ -31,6 +31,7 @@ import { defer, IDeferred, QueryDict } from "matrix-js-sdk/src/utils"; import { logger } from "matrix-js-sdk/src/logger"; import { throttle } from "lodash"; import { CryptoEvent } from "matrix-js-sdk/src/crypto"; +import { RoomType } from "matrix-js-sdk/src/@types/event"; // focus-visible is a Polyfill for the :focus-visible CSS pseudo-attribute used by _AccessibleButton.scss import 'focus-visible'; @@ -677,7 +678,7 @@ export default class MatrixChat extends React.PureComponent { break; } case 'view_create_room': - this.createRoom(payload.public, payload.defaultName); + this.createRoom(payload.public, payload.defaultName, payload.type); // View the welcome or home page if we need something to look at this.viewSomethingBehindModal(); @@ -994,8 +995,9 @@ export default class MatrixChat extends React.PureComponent { this.setPage(PageType.LegacyGroupView); } - private async createRoom(defaultPublic = false, defaultName?: string) { + private async createRoom(defaultPublic = false, defaultName?: string, type?: RoomType) { const modal = Modal.createTrackedDialog('Create Room', '', CreateRoomDialog, { + type, defaultPublic, defaultName, }); diff --git a/src/components/structures/RoomView.tsx b/src/components/structures/RoomView.tsx index fe9f85c900..ab06369406 100644 --- a/src/components/structures/RoomView.tsx +++ b/src/components/structures/RoomView.tsx @@ -75,7 +75,7 @@ import EffectsOverlay from "../views/elements/EffectsOverlay"; import { containsEmoji } from '../../effects/utils'; import { CHAT_EFFECTS } from '../../effects'; import WidgetStore from "../../stores/WidgetStore"; -import { getVoiceChannel } from "../../utils/VoiceChannelUtils"; +import { getVideoChannel } from "../../utils/VideoChannelUtils"; import AppTile from "../views/elements/AppTile"; import { UPDATE_EVENT } from "../../stores/AsyncStore"; import Notifier from "../../Notifier"; @@ -375,7 +375,7 @@ export class RoomView extends React.Component { }; private getMainSplitContentType = (room: Room) => { - if (SettingsStore.getValue("feature_voice_rooms") && room.isCallRoom()) { + if (SettingsStore.getValue("feature_video_rooms") && room.isCallRoom()) { return MainSplitContentType.Video; } if (WidgetLayoutStore.instance.hasMaximisedWidget(room)) { @@ -2140,7 +2140,7 @@ export class RoomView extends React.Component { ; break; case MainSplitContentType.Video: { - const app = getVoiceChannel(this.state.room.roomId); + const app = getVideoChannel(this.state.room.roomId); if (!app) break; mainSplitContentClassName = "mx_MainSplit_video"; mainSplitBody = { const mainSplitContentClasses = classNames("mx_RoomView_body", mainSplitContentClassName); let excludedRightPanelPhaseButtons = [RightPanelPhases.Timeline]; + let onCallPlaced = this.onCallPlaced; let onAppsClick = this.onAppsClick; let onForgetClick = this.onForgetClick; let onSearchClick = this.onSearchClick; - if (this.state.mainSplitContentType !== MainSplitContentType.Timeline) { - // Disable phase buttons and action button to have a simplified header - // and enable (not disable) the RightPanelPhases.Timeline button - excludedRightPanelPhaseButtons = [ - RightPanelPhases.ThreadPanel, - RightPanelPhases.PinnedMessages, - ]; - onAppsClick = null; - onForgetClick = null; - onSearchClick = null; + + // Simplify the header for other main split types + switch (this.state.mainSplitContentType) { + case MainSplitContentType.MaximisedWidget: + excludedRightPanelPhaseButtons = [ + RightPanelPhases.ThreadPanel, + RightPanelPhases.PinnedMessages, + ]; + onAppsClick = null; + onForgetClick = null; + onSearchClick = null; + break; + case MainSplitContentType.Video: + excludedRightPanelPhaseButtons = [ + RightPanelPhases.ThreadPanel, + RightPanelPhases.PinnedMessages, + RightPanelPhases.NotificationPanel, + ]; + onCallPlaced = null; + onAppsClick = null; + onForgetClick = null; + onSearchClick = null; } return ( @@ -2189,7 +2202,7 @@ export class RoomView extends React.Component { e2eStatus={this.state.e2eStatus} onAppsClick={this.state.hasPinnedWidgets ? onAppsClick : null} appsShown={this.state.showApps} - onCallPlaced={this.onCallPlaced} + onCallPlaced={onCallPlaced} excludedRightPanelPhaseButtons={excludedRightPanelPhaseButtons} /> diff --git a/src/components/structures/SpaceRoomView.tsx b/src/components/structures/SpaceRoomView.tsx index ba46cdc921..f6f8ae3f47 100644 --- a/src/components/structures/SpaceRoomView.tsx +++ b/src/components/structures/SpaceRoomView.tsx @@ -15,7 +15,7 @@ limitations under the License. */ import React, { RefObject, useContext, useRef, useState } from "react"; -import { EventType } from "matrix-js-sdk/src/@types/event"; +import { EventType, RoomType } from "matrix-js-sdk/src/@types/event"; import { JoinRule, Preset } from "matrix-js-sdk/src/@types/partials"; import { Room, RoomEvent } from "matrix-js-sdk/src/models/room"; import { logger } from "matrix-js-sdk/src/logger"; @@ -29,6 +29,7 @@ import RoomTopic from "../views/elements/RoomTopic"; import InlineSpinner from "../views/elements/InlineSpinner"; import { inviteMultipleToRoom, showRoomInviteDialog } from "../../RoomInvite"; import { useRoomMembers } from "../../hooks/useRoomMembers"; +import { useFeatureEnabled } from "../../hooks/useSettings"; import createRoom, { IOpts } from "../../createRoom"; import Field from "../views/elements/Field"; import { useTypedEventEmitter } from "../../hooks/useEventEmitter"; @@ -57,7 +58,7 @@ import { } from "../../utils/space"; import SpaceHierarchy, { showRoom } from "./SpaceHierarchy"; import MemberAvatar from "../views/avatars/MemberAvatar"; -import { RoomFacePile } from "../views/elements/FacePile"; +import FacePile from "../views/elements/FacePile"; import { AddExistingToSpace, defaultDmsRenderer, @@ -297,7 +298,7 @@ const SpacePreview = ({ space, onJoinButtonClicked, onRejectButtonClicked }: ISp } - { space.getJoinRule() === "public" && } + { space.getJoinRule() === "public" && }
{ joinButtons }
@@ -309,6 +310,7 @@ const SpaceLandingAddButton = ({ space }) => { const [menuDisplayed, handle, openMenu, closeMenu] = useContextMenu(); const canCreateRoom = shouldShowComponent(UIComponent.CreateRooms); const canCreateSpace = shouldShowComponent(UIComponent.CreateSpaces); + const videoRoomsEnabled = useFeatureEnabled("feature_video_rooms"); let contextMenu; if (menuDisplayed) { @@ -322,20 +324,35 @@ const SpaceLandingAddButton = ({ space }) => { compact > - { canCreateRoom && { - e.preventDefault(); - e.stopPropagation(); - closeMenu(); + { canCreateRoom && <> + { + e.preventDefault(); + e.stopPropagation(); + closeMenu(); - PosthogTrackers.trackInteraction("WebSpaceHomeCreateRoomButton", e); - if (await showCreateNewRoom(space)) { - defaultDispatcher.fire(Action.UpdateSpaceHierarchy); - } - }} - /> } + PosthogTrackers.trackInteraction("WebSpaceHomeCreateRoomButton", e); + if (await showCreateNewRoom(space)) { + defaultDispatcher.fire(Action.UpdateSpaceHierarchy); + } + }} + /> + { videoRoomsEnabled && { + e.preventDefault(); + e.stopPropagation(); + closeMenu(); + + if (await showCreateNewRoom(space, RoomType.UnstableCall)) { + defaultDispatcher.fire(Action.UpdateSpaceHierarchy); + } + }} + /> } + } {
- + { inviteButton } { settingsButton }
diff --git a/src/components/views/context_menus/RoomContextMenu.tsx b/src/components/views/context_menus/RoomContextMenu.tsx index 1d2ca8f171..35ecf97a9c 100644 --- a/src/components/views/context_menus/RoomContextMenu.tsx +++ b/src/components/views/context_menus/RoomContextMenu.tsx @@ -35,7 +35,7 @@ import { EchoChamber } from "../../../stores/local-echo/EchoChamber"; import { RoomNotifState } from "../../../RoomNotifs"; import Modal from "../../../Modal"; import ExportDialog from "../dialogs/ExportDialog"; -import { useSettingValue } from "../../../hooks/useSettings"; +import { useFeatureEnabled } from "../../../hooks/useSettings"; import { usePinnedEvents } from "../right_panel/PinnedMessagesCard"; import RoomViewStore from "../../../stores/RoomViewStore"; import { RightPanelPhases } from '../../../stores/right-panel/RightPanelStorePhases'; @@ -105,6 +105,7 @@ const RoomContextMenu = ({ room, onFinished, ...props }: IProps) => { } const isDm = DMRoomMap.shared().getUserIdForRoomId(room.roomId); + const isVideoRoom = useFeatureEnabled("feature_video_rooms") && room.isCallRoom(); let inviteOption: JSX.Element; if (room.canInvite(cli.getUserId()) && !isDm) { @@ -233,11 +234,27 @@ const RoomContextMenu = ({ room, onFinished, ...props }: IProps) => { />; } - const pinningEnabled = useSettingValue("feature_pinning"); + let filesOption: JSX.Element; + if (!isVideoRoom) { + filesOption = { + ev.preventDefault(); + ev.stopPropagation(); + + ensureViewingRoom(ev); + RightPanelStore.instance.pushCard({ phase: RightPanelPhases.FilePanel }, false); + onFinished(); + }} + label={_t("Files")} + iconClassName="mx_RoomTile_iconFiles" + />; + } + + const pinningEnabled = useFeatureEnabled("feature_pinning"); const pinCount = usePinnedEvents(pinningEnabled && room)?.length; let pinsOption: JSX.Element; - if (pinningEnabled) { + if (pinningEnabled && !isVideoRoom) { pinsOption = { ev.preventDefault(); @@ -256,6 +273,37 @@ const RoomContextMenu = ({ room, onFinished, ...props }: IProps) => { ; } + let widgetsOption: JSX.Element; + if (!isVideoRoom) { + widgetsOption = { + ev.preventDefault(); + ev.stopPropagation(); + + ensureViewingRoom(ev); + RightPanelStore.instance.setCard({ phase: RightPanelPhases.RoomSummary }, false); + onFinished(); + }} + label={_t("Widgets")} + iconClassName="mx_RoomTile_iconWidgets" + />; + } + + let exportChatOption: JSX.Element; + if (!isVideoRoom) { + exportChatOption = { + ev.preventDefault(); + ev.stopPropagation(); + + Modal.createTrackedDialog('Export room dialog', '', ExportDialog, { room }); + onFinished(); + }} + label={_t("Export chat")} + iconClassName="mx_RoomTile_iconExport" + />; + } + const onTagRoom = (ev: ButtonEvent, tagId: TagID) => { ev.preventDefault(); ev.stopPropagation(); @@ -295,35 +343,9 @@ const RoomContextMenu = ({ room, onFinished, ...props }: IProps) => { { notificationOption } { favouriteOption } { peopleOption } - - { - ev.preventDefault(); - ev.stopPropagation(); - - ensureViewingRoom(ev); - RightPanelStore.instance.pushCard({ phase: RightPanelPhases.FilePanel }, false); - onFinished(); - }} - label={_t("Files")} - iconClassName="mx_RoomTile_iconFiles" - /> - + { filesOption } { pinsOption } - - { - ev.preventDefault(); - ev.stopPropagation(); - - ensureViewingRoom(ev); - RightPanelStore.instance.setCard({ phase: RightPanelPhases.RoomSummary }, false); - onFinished(); - }} - label={_t("Widgets")} - iconClassName="mx_RoomTile_iconWidgets" - /> - + { widgetsOption } { lowPriorityOption } { copyLinkOption } @@ -343,17 +365,7 @@ const RoomContextMenu = ({ room, onFinished, ...props }: IProps) => { iconClassName="mx_RoomTile_iconSettings" /> - { - ev.preventDefault(); - ev.stopPropagation(); - - Modal.createTrackedDialog('Export room dialog', '', ExportDialog, { room }); - onFinished(); - }} - label={_t("Export chat")} - iconClassName="mx_RoomTile_iconExport" - /> + { exportChatOption } { SettingsStore.getValue("developerMode") && { diff --git a/src/components/views/dialogs/CreateRoomDialog.tsx b/src/components/views/dialogs/CreateRoomDialog.tsx index 4b7b0caa8f..feec344313 100644 --- a/src/components/views/dialogs/CreateRoomDialog.tsx +++ b/src/components/views/dialogs/CreateRoomDialog.tsx @@ -21,15 +21,12 @@ import { RoomType } from "matrix-js-sdk/src/@types/event"; import { JoinRule, Preset, Visibility } from "matrix-js-sdk/src/@types/partials"; import SdkConfig from '../../../SdkConfig'; -import SettingsStore from "../../../settings/SettingsStore"; import withValidation, { IFieldState } from '../elements/Validation'; import { _t } from '../../../languageHandler'; import { MatrixClientPeg } from '../../../MatrixClientPeg'; import { IOpts, privateShouldBeEncrypted } from "../../../createRoom"; import { replaceableComponent } from "../../../utils/replaceableComponent"; -import Heading from "../typography/Heading"; import Field from "../elements/Field"; -import StyledRadioGroup from "../elements/StyledRadioGroup"; import RoomAliasField from "../elements/RoomAliasField"; import LabelledToggleSwitch from "../elements/LabelledToggleSwitch"; import DialogButtons from "../elements/DialogButtons"; @@ -40,6 +37,7 @@ import { getKeyBindingsManager } from "../../../KeyBindingsManager"; import { KeyBindingAction } from "../../../accessibility/KeyboardShortcuts"; interface IProps { + type?: RoomType; defaultPublic?: boolean; defaultName?: string; parentSpace?: Room; @@ -48,7 +46,6 @@ interface IProps { } interface IState { - type?: RoomType; joinRule: JoinRule; isPublic: boolean; isEncrypted: boolean; @@ -80,7 +77,6 @@ export default class CreateRoomDialog extends React.Component { } this.state = { - type: null, isPublic: this.props.defaultPublic || false, isEncrypted: this.props.defaultEncrypted ?? privateShouldBeEncrypted(), joinRule, @@ -100,7 +96,7 @@ export default class CreateRoomDialog extends React.Component { private roomCreateOptions() { const opts: IOpts = {}; const createOpts: IOpts["createOpts"] = opts.createOpts = {}; - opts.roomType = this.state.type; + opts.roomType = this.props.type; createOpts.name = this.state.name; if (this.state.joinRule === JoinRule.Public) { @@ -180,10 +176,6 @@ export default class CreateRoomDialog extends React.Component { this.props.onFinished(false); }; - private onTypeChange = (type: RoomType | "text") => { - this.setState({ type: type === "text" ? null : type }); - }; - private onNameChange = (ev: ChangeEvent) => { this.setState({ name: ev.target.value }); }; @@ -229,6 +221,8 @@ export default class CreateRoomDialog extends React.Component { }); render() { + const isVideoRoom = this.props.type === RoomType.UnstableCall; + let aliasField; if (this.state.joinRule === JoinRule.Public) { const domain = MatrixClientPeg.get().getDomain(); @@ -319,8 +313,12 @@ export default class CreateRoomDialog extends React.Component { ); } - let title = _t("Create a room"); - if (!this.props.parentSpace) { + let title; + if (isVideoRoom) { + title = _t("Create a video room"); + } else if (this.props.parentSpace) { + title = _t("Create a room"); + } else { title = this.state.joinRule === JoinRule.Public ? _t('Create a public room') : _t('Create a private room'); } @@ -333,20 +331,6 @@ export default class CreateRoomDialog extends React.Component { >
- { SettingsStore.getValue("feature_voice_rooms") ? <> - { _t("Room type") } - - - { _t("Room details") } - : null } {
- diff --git a/src/components/views/elements/FacePile.tsx b/src/components/views/elements/FacePile.tsx index ba246c4843..bb39cc7957 100644 --- a/src/components/views/elements/FacePile.tsx +++ b/src/components/views/elements/FacePile.tsx @@ -14,7 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -import React, { HTMLAttributes, ReactNode, useContext } from "react"; +import React, { FC, HTMLAttributes, ReactNode, useContext } from "react"; import { Room } from "matrix-js-sdk/src/models/room"; import { RoomMember } from "matrix-js-sdk/src/models/room-member"; import { sortBy } from "lodash"; @@ -26,48 +26,17 @@ import TextWithTooltip from "../elements/TextWithTooltip"; import { useRoomMembers } from "../../../hooks/useRoomMembers"; import MatrixClientContext from "../../../contexts/MatrixClientContext"; -interface IProps extends HTMLAttributes { - faces: ReactNode[]; - overflow: boolean; - tooltip?: ReactNode; - children?: ReactNode; -} - -const FacePile = ({ faces, overflow, tooltip, children, ...props }: IProps) => { - const pileContents = <> - { overflow ? : null } - { faces } - ; - - return
- { tooltip ? ( - - { pileContents } - - ) : ( -
- { pileContents } -
- ) } - { children } -
; -}; - -export default FacePile; - const DEFAULT_NUM_FACES = 5; -const isKnownMember = (member: RoomMember) => !!DMRoomMap.shared().getDMRoomsForUserId(member.userId)?.length; - -interface IRoomProps extends HTMLAttributes { +interface IProps extends HTMLAttributes { room: Room; onlyKnownUsers?: boolean; numShown?: number; } -export const RoomFacePile = ( - { room, onlyKnownUsers = true, numShown = DEFAULT_NUM_FACES, ...props }: IRoomProps, -) => { +const isKnownMember = (member: RoomMember) => !!DMRoomMap.shared().getDMRoomsForUserId(member.userId)?.length; + +const FacePile: FC = ({ room, onlyKnownUsers = true, numShown = DEFAULT_NUM_FACES, ...props }) => { const cli = useContext(MatrixClientContext); const isJoined = room.getMyMembership() === "join"; let members = useRoomMembers(room); @@ -89,8 +58,6 @@ export const RoomFacePile = ( // We reverse the order of the shown faces in CSS to simplify their visual overlap, // reverse members in tooltip order to make the order between the two match up. const commaSeparatedMembers = shownMembers.map(m => m.rawDisplayName).reverse().join(", "); - const faces = shownMembers.map(m => - ); let tooltip: ReactNode; if (props.onClick) { @@ -123,9 +90,16 @@ export const RoomFacePile = ( } } - return numShown} tooltip={tooltip}> + return
+ + { members.length > numShown ? : null } + { shownMembers.map(m => + ) } + { onlyKnownUsers && { _t("%(count)s people you know have already joined", { count: members.length }) } } - ; +
; }; + +export default FacePile; diff --git a/src/components/views/right_panel/RoomSummaryCard.tsx b/src/components/views/right_panel/RoomSummaryCard.tsx index b0cc55101a..65654f37ea 100644 --- a/src/components/views/right_panel/RoomSummaryCard.tsx +++ b/src/components/views/right_panel/RoomSummaryCard.tsx @@ -42,7 +42,7 @@ import { UIComponent, UIFeature } from "../../../settings/UIFeature"; import { ChevronFace, ContextMenuTooltipButton, useContextMenu } from "../../structures/ContextMenu"; import WidgetContextMenu from "../context_menus/WidgetContextMenu"; import { useRoomMemberCount } from "../../../hooks/useRoomMembers"; -import { useSettingValue } from "../../../hooks/useSettings"; +import { useFeatureEnabled } from "../../../hooks/useSettings"; import { usePinnedEvents } from "./PinnedMessagesCard"; import { Container, MAX_PINNED, WidgetLayoutStore } from "../../../stores/widgets/WidgetLayoutStore"; import RoomName from "../elements/RoomName"; @@ -269,6 +269,7 @@ const RoomSummaryCard: React.FC = ({ room, onClose }) => { const isRoomEncrypted = useIsEncrypted(cli, room); const roomContext = useContext(RoomContext); const e2eStatus = roomContext.e2eStatus; + const isVideoRoom = useFeatureEnabled("feature_video_rooms") && room.isCallRoom(); const alias = room.getCanonicalAlias() || room.getAltAliases()[0] || ""; const header = @@ -297,7 +298,7 @@ const RoomSummaryCard: React.FC = ({ room, onClose }) => { ; const memberCount = useRoomMemberCount(room); - const pinningEnabled = useSettingValue("feature_pinning"); + const pinningEnabled = useFeatureEnabled("feature_pinning"); const pinCount = usePinnedEvents(pinningEnabled && room)?.length; return @@ -308,18 +309,19 @@ const RoomSummaryCard: React.FC = ({ room, onClose }) => { { memberCount } - - { pinningEnabled && } - } + { !isVideoRoom && + } @@ -330,6 +332,7 @@ const RoomSummaryCard: React.FC = ({ room, onClose }) => { { SettingsStore.getValue(UIFeature.Widgets) + && !isVideoRoom && shouldShowComponent(UIComponent.AddIntegrations) && } diff --git a/src/components/views/rooms/RoomHeader.tsx b/src/components/views/rooms/RoomHeader.tsx index 9df1ba663c..1a71290890 100644 --- a/src/components/views/rooms/RoomHeader.tsx +++ b/src/components/views/rooms/RoomHeader.tsx @@ -206,6 +206,7 @@ export default class RoomHeader extends React.Component { const buttons: JSX.Element[] = []; if (this.props.inRoom && + this.props.onCallPlaced && !this.context.tombstone && SettingsStore.getValue("showCallButtonsInComposer") ) { diff --git a/src/components/views/rooms/RoomList.tsx b/src/components/views/rooms/RoomList.tsx index d54ac55ffb..b7e1f87dc5 100644 --- a/src/components/views/rooms/RoomList.tsx +++ b/src/components/views/rooms/RoomList.tsx @@ -16,6 +16,7 @@ limitations under the License. import React, { ComponentType, createRef, ReactComponentElement, RefObject } from "react"; import { Room } from "matrix-js-sdk/src/models/room"; +import { RoomType } from "matrix-js-sdk/src/@types/event"; import * as fbEmitter from "fbemitter"; import { EventType } from "matrix-js-sdk/src/@types/event"; @@ -222,8 +223,8 @@ const UntaggedAuxButton = ({ tabIndex }: IAuxButtonProps) => { showCreateRoom ? (<> { e.preventDefault(); e.stopPropagation(); @@ -235,6 +236,19 @@ const UntaggedAuxButton = ({ tabIndex }: IAuxButtonProps) => { tooltip={canAddRooms ? undefined : _t("You do not have permissions to create new rooms in this space")} /> + { SettingsStore.getValue("feature_video_rooms") && { + e.preventDefault(); + e.stopPropagation(); + closeMenu(); + showCreateNewRoom(activeSpace, RoomType.UnstableCall); + }} + disabled={!canAddRooms} + tooltip={canAddRooms ? undefined + : _t("You do not have permissions to create new rooms in this space")} + /> } { ; } else if (menuDisplayed) { contextMenuContent = - { showCreateRoom && { - e.preventDefault(); - e.stopPropagation(); - closeMenu(); - defaultDispatcher.dispatch({ action: "view_create_room" }); - PosthogTrackers.trackInteraction("WebRoomListRoomsSublistPlusMenuCreateRoomItem", e); - }} - /> } + { showCreateRoom && <> + { + e.preventDefault(); + e.stopPropagation(); + closeMenu(); + defaultDispatcher.dispatch({ action: "view_create_room" }); + PosthogTrackers.trackInteraction("WebRoomListRoomsSublistPlusMenuCreateRoomItem", e); + }} + /> + { SettingsStore.getValue("feature_video_rooms") && { + e.preventDefault(); + e.stopPropagation(); + closeMenu(); + defaultDispatcher.dispatch({ + action: "view_create_room", + type: RoomType.UnstableCall, + }); + }} + /> } + } { const allRoomsInHome = useEventEmitterState(SpaceStore.instance, UPDATE_HOME_BEHAVIOUR, () => { return SpaceStore.instance.allRoomsInHome; }); + const videoRoomsEnabled = useFeatureEnabled("feature_video_rooms"); const pendingActions = usePendingActions(); const filterCondition = RoomListStore.instance.getFirstNameFilterCondition(); @@ -195,19 +197,31 @@ const RoomListHeader = ({ onVisibilityChange }: IProps) => { />; } - let createNewRoomOption: JSX.Element; + let newRoomOptions: JSX.Element; if (activeSpace?.currentState.maySendStateEvent(EventType.RoomAvatar, cli.getUserId())) { - createNewRoomOption = { - e.preventDefault(); - e.stopPropagation(); - showCreateNewRoom(activeSpace); - PosthogTrackers.trackInteraction("WebRoomListHeaderPlusMenuCreateRoomItem", e); - closePlusMenu(); - }} - />; + newRoomOptions = <> + { + e.preventDefault(); + e.stopPropagation(); + showCreateNewRoom(activeSpace); + PosthogTrackers.trackInteraction("WebRoomListHeaderPlusMenuCreateRoomItem", e); + closePlusMenu(); + }} + /> + { videoRoomsEnabled && { + e.preventDefault(); + e.stopPropagation(); + showCreateNewRoom(activeSpace, RoomType.UnstableCall); + closePlusMenu(); + }} + /> } + ; } contextMenu = { > { inviteOption } - { createNewRoomOption } + { newRoomOptions } { ; } else if (plusMenuDisplayed) { - let startChatOpt: JSX.Element; - let createRoomOpt: JSX.Element; + let newRoomOpts: JSX.Element; let joinRoomOpt: JSX.Element; if (canCreateRooms) { - startChatOpt = ( + newRoomOpts = <> { closePlusMenu(); }} /> - ); - createRoomOpt = ( { e.preventDefault(); e.stopPropagation(); @@ -291,7 +302,20 @@ const RoomListHeader = ({ onVisibilityChange }: IProps) => { closePlusMenu(); }} /> - ); + { videoRoomsEnabled && { + e.preventDefault(); + e.stopPropagation(); + defaultDispatcher.dispatch({ + action: "view_create_room", + type: RoomType.UnstableCall, + }); + closePlusMenu(); + }} + /> } + ; } if (canExploreRooms) { joinRoomOpt = ( @@ -314,8 +338,7 @@ const RoomListHeader = ({ onVisibilityChange }: IProps) => { compact > - { startChatOpt } - { createRoomOpt } + { newRoomOpts } { joinRoomOpt } ; diff --git a/src/components/views/rooms/RoomTile.tsx b/src/components/views/rooms/RoomTile.tsx index bdea7ea9f8..a2557506e2 100644 --- a/src/components/views/rooms/RoomTile.tsx +++ b/src/components/views/rooms/RoomTile.tsx @@ -33,10 +33,7 @@ import { _t } from "../../../languageHandler"; import { ChevronFace, ContextMenuTooltipButton } from "../../structures/ContextMenu"; import { DefaultTagID, TagID } from "../../../stores/room-list/models"; import { MessagePreviewStore } from "../../../stores/room-list/MessagePreviewStore"; -import BaseAvatar from "../avatars/BaseAvatar"; -import MemberAvatar from "../avatars/MemberAvatar"; import DecoratedRoomAvatar from "../avatars/DecoratedRoomAvatar"; -import FacePile from "../elements/FacePile"; import { RoomNotifState } from "../../../RoomNotifs"; import { MatrixClientPeg } from "../../../MatrixClientPeg"; import NotificationBadge from "./NotificationBadge"; @@ -55,17 +52,16 @@ import IconizedContextMenu, { IconizedContextMenuOptionList, IconizedContextMenuRadio, } from "../context_menus/IconizedContextMenu"; -import VoiceChannelStore, { VoiceChannelEvent, IJitsiParticipant } from "../../../stores/VoiceChannelStore"; -import { getConnectedMembers } from "../../../utils/VoiceChannelUtils"; +import VideoChannelStore, { VideoChannelEvent, IJitsiParticipant } from "../../../stores/VideoChannelStore"; +import { getConnectedMembers } from "../../../utils/VideoChannelUtils"; import { replaceableComponent } from "../../../utils/replaceableComponent"; import PosthogTrackers from "../../../PosthogTrackers"; import { ViewRoomPayload } from "../../../dispatcher/payloads/ViewRoomPayload"; import { KeyBindingAction } from "../../../accessibility/KeyboardShortcuts"; import { getKeyBindingsManager } from "../../../KeyBindingsManager"; -enum VoiceConnectionState { +enum VideoStatus { Disconnected, - Connecting, Connected, } @@ -83,10 +79,10 @@ interface IState { notificationsMenuPosition: PartialDOMRect; generalMenuPosition: PartialDOMRect; messagePreview?: string; - voiceConnectionState: VoiceConnectionState; - // Active voice channel members, according to room state - voiceMembers: RoomMember[]; - // Active voice channel members, according to Jitsi + videoStatus: VideoStatus; + // Active video channel members, according to room state + videoMembers: RoomMember[]; + // Active video channel members, according to Jitsi jitsiParticipants: IJitsiParticipant[]; } @@ -106,27 +102,28 @@ export default class RoomTile extends React.PureComponent { private roomTileRef = createRef(); private notificationState: NotificationState; private roomProps: RoomEchoChamber; - private isVoiceRoom: boolean; + private isVideoRoom: boolean; constructor(props: IProps) { super(props); + const videoConnected = VideoChannelStore.instance.roomId === this.props.room.roomId; + this.state = { selected: ActiveRoomObserver.activeRoomId === this.props.room.roomId, notificationsMenuPosition: null, generalMenuPosition: null, // generatePreview() will return nothing if the user has previews disabled messagePreview: "", - voiceConnectionState: VoiceChannelStore.instance.roomId === this.props.room.roomId ? - VoiceConnectionState.Connected : VoiceConnectionState.Disconnected, - voiceMembers: [], - jitsiParticipants: [], + videoStatus: videoConnected ? VideoStatus.Connected : VideoStatus.Disconnected, + videoMembers: getConnectedMembers(this.props.room.currentState), + jitsiParticipants: videoConnected ? VideoChannelStore.instance.participants : [], }; this.generatePreview(); this.notificationState = RoomNotificationStateStore.instance.getRoomState(this.props.room); this.roomProps = EchoChamber.forRoom(this.props.room); - this.isVoiceRoom = SettingsStore.getValue("feature_voice_rooms") && this.props.room.isCallRoom(); + this.isVideoRoom = SettingsStore.getValue("feature_video_rooms") && this.props.room.isCallRoom(); } private onRoomNameUpdate = (room: Room) => { @@ -165,8 +162,9 @@ export default class RoomTile extends React.PureComponent { MessagePreviewStore.getPreviewChangedEventName(this.props.room), this.onRoomPreviewChanged, ); - prevProps.room?.currentState?.off(RoomStateEvent.Events, this.updateVoiceMembers); - this.props.room?.currentState?.on(RoomStateEvent.Events, this.updateVoiceMembers); + prevProps.room?.currentState?.off(RoomStateEvent.Events, this.updateVideoMembers); + this.props.room?.currentState?.on(RoomStateEvent.Events, this.updateVideoMembers); + this.updateVideoStatus(); prevProps.room?.off(RoomEvent.Name, this.onRoomNameUpdate); this.props.room?.on(RoomEvent.Name, this.onRoomNameUpdate); } @@ -177,7 +175,6 @@ export default class RoomTile extends React.PureComponent { if (this.state.selected) { this.scrollIntoView(); } - this.updateVoiceMembers(); ActiveRoomObserver.addListener(this.props.room.roomId, this.onActiveRoomUpdate); this.dispatcherRef = defaultDispatcher.register(this.onAction); @@ -188,7 +185,13 @@ export default class RoomTile extends React.PureComponent { this.notificationState.on(NotificationStateEvents.Update, this.onNotificationUpdate); this.roomProps.on(PROPERTY_UPDATED, this.onRoomPropertyUpdate); this.props.room?.on(RoomEvent.Name, this.onRoomNameUpdate); - this.props.room?.currentState?.on(RoomStateEvent.Events, this.updateVoiceMembers); + this.props.room?.currentState?.on(RoomStateEvent.Events, this.updateVideoMembers); + + VideoChannelStore.instance.on(VideoChannelEvent.Connect, this.updateVideoStatus); + VideoChannelStore.instance.on(VideoChannelEvent.Disconnect, this.updateVideoStatus); + if (VideoChannelStore.instance.roomId === this.props.room.roomId) { + VideoChannelStore.instance.on(VideoChannelEvent.Participants, this.updateJitsiParticipants); + } } public componentWillUnmount() { @@ -198,13 +201,16 @@ export default class RoomTile extends React.PureComponent { MessagePreviewStore.getPreviewChangedEventName(this.props.room), this.onRoomPreviewChanged, ); - this.props.room.currentState.off(RoomStateEvent.Events, this.updateVoiceMembers); + this.props.room.currentState.off(RoomStateEvent.Events, this.updateVideoMembers); this.props.room.off(RoomEvent.Name, this.onRoomNameUpdate); } ActiveRoomObserver.removeListener(this.props.room.roomId, this.onActiveRoomUpdate); defaultDispatcher.unregister(this.dispatcherRef); this.notificationState.off(NotificationStateEvents.Update, this.onNotificationUpdate); this.roomProps.off(PROPERTY_UPDATED, this.onRoomPropertyUpdate); + + VideoChannelStore.instance.off(VideoChannelEvent.Connect, this.updateVideoStatus); + VideoChannelStore.instance.off(VideoChannelEvent.Disconnect, this.updateVideoStatus); } private onAction = (payload: ActionPayload) => { @@ -255,11 +261,6 @@ export default class RoomTile extends React.PureComponent { metricsTrigger: "RoomList", metricsViaKeyboard: ev.type !== "click", }); - - // Connect to the voice channel if this is a voice room - if (this.isVoiceRoom && this.state.voiceConnectionState === VoiceConnectionState.Disconnected) { - await this.connectVoice(); - } }; private onActiveRoomUpdate = (isActive: boolean) => { @@ -584,87 +585,24 @@ export default class RoomTile extends React.PureComponent { ); } - private updateVoiceMembers = () => { - this.setState({ voiceMembers: getConnectedMembers(this.props.room.currentState) }); + private updateVideoMembers = () => { + this.setState({ videoMembers: getConnectedMembers(this.props.room.currentState) }); + }; + + private updateVideoStatus = () => { + if (VideoChannelStore.instance.roomId === this.props.room?.roomId) { + this.setState({ videoStatus: VideoStatus.Connected }); + VideoChannelStore.instance.on(VideoChannelEvent.Participants, this.updateJitsiParticipants); + } else { + this.setState({ videoStatus: VideoStatus.Disconnected }); + VideoChannelStore.instance.off(VideoChannelEvent.Participants, this.updateJitsiParticipants); + } }; private updateJitsiParticipants = (participants: IJitsiParticipant[]) => { this.setState({ jitsiParticipants: participants }); }; - private renderVoiceChannel(): React.ReactElement | null { - let faces; - if (this.state.voiceConnectionState === VoiceConnectionState.Connected) { - faces = this.state.jitsiParticipants.map(p => - , - ); - } else if (this.state.voiceMembers.length) { - faces = this.state.voiceMembers.map(m => - , - ); - } else { - return null; - } - - // TODO: The below "join" button will eventually show up on text rooms - // with an active voice channel, but that isn't implemented yet - return
- - { this.isVoiceRoom ? null : ( - - { _t("Join") } - - ) } -
; - } - - private async connectVoice() { - this.setState({ voiceConnectionState: VoiceConnectionState.Connecting }); - // TODO: Actually wait for the widget to be ready, instead of guessing. - // This hack is only in place until we find out for sure whether design - // wants the room view to open when connecting voice, or if this should - // somehow connect in the background. Until then, it's not worth the - // effort to solve this properly. - await new Promise(resolve => setTimeout(resolve, 1000)); - - const waitForConnect = VoiceChannelStore.instance.connect(this.props.room.roomId); - // Participant data comes down the event channel quickly, so prepare in advance - VoiceChannelStore.instance.on(VoiceChannelEvent.Participants, this.updateJitsiParticipants); - try { - await waitForConnect; - this.setState({ voiceConnectionState: VoiceConnectionState.Connected }); - - VoiceChannelStore.instance.once(VoiceChannelEvent.Disconnect, () => { - this.setState({ - voiceConnectionState: VoiceConnectionState.Disconnected, - jitsiParticipants: [], - }), - VoiceChannelStore.instance.off(VoiceChannelEvent.Participants, this.updateJitsiParticipants); - }); - } catch (e) { - // If it failed, clean up our advance preparations - logger.error("Failed to connect voice", e); - VoiceChannelStore.instance.off(VoiceChannelEvent.Participants, this.updateJitsiParticipants); - } - } - public render(): React.ReactElement { const classes = classNames({ 'mx_RoomTile': true, @@ -692,34 +630,44 @@ export default class RoomTile extends React.PureComponent { } let subtitle; - if (this.isVoiceRoom) { - switch (this.state.voiceConnectionState) { - case VoiceConnectionState.Disconnected: - subtitle = ( -
- { _t("Voice room") } -
- ); + if (this.isVideoRoom) { + let videoText: string; + let videoActive: boolean; + let participantCount: number; + + switch (this.state.videoStatus) { + case VideoStatus.Disconnected: + videoText = _t("Video"); + videoActive = false; + participantCount = this.state.videoMembers.length; break; - case VoiceConnectionState.Connecting: - subtitle = ( -
- { _t("Connecting...") } -
- ); - break; - case VoiceConnectionState.Connected: - subtitle = ( -
- { _t("Connected") } -
- ); + case VideoStatus.Connected: + videoText = _t("Connected"); + videoActive = true; + participantCount = this.state.jitsiParticipants.length; } + + subtitle = ( +
+ + { videoText } + + { participantCount ? <> + { " · " } + + { participantCount } + + : null } +
+ ); } else if (this.showMessagePreview && this.state.messagePreview) { subtitle = (
{ displayBadge={this.props.isMinimized} tooltipProps={{ tabIndex: isActive ? 0 : -1 }} /> -
-
- { titleContainer } - { badge } - { this.renderGeneralMenu() } - { this.renderNotificationsMenu(isActive) } -
- { this.renderVoiceChannel() } -
+ { titleContainer } + { badge } + { this.renderGeneralMenu() } + { this.renderNotificationsMenu(isActive) } } diff --git a/src/components/views/voip/VoiceChannelRadio.tsx b/src/components/views/voip/VoiceChannelRadio.tsx deleted file mode 100644 index 3a3e362e5b..0000000000 --- a/src/components/views/voip/VoiceChannelRadio.tsx +++ /dev/null @@ -1,91 +0,0 @@ -/* -Copyright 2022 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, { FC, useState, useContext } from "react"; -import classNames from "classnames"; - -import { _t } from "../../../languageHandler"; -import { useEventEmitter } from "../../../hooks/useEventEmitter"; -import MatrixClientContext from "../../../contexts/MatrixClientContext"; -import VoiceChannelStore, { VoiceChannelEvent } from "../../../stores/VoiceChannelStore"; -import DecoratedRoomAvatar from "../avatars/DecoratedRoomAvatar"; -import AccessibleButton from "../elements/AccessibleButton"; -import AccessibleTooltipButton from "../elements/AccessibleTooltipButton"; - -const _VoiceChannelRadio: FC<{ roomId: string }> = ({ roomId }) => { - const cli = useContext(MatrixClientContext); - const room = cli.getRoom(roomId); - const store = VoiceChannelStore.instance; - - const [audioMuted, setAudioMuted] = useState(store.audioMuted); - const [videoMuted, setVideoMuted] = useState(store.videoMuted); - - useEventEmitter(store, VoiceChannelEvent.MuteAudio, () => setAudioMuted(true)); - useEventEmitter(store, VoiceChannelEvent.UnmuteAudio, () => setAudioMuted(false)); - useEventEmitter(store, VoiceChannelEvent.MuteVideo, () => setVideoMuted(true)); - useEventEmitter(store, VoiceChannelEvent.UnmuteVideo, () => setVideoMuted(false)); - - return
-
- -
-
{ _t("Connected") }
-
{ room.name }
-
- store.disconnect()} - /> -
-
- videoMuted ? store.unmuteVideo() : store.muteVideo()} - > - { videoMuted ? _t("Video off") : _t("Video") } - - audioMuted ? store.unmuteAudio() : store.muteAudio()} - > - { audioMuted ? _t("Mic off") : _t("Mic") } - -
-
; -}; - -const VoiceChannelRadio: FC<{}> = () => { - const store = VoiceChannelStore.instance; - - const [activeChannel, setActiveChannel] = useState(VoiceChannelStore.instance.roomId); - useEventEmitter(store, VoiceChannelEvent.Connect, () => - setActiveChannel(VoiceChannelStore.instance.roomId), - ); - useEventEmitter(store, VoiceChannelEvent.Disconnect, () => - setActiveChannel(null), - ); - - return activeChannel ? <_VoiceChannelRadio roomId={activeChannel} /> : null; -}; - -export default VoiceChannelRadio; diff --git a/src/createRoom.ts b/src/createRoom.ts index 91eb1b45e9..adfca7dd3a 100644 --- a/src/createRoom.ts +++ b/src/createRoom.ts @@ -42,7 +42,7 @@ import { isJoinedOrNearlyJoined } from "./utils/membership"; import { VIRTUAL_ROOM_EVENT_TYPE } from "./CallHandler"; import SpaceStore from "./stores/spaces/SpaceStore"; import { makeSpaceParentEvent } from "./utils/space"; -import { VOICE_CHANNEL_MEMBER, addVoiceChannel } from "./utils/VoiceChannelUtils"; +import { VIDEO_CHANNEL_MEMBER, addVideoChannel } from "./utils/VideoChannelUtils"; import { Action } from "./dispatcher/actions"; import ErrorDialog from "./components/views/dialogs/ErrorDialog"; import Spinner from "./components/views/elements/Spinner"; @@ -128,11 +128,11 @@ export default async function createRoom(opts: IOpts): Promise { [RoomCreateTypeField]: opts.roomType, }; - // In voice rooms, allow all users to send voice member updates + // In video rooms, allow all users to send video member updates if (opts.roomType === RoomType.UnstableCall) { createOpts.power_level_content_override = { events: { - [VOICE_CHANNEL_MEMBER]: 0, + [VIDEO_CHANNEL_MEMBER]: 0, // Annoyingly, we have to reiterate all the defaults here [EventType.RoomName]: 50, [EventType.RoomAvatar]: 50, @@ -262,9 +262,9 @@ export default async function createRoom(opts: IOpts): Promise { return SpaceStore.instance.addRoomToSpace(opts.parentSpace, roomId, [client.getDomain()], opts.suggested); } }).then(() => { - // Set up voice rooms with a Jitsi widget + // Set up video rooms with a Jitsi widget if (opts.roomType === RoomType.UnstableCall) { - return addVoiceChannel(roomId, createOpts.name); + return addVideoChannel(roomId, createOpts.name); } }).then(function() { // NB createRoom doesn't block on the client seeing the echo that the diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index 05182353e2..dea47408e9 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -868,7 +868,7 @@ "Message Pinning": "Message Pinning", "Threaded messaging": "Threaded messaging", "Custom user status messages": "Custom user status messages", - "Voice & video rooms (under active development)": "Voice & video rooms (under active development)", + "Video rooms (under active development)": "Video rooms (under active development)", "Render simple counters in room header": "Render simple counters in room header", "Multiple integration managers (requires manual setup)": "Multiple integration managers (requires manual setup)", "Try out new ways to ignore people (experimental)": "Try out new ways to ignore people (experimental)", @@ -1002,12 +1002,6 @@ "Your camera is turned off": "Your camera is turned off", "Your camera is still enabled": "Your camera is still enabled", "Dial": "Dial", - "Connected": "Connected", - "Disconnect": "Disconnect", - "Video off": "Video off", - "Video": "Video", - "Mic off": "Mic off", - "Mic": "Mic", "Dialpad": "Dialpad", "Mute the microphone": "Mute the microphone", "Unmute the microphone": "Unmute the microphone", @@ -1359,6 +1353,7 @@ "The identity server you have chosen does not have any terms of service.": "The identity server you have chosen does not have any terms of service.", "Disconnect identity server": "Disconnect identity server", "Disconnect from the identity server ?": "Disconnect from the identity server ?", + "Disconnect": "Disconnect", "You should remove your personal data from identity server before disconnecting. Unfortunately, identity server is currently offline or cannot be reached.": "You should remove your personal data from identity server before disconnecting. Unfortunately, identity server is currently offline or cannot be reached.", "You should:": "You should:", "check your browser plugins for anything that might block the identity server (such as Privacy Badger)": "check your browser plugins for anything that might block the identity server (such as Privacy Badger)", @@ -1757,8 +1752,9 @@ "Add people": "Add people", "Start chat": "Start chat", "Explore rooms": "Explore rooms", - "Create new room": "Create new room", + "New room": "New room", "You do not have permissions to create new rooms in this space": "You do not have permissions to create new rooms in this space", + "New video room": "New video room", "Add existing room": "Add existing room", "You do not have permissions to add rooms to this space": "You do not have permissions to add rooms to this space", "Explore public rooms": "Explore public rooms", @@ -1851,9 +1847,10 @@ "Low Priority": "Low Priority", "Copy room link": "Copy room link", "Leave": "Leave", - "Join": "Join", - "Voice room": "Voice room", - "Connecting...": "Connecting...", + "Video": "Video", + "Connected": "Connected", + "%(count)s participants|other": "%(count)s participants", + "%(count)s participants|one": "1 participant", "%(count)s unread messages including mentions.|other": "%(count)s unread messages including mentions.", "%(count)s unread messages including mentions.|one": "1 unread mention.", "%(count)s unread messages.|other": "%(count)s unread messages.", @@ -2207,6 +2204,7 @@ "Application window": "Application window", "Share content": "Share content", "Backspace": "Backspace", + "Join": "Join", "Please create a new issue on GitHub so that we can investigate this bug.": "Please create a new issue on GitHub so that we can investigate this bug.", "Something went wrong!": "Something went wrong!", "%(nameList)s %(transitionList)s": "%(nameList)s %(transitionList)s", @@ -2420,20 +2418,18 @@ "Enable end-to-end encryption": "Enable end-to-end encryption", "You might enable this if the room will only be used for collaborating with internal teams on your homeserver. This cannot be changed later.": "You might enable this if the room will only be used for collaborating with internal teams on your homeserver. This cannot be changed later.", "You might disable this if the room will be used for collaborating with external teams who have their own homeserver. This cannot be changed later.": "You might disable this if the room will be used for collaborating with external teams who have their own homeserver. This cannot be changed later.", + "Create a video room": "Create a video room", "Create a room": "Create a room", "Create a public room": "Create a public room", "Create a private room": "Create a private room", - "Room type": "Room type", - "Text room": "Text room", - "Voice & video room": "Voice & video room", - "Room details": "Room details", "Topic (optional)": "Topic (optional)", "Room visibility": "Room visibility", "Private room (invite only)": "Private room (invite only)", "Public room": "Public room", "Visible to space members": "Visible to space members", "Block anyone not part of %(serverName)s from ever joining this room.": "Block anyone not part of %(serverName)s from ever joining this room.", - "Create Room": "Create Room", + "Create video room": "Create video room", + "Create room": "Create room", "Anyone in will be able to find and join.": "Anyone in will be able to find and join.", "Anyone will be able to find and join this space, not just members of .": "Anyone will be able to find and join this space, not just members of .", "Only people invited will be able to find and join this space.": "Only people invited will be able to find and join this space.", @@ -3021,6 +3017,7 @@ "Unable to look up room ID from server": "Unable to look up room ID from server", "Preview": "Preview", "View": "View", + "Create new room": "Create new room", "No results for \"%(query)s\"": "No results for \"%(query)s\"", "Try different words or check for typos. Some results may not be visible as they're private and you need an invite to join them.": "Try different words or check for typos. Some results may not be visible as they're private and you need an invite to join them.", "Find a room…": "Find a room…", diff --git a/src/settings/Settings.tsx b/src/settings/Settings.tsx index 452c2185c5..f25a4bf8ce 100644 --- a/src/settings/Settings.tsx +++ b/src/settings/Settings.tsx @@ -237,10 +237,10 @@ export const SETTINGS: {[setting: string]: ISetting} = { default: false, controller: new CustomStatusController(), }, - "feature_voice_rooms": { + "feature_video_rooms": { isFeature: true, labsGroup: LabGroup.Rooms, - displayName: _td("Voice & video rooms (under active development)"), + displayName: _td("Video rooms (under active development)"), supportedLevels: LEVELS_FEATURE, default: false, // Reload to ensure that the left panel etc. get remounted diff --git a/src/stores/VideoChannelStore.ts b/src/stores/VideoChannelStore.ts new file mode 100644 index 0000000000..6bd1b621e4 --- /dev/null +++ b/src/stores/VideoChannelStore.ts @@ -0,0 +1,164 @@ +/* +Copyright 2022 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 { EventEmitter } from "events"; +import { logger } from "matrix-js-sdk/src/logger"; +import { ClientWidgetApi, IWidgetApiRequest } from "matrix-widget-api"; + +import { MatrixClientPeg } from "../MatrixClientPeg"; +import { ElementWidgetActions } from "./widgets/ElementWidgetActions"; +import { WidgetMessagingStore } from "./widgets/WidgetMessagingStore"; +import ActiveWidgetStore, { ActiveWidgetStoreEvent } from "./ActiveWidgetStore"; +import { + VIDEO_CHANNEL, + VIDEO_CHANNEL_MEMBER, + IVideoChannelMemberContent, + getVideoChannel, +} from "../utils/VideoChannelUtils"; +import WidgetUtils from "../utils/WidgetUtils"; + +export enum VideoChannelEvent { + Connect = "connect", + Disconnect = "disconnect", + Participants = "participants", +} + +export interface IJitsiParticipant { + avatarURL: string; + displayName: string; + formattedDisplayName: string; + participantId: string; +} + +/* + * Holds information about the currently active video channel. + */ +export default class VideoChannelStore extends EventEmitter { + private static _instance: VideoChannelStore; + + public static get instance(): VideoChannelStore { + if (!VideoChannelStore._instance) { + VideoChannelStore._instance = new VideoChannelStore(); + } + return VideoChannelStore._instance; + } + + private readonly cli = MatrixClientPeg.get(); + private activeChannel: ClientWidgetApi; + private _roomId: string; + private _participants: IJitsiParticipant[]; + + public get roomId(): string { + return this._roomId; + } + + public get participants(): IJitsiParticipant[] { + return this._participants; + } + + public start = () => { + ActiveWidgetStore.instance.on(ActiveWidgetStoreEvent.Update, this.onActiveWidgetUpdate); + }; + + public stop = () => { + ActiveWidgetStore.instance.off(ActiveWidgetStoreEvent.Update, this.onActiveWidgetUpdate); + }; + + private setConnected = async (roomId: string) => { + const jitsi = getVideoChannel(roomId); + if (!jitsi) throw new Error(`No video channel in room ${roomId}`); + + const messaging = WidgetMessagingStore.instance.getMessagingForUid(WidgetUtils.getWidgetUid(jitsi)); + if (!messaging) throw new Error(`Failed to bind video channel in room ${roomId}`); + + this.activeChannel = messaging; + this._roomId = roomId; + this._participants = []; + + this.activeChannel.once(`action:${ElementWidgetActions.HangupCall}`, this.onHangup); + this.activeChannel.on(`action:${ElementWidgetActions.CallParticipants}`, this.onParticipants); + + this.emit(VideoChannelEvent.Connect); + + // Tell others that we're connected, by adding our device to room state + await this.updateDevices(devices => Array.from(new Set(devices).add(this.cli.getDeviceId()))); + }; + + private setDisconnected = async () => { + this.activeChannel.off(`action:${ElementWidgetActions.HangupCall}`, this.onHangup); + this.activeChannel.off(`action:${ElementWidgetActions.CallParticipants}`, this.onParticipants); + + this.activeChannel = null; + this._participants = null; + + try { + // Tell others that we're disconnected, by removing our device from room state + await this.updateDevices(devices => { + const devicesSet = new Set(devices); + devicesSet.delete(this.cli.getDeviceId()); + return Array.from(devicesSet); + }); + } finally { + // Save this for last, since updateDevices needs the room ID + this._roomId = null; + this.emit(VideoChannelEvent.Disconnect); + } + }; + + private ack = (ev: CustomEvent) => { + // Even if we don't have a reply to a given widget action, we still need + // to give the widget API something to acknowledge receipt + this.activeChannel.transport.reply(ev.detail, {}); + }; + + private updateDevices = async (fn: (devices: string[]) => string[]) => { + if (!this.roomId) { + logger.error("Tried to update devices while disconnected"); + return; + } + + const room = this.cli.getRoom(this.roomId); + const devicesState = room.currentState.getStateEvents(VIDEO_CHANNEL_MEMBER, this.cli.getUserId()); + const devices = devicesState?.getContent()?.devices ?? []; + + await this.cli.sendStateEvent( + this.roomId, VIDEO_CHANNEL_MEMBER, { devices: fn(devices) }, this.cli.getUserId(), + ); + }; + + private onHangup = async (ev: CustomEvent) => { + this.ack(ev); + await this.setDisconnected(); + }; + + private onParticipants = (ev: CustomEvent) => { + this._participants = ev.detail.data.participants as IJitsiParticipant[]; + this.emit(VideoChannelEvent.Participants, ev.detail.data.participants); + this.ack(ev); + }; + + private onActiveWidgetUpdate = async () => { + if (this.activeChannel) { + // We got disconnected from the previous video channel, so clean up + await this.setDisconnected(); + } + + // If the new active widget is a video channel, that means we joined + if (ActiveWidgetStore.instance.getPersistentWidgetId() === VIDEO_CHANNEL) { + await this.setConnected(ActiveWidgetStore.instance.getPersistentRoomId()); + } + }; +} diff --git a/src/stores/VoiceChannelStore.ts b/src/stores/VoiceChannelStore.ts deleted file mode 100644 index 9e77a0094b..0000000000 --- a/src/stores/VoiceChannelStore.ts +++ /dev/null @@ -1,267 +0,0 @@ -/* -Copyright 2022 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 { EventEmitter } from "events"; -import { logger } from "matrix-js-sdk/src/logger"; -import { ClientWidgetApi, IWidgetApiRequest } from "matrix-widget-api"; - -import { MatrixClientPeg } from "../MatrixClientPeg"; -import { ElementWidgetActions } from "./widgets/ElementWidgetActions"; -import { WidgetMessagingStore } from "./widgets/WidgetMessagingStore"; -import { - VOICE_CHANNEL_MEMBER, - IVoiceChannelMemberContent, - getVoiceChannel, -} from "../utils/VoiceChannelUtils"; -import { timeout } from "../utils/promise"; -import WidgetUtils from "../utils/WidgetUtils"; - -export enum VoiceChannelEvent { - Connect = "connect", - Disconnect = "disconnect", - Participants = "participants", - MuteAudio = "mute_audio", - UnmuteAudio = "unmute_audio", - MuteVideo = "mute_video", - UnmuteVideo = "unmute_video", -} - -export interface IJitsiParticipant { - avatarURL: string; - displayName: string; - formattedDisplayName: string; - participantId: string; -} - -/* - * Holds information about the currently active voice channel. - */ -export default class VoiceChannelStore extends EventEmitter { - private static _instance: VoiceChannelStore; - private static readonly TIMEOUT = 8000; - - public static get instance(): VoiceChannelStore { - if (!VoiceChannelStore._instance) { - VoiceChannelStore._instance = new VoiceChannelStore(); - } - return VoiceChannelStore._instance; - } - - private readonly cli = MatrixClientPeg.get(); - private activeChannel: ClientWidgetApi; - private _roomId: string; - private _participants: IJitsiParticipant[]; - private _audioMuted: boolean; - private _videoMuted: boolean; - - public get roomId(): string { - return this._roomId; - } - - public get participants(): IJitsiParticipant[] { - return this._participants; - } - - public get audioMuted(): boolean { - return this._audioMuted; - } - - public get videoMuted(): boolean { - return this._videoMuted; - } - - public connect = async (roomId: string) => { - if (this.activeChannel) await this.disconnect(); - - const jitsi = getVoiceChannel(roomId); - if (!jitsi) throw new Error(`No voice channel in room ${roomId}`); - - const messaging = WidgetMessagingStore.instance.getMessagingForUid(WidgetUtils.getWidgetUid(jitsi)); - if (!messaging) throw new Error(`Failed to bind voice channel in room ${roomId}`); - - this.activeChannel = messaging; - this._roomId = roomId; - - // Participant data and mute state will come down the event pipeline very quickly, - // so prepare in advance - messaging.on(`action:${ElementWidgetActions.CallParticipants}`, this.onParticipants); - messaging.on(`action:${ElementWidgetActions.MuteAudio}`, this.onMuteAudio); - messaging.on(`action:${ElementWidgetActions.UnmuteAudio}`, this.onUnmuteAudio); - messaging.on(`action:${ElementWidgetActions.MuteVideo}`, this.onMuteVideo); - messaging.on(`action:${ElementWidgetActions.UnmuteVideo}`, this.onUnmuteVideo); - - // Actually perform the join - const waitForJoin = this.waitForAction(ElementWidgetActions.JoinCall); - messaging.transport.send(ElementWidgetActions.JoinCall, {}); - try { - await waitForJoin; - } catch (e) { - // If it timed out, clean up our advance preparations - this.activeChannel = null; - this._roomId = null; - - messaging.off(`action:${ElementWidgetActions.CallParticipants}`, this.onParticipants); - messaging.off(`action:${ElementWidgetActions.MuteAudio}`, this.onMuteAudio); - messaging.off(`action:${ElementWidgetActions.UnmuteAudio}`, this.onUnmuteAudio); - messaging.off(`action:${ElementWidgetActions.MuteVideo}`, this.onMuteVideo); - messaging.off(`action:${ElementWidgetActions.UnmuteVideo}`, this.onUnmuteVideo); - - throw e; - } - - messaging.once(`action:${ElementWidgetActions.HangupCall}`, this.onHangup); - - this.emit(VoiceChannelEvent.Connect); - - // Tell others that we're connected, by adding our device to room state - await this.updateDevices(devices => Array.from(new Set(devices).add(this.cli.getDeviceId()))); - }; - - public disconnect = async () => { - this.assertConnected(); - - const waitForHangup = this.waitForAction(ElementWidgetActions.HangupCall); - this.activeChannel.transport.send(ElementWidgetActions.HangupCall, {}); - await waitForHangup; - - // onHangup cleans up for us - }; - - public muteAudio = async () => { - this.assertConnected(); - - const waitForMute = this.waitForAction(ElementWidgetActions.MuteAudio); - this.activeChannel.transport.send(ElementWidgetActions.MuteAudio, {}); - await waitForMute; - }; - - public unmuteAudio = async () => { - this.assertConnected(); - - const waitForUnmute = this.waitForAction(ElementWidgetActions.UnmuteAudio); - this.activeChannel.transport.send(ElementWidgetActions.UnmuteAudio, {}); - await waitForUnmute; - }; - - public muteVideo = async () => { - this.assertConnected(); - - const waitForMute = this.waitForAction(ElementWidgetActions.MuteVideo); - this.activeChannel.transport.send(ElementWidgetActions.MuteVideo, {}); - await waitForMute; - }; - - public unmuteVideo = async () => { - this.assertConnected(); - - const waitForUnmute = this.waitForAction(ElementWidgetActions.UnmuteVideo); - this.activeChannel.transport.send(ElementWidgetActions.UnmuteVideo, {}); - await waitForUnmute; - }; - - private assertConnected = () => { - if (!this.activeChannel) throw new Error("Not connected to any voice channel"); - }; - - private waitForAction = async (action: ElementWidgetActions) => { - const wait = new Promise(resolve => - this.activeChannel.once(`action:${action}`, (ev: CustomEvent) => { - this.ack(ev); - resolve(); - }), - ); - if (await timeout(wait, false, VoiceChannelStore.TIMEOUT) === false) { - throw new Error("Communication with voice channel timed out"); - } - }; - - private ack = (ev: CustomEvent) => { - this.activeChannel.transport.reply(ev.detail, {}); - }; - - private updateDevices = async (fn: (devices: string[]) => string[]) => { - if (!this.roomId) { - logger.error("Tried to update devices while disconnected"); - return; - } - - const devices = this.cli.getRoom(this.roomId) - .currentState.getStateEvents(VOICE_CHANNEL_MEMBER, this.cli.getUserId()) - ?.getContent()?.devices ?? []; - - await this.cli.sendStateEvent( - this.roomId, VOICE_CHANNEL_MEMBER, { devices: fn(devices) }, this.cli.getUserId(), - ); - }; - - private onHangup = async (ev: CustomEvent) => { - this.ack(ev); - - this.activeChannel.off(`action:${ElementWidgetActions.CallParticipants}`, this.onParticipants); - this.activeChannel.off(`action:${ElementWidgetActions.MuteAudio}`, this.onMuteAudio); - this.activeChannel.off(`action:${ElementWidgetActions.UnmuteAudio}`, this.onUnmuteAudio); - this.activeChannel.off(`action:${ElementWidgetActions.MuteVideo}`, this.onMuteVideo); - this.activeChannel.off(`action:${ElementWidgetActions.UnmuteVideo}`, this.onUnmuteVideo); - - this.activeChannel = null; - this._participants = null; - this._audioMuted = null; - this._videoMuted = null; - - try { - // Tell others that we're disconnected, by removing our device from room state - await this.updateDevices(devices => { - const devicesSet = new Set(devices); - devicesSet.delete(this.cli.getDeviceId()); - return Array.from(devicesSet); - }); - } finally { - // Save this for last, since updateDevices needs the room ID - this._roomId = null; - this.emit(VoiceChannelEvent.Disconnect); - } - }; - - private onParticipants = (ev: CustomEvent) => { - this._participants = ev.detail.data.participants as IJitsiParticipant[]; - this.emit(VoiceChannelEvent.Participants, ev.detail.data.participants); - this.ack(ev); - }; - - private onMuteAudio = (ev: CustomEvent) => { - this._audioMuted = true; - this.emit(VoiceChannelEvent.MuteAudio); - this.ack(ev); - }; - - private onUnmuteAudio = (ev: CustomEvent) => { - this._audioMuted = false; - this.emit(VoiceChannelEvent.UnmuteAudio); - this.ack(ev); - }; - - private onMuteVideo = (ev: CustomEvent) => { - this._videoMuted = true; - this.emit(VoiceChannelEvent.MuteVideo); - this.ack(ev); - }; - - private onUnmuteVideo = (ev: CustomEvent) => { - this._videoMuted = false; - this.emit(VoiceChannelEvent.UnmuteVideo); - this.ack(ev); - }; -} diff --git a/src/utils/VoiceChannelUtils.ts b/src/utils/VideoChannelUtils.ts similarity index 72% rename from src/utils/VoiceChannelUtils.ts rename to src/utils/VideoChannelUtils.ts index bee6388ed4..d989324ed4 100644 --- a/src/utils/VoiceChannelUtils.ts +++ b/src/utils/VideoChannelUtils.ts @@ -22,26 +22,26 @@ import WidgetStore, { IApp } from "../stores/WidgetStore"; import { WidgetType } from "../widgets/WidgetType"; import WidgetUtils from "./WidgetUtils"; -export const VOICE_CHANNEL = "io.element.voice"; -export const VOICE_CHANNEL_MEMBER = "io.element.voice.member"; +export const VIDEO_CHANNEL = "io.element.video"; +export const VIDEO_CHANNEL_MEMBER = "io.element.video.member"; -export interface IVoiceChannelMemberContent { +export interface IVideoChannelMemberContent { // Connected device IDs devices: string[]; } -export const getVoiceChannel = (roomId: string): IApp => { +export const getVideoChannel = (roomId: string): IApp => { const apps = WidgetStore.instance.getApps(roomId); - return apps.find(app => WidgetType.JITSI.matches(app.type) && app.id === VOICE_CHANNEL); + return apps.find(app => WidgetType.JITSI.matches(app.type) && app.id === VIDEO_CHANNEL); }; -export const addVoiceChannel = async (roomId: string, roomName: string) => { - await WidgetUtils.addJitsiWidget(roomId, CallType.Voice, "Voice channel", VOICE_CHANNEL, roomName); +export const addVideoChannel = async (roomId: string, roomName: string) => { + await WidgetUtils.addJitsiWidget(roomId, CallType.Video, "Video channel", VIDEO_CHANNEL, roomName); }; export const getConnectedMembers = (state: RoomState): RoomMember[] => - state.getStateEvents(VOICE_CHANNEL_MEMBER) + state.getStateEvents(VIDEO_CHANNEL_MEMBER) // Must have a device connected and still be joined to the room - .filter(e => e.getContent().devices?.length) + .filter(e => e.getContent().devices?.length) .map(e => state.getMember(e.getStateKey())) .filter(member => member.membership === "join"); diff --git a/src/utils/WidgetUtils.ts b/src/utils/WidgetUtils.ts index 1515b77b2c..8537e03583 100644 --- a/src/utils/WidgetUtils.ts +++ b/src/utils/WidgetUtils.ts @@ -36,6 +36,7 @@ import { Jitsi } from "../widgets/Jitsi"; import { objectClone } from "./objects"; import { _t } from "../languageHandler"; import { IApp } from "../stores/WidgetStore"; +import { VIDEO_CHANNEL } from "./VideoChannelUtils"; // How long we wait for the state event echo to come back from the server // before waitFor[Room/User]Widget rejects its promise @@ -469,6 +470,7 @@ export default class WidgetUtils { conferenceId: confId, roomName: oobRoomName ?? MatrixClientPeg.get().getRoom(roomId)?.name, isAudioOnly: type === CallType.Voice, + isVideoChannel: widgetId === VIDEO_CHANNEL, domain, auth, }); @@ -515,6 +517,7 @@ export default class WidgetUtils { 'conferenceDomain=$domain', 'conferenceId=$conferenceId', 'isAudioOnly=$isAudioOnly', + 'isVideoChannel=$isVideoChannel', 'displayName=$matrix_display_name', 'avatarUrl=$matrix_avatar_url', 'userId=$matrix_user_id', diff --git a/src/utils/space.tsx b/src/utils/space.tsx index 442a411af8..9394f56c74 100644 --- a/src/utils/space.tsx +++ b/src/utils/space.tsx @@ -16,6 +16,7 @@ limitations under the License. import React from "react"; import { Room } from "matrix-js-sdk/src/models/room"; +import { RoomType } from "matrix-js-sdk/src/@types/event"; import { EventType } from "matrix-js-sdk/src/@types/event"; import { JoinRule } from "matrix-js-sdk/src/@types/partials"; @@ -92,12 +93,13 @@ export const showAddExistingRooms = (space: Room): void => { ); }; -export const showCreateNewRoom = async (space: Room): Promise => { +export const showCreateNewRoom = async (space: Room, type?: RoomType): Promise => { const modal = Modal.createTrackedDialog<[boolean, IOpts]>( "Space Landing", "Create Room", CreateRoomDialog, { + type, defaultPublic: space.getJoinRule() === JoinRule.Public, parentSpace: space, }, diff --git a/test/components/views/rooms/RoomTile-test.tsx b/test/components/views/rooms/RoomTile-test.tsx index 4e960afe46..b0a98c8b3c 100644 --- a/test/components/views/rooms/RoomTile-test.tsx +++ b/test/components/views/rooms/RoomTile-test.tsx @@ -28,21 +28,19 @@ import { mkRoom, mkEvent, } from "../../../test-utils"; -import { stubVoiceChannelStore } from "../../../test-utils/voice"; +import { stubVideoChannelStore } from "../../../test-utils/video"; import RoomTile from "../../../../src/components/views/rooms/RoomTile"; -import MemberAvatar from "../../../../src/components/views/avatars/MemberAvatar"; import SettingsStore from "../../../../src/settings/SettingsStore"; -import VoiceChannelStore, { VoiceChannelEvent } from "../../../../src/stores/VoiceChannelStore"; import { DefaultTagID } from "../../../../src/stores/room-list/models"; import DMRoomMap from "../../../../src/utils/DMRoomMap"; -import { VOICE_CHANNEL_MEMBER } from "../../../../src/utils/VoiceChannelUtils"; +import { VIDEO_CHANNEL_MEMBER } from "../../../../src/utils/VideoChannelUtils"; import { MatrixClientPeg } from "../../../../src/MatrixClientPeg"; import PlatformPeg from "../../../../src/PlatformPeg"; import BasePlatform from "../../../../src/BasePlatform"; -const mkVoiceChannelMember = (userId: string, devices: string[]): MatrixEvent => mkEvent({ +const mkVideoChannelMember = (userId: string, devices: string[]): MatrixEvent => mkEvent({ event: true, - type: VOICE_CHANNEL_MEMBER, + type: VIDEO_CHANNEL_MEMBER, room: "!1:example.org", user: userId, skey: userId, @@ -59,36 +57,25 @@ describe("RoomTile", () => { beforeEach(() => { const realGetValue = SettingsStore.getValue; SettingsStore.getValue = (name: string, roomId?: string): T => { - if (name === "feature_voice_rooms") { + if (name === "feature_video_rooms") { return true as unknown as T; } return realGetValue(name, roomId); }; stubClient(); - stubVoiceChannelStore(); - DMRoomMap.makeShared(); - cli = mocked(MatrixClientPeg.get()); - store = VoiceChannelStore.instance; + store = stubVideoChannelStore(); + DMRoomMap.makeShared(); }); afterEach(() => jest.clearAllMocks()); - describe("voice rooms", () => { + describe("video rooms", () => { const room = mkRoom(cli, "!1:example.org"); room.isCallRoom.mockReturnValue(true); - it("tracks connection state", async () => { - // Insert a breakpoint in the connect method, so we can see the intermediate connecting state - let continueJoin; - const breakpoint = new Promise(resolve => continueJoin = resolve); - const realConnect = store.connect; - store.connect = async () => { - await breakpoint; - await realConnect(); - }; - + it("tracks connection state", () => { const tile = mount( { tag={DefaultTagID.Untagged} />, ); - expect(tile.find(".mx_RoomTile_voiceIndicator").text()).toEqual("Voice room"); + expect(tile.find(".mx_RoomTile_videoIndicator").text()).toEqual("Video"); - act(() => { tile.simulate("click"); }); + act(() => { store.connect("!1:example.org"); }); tile.update(); - expect(tile.find(".mx_RoomTile_voiceIndicator").text()).toEqual("Connecting..."); - - // Now we confirm the join and wait for the store to update - const waitForConnect = new Promise(resolve => - store.once(VoiceChannelEvent.Connect, resolve), - ); - continueJoin(); - await waitForConnect; - // Wait exactly 2 ticks for the room tile to update - await Promise.resolve(); - await Promise.resolve(); + expect(tile.find(".mx_RoomTile_videoIndicator").text()).toEqual("Connected"); + act(() => { store.disconnect(); }); tile.update(); - expect(tile.find(".mx_RoomTile_voiceIndicator").text()).toEqual("Connected"); - - await store.disconnect(); - - tile.update(); - expect(tile.find(".mx_RoomTile_voiceIndicator").text()).toEqual("Voice room"); + expect(tile.find(".mx_RoomTile_videoIndicator").text()).toEqual("Video"); }); - it("displays connected members", async () => { + it("displays connected members", () => { mocked(room.currentState).getStateEvents.mockImplementation(mockStateEventImplementation([ // A user connected from 2 devices - mkVoiceChannelMember("@alice:example.org", ["device 1", "device 2"]), + mkVideoChannelMember("@alice:example.org", ["device 1", "device 2"]), // A disconnected user - mkVoiceChannelMember("@bob:example.org", []), + mkVideoChannelMember("@bob:example.org", []), // A user that claims to have a connected device, but has left the room - mkVoiceChannelMember("@chris:example.org", ["device 1"]), + mkVideoChannelMember("@chris:example.org", ["device 1"]), ])); mocked(room.currentState).getMember.mockImplementation(userId => ({ @@ -152,9 +125,8 @@ describe("RoomTile", () => { ); // Only Alice should display as connected - const avatar = tile.find(MemberAvatar); - expect(avatar.length).toEqual(1); - expect(avatar.props().member.userId).toEqual("@alice:example.org"); + const participants = tile.find(".mx_RoomTile_videoParticipants"); + expect(participants.text()).toEqual("1"); }); }); }); diff --git a/test/components/views/voip/VoiceChannelRadio-test.tsx b/test/components/views/voip/VoiceChannelRadio-test.tsx deleted file mode 100644 index b42ac0e089..0000000000 --- a/test/components/views/voip/VoiceChannelRadio-test.tsx +++ /dev/null @@ -1,107 +0,0 @@ -/* -Copyright 2022 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 { mount } from "enzyme"; -import { act } from "react-dom/test-utils"; -import { mocked } from "jest-mock"; - -import "../../../skinned-sdk"; -import { stubClient, mkStubRoom, wrapInMatrixClientContext } from "../../../test-utils"; -import { stubVoiceChannelStore } from "../../../test-utils/voice"; -import _VoiceChannelRadio from "../../../../src/components/views/voip/VoiceChannelRadio"; -import VoiceChannelStore from "../../../../src/stores/VoiceChannelStore"; -import DMRoomMap from "../../../../src/utils/DMRoomMap"; -import { MatrixClientPeg } from "../../../../src/MatrixClientPeg"; - -const VoiceChannelRadio = wrapInMatrixClientContext(_VoiceChannelRadio); - -describe("VoiceChannelRadio", () => { - const cli = mocked(MatrixClientPeg.get()); - const room = mkStubRoom("!1:example.org", "voice channel", cli); - room.isCallRoom = () => true; - - beforeEach(() => { - stubClient(); - stubVoiceChannelStore(); - DMRoomMap.makeShared(); - }); - - it("shows when connecting voice", async () => { - const radio = mount(); - expect(radio.children().children().exists()).toEqual(false); - - act(() => { VoiceChannelStore.instance.connect("!1:example.org"); }); - radio.update(); - expect(radio.children().children().exists()).toEqual(true); - }); - - it("hides when disconnecting voice", () => { - VoiceChannelStore.instance.connect("!1:example.org"); - const radio = mount(); - expect(radio.children().children().exists()).toEqual(true); - - act(() => { VoiceChannelStore.instance.disconnect(); }); - radio.update(); - expect(radio.children().children().exists()).toEqual(false); - }); - - describe("disconnect button", () => { - it("works", () => { - VoiceChannelStore.instance.connect("!1:example.org"); - const radio = mount(); - - act(() => { - radio.find("AccessibleButton.mx_VoiceChannelRadio_disconnectButton").simulate("click"); - }); - expect(VoiceChannelStore.instance.disconnect).toHaveBeenCalled(); - }); - }); - - describe("video button", () => { - it("works", () => { - VoiceChannelStore.instance.connect("!1:example.org"); - const radio = mount(); - - act(() => { - radio.find("AccessibleButton.mx_VoiceChannelRadio_videoButton").simulate("click"); - }); - expect(VoiceChannelStore.instance.unmuteVideo).toHaveBeenCalled(); - - act(() => { - radio.find("AccessibleButton.mx_VoiceChannelRadio_videoButton").simulate("click"); - }); - expect(VoiceChannelStore.instance.muteVideo).toHaveBeenCalled(); - }); - }); - - describe("audio button", () => { - it("works", () => { - VoiceChannelStore.instance.connect("!1:example.org"); - const radio = mount(); - - act(() => { - radio.find("AccessibleButton.mx_VoiceChannelRadio_audioButton").simulate("click"); - }); - expect(VoiceChannelStore.instance.unmuteAudio).toHaveBeenCalled(); - - act(() => { - radio.find("AccessibleButton.mx_VoiceChannelRadio_audioButton").simulate("click"); - }); - expect(VoiceChannelStore.instance.muteAudio).toHaveBeenCalled(); - }); - }); -}); diff --git a/test/end-to-end-tests/src/usecases/create-room.ts b/test/end-to-end-tests/src/usecases/create-room.ts index 8736e785ba..b0e7738fb4 100644 --- a/test/end-to-end-tests/src/usecases/create-room.ts +++ b/test/end-to-end-tests/src/usecases/create-room.ts @@ -36,7 +36,7 @@ export async function createRoom(session: ElementSession, roomName: string, encr const addRoomButton = await roomsSublist.$(".mx_RoomSublist_auxButton"); await addRoomButton.click(); - const createRoomButton = await session.query('.mx_AccessibleButton[aria-label="Create new room"]'); + const createRoomButton = await session.query('.mx_AccessibleButton[aria-label="New room"]'); await createRoomButton.click(); const roomNameInput = await session.query('.mx_CreateRoomDialog_name input'); diff --git a/test/stores/VideoChannelStore-test.ts b/test/stores/VideoChannelStore-test.ts new file mode 100644 index 0000000000..e1420195c1 --- /dev/null +++ b/test/stores/VideoChannelStore-test.ts @@ -0,0 +1,83 @@ +/* +Copyright 2022 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 { ClientWidgetApi, MatrixWidgetType } from "matrix-widget-api"; + +import "../skinned-sdk"; +import { stubClient, mkRoom } from "../test-utils"; +import { MatrixClientPeg } from "../../src/MatrixClientPeg"; +import WidgetStore from "../../src/stores/WidgetStore"; +import ActiveWidgetStore from "../../src/stores/ActiveWidgetStore"; +import { WidgetMessagingStore } from "../../src/stores/widgets/WidgetMessagingStore"; +import VideoChannelStore, { VideoChannelEvent } from "../../src/stores/VideoChannelStore"; +import { VIDEO_CHANNEL } from "../../src/utils/VideoChannelUtils"; + +describe("VideoChannelStore", () => { + stubClient(); + mkRoom(MatrixClientPeg.get(), "!1:example.org"); + + const videoStore = VideoChannelStore.instance; + const widgetStore = ActiveWidgetStore.instance; + + jest.spyOn(WidgetStore.instance, "getApps").mockReturnValue([{ + id: VIDEO_CHANNEL, + eventId: "$1:example.org", + roomId: "!1:example.org", + type: MatrixWidgetType.JitsiMeet, + url: "", + name: "Video channel", + creatorUserId: "@alice:example.org", + avatar_url: null, + }]); + jest.spyOn(WidgetMessagingStore.instance, "getMessagingForUid").mockReturnValue({ + on: () => {}, + off: () => {}, + once: () => {}, + transport: { + send: () => {}, + reply: () => {}, + }, + } as unknown as ClientWidgetApi); + + beforeEach(() => { + videoStore.start(); + }); + + afterEach(() => { + videoStore.stop(); + jest.clearAllMocks(); + }); + + it("tracks connection state", async () => { + expect(videoStore.roomId).toBeFalsy(); + + const waitForConnect = new Promise(resolve => + videoStore.once(VideoChannelEvent.Connect, resolve), + ); + widgetStore.setWidgetPersistence(VIDEO_CHANNEL, "!1:example.org", true); + await waitForConnect; + + expect(videoStore.roomId).toEqual("!1:example.org"); + + const waitForDisconnect = new Promise(resolve => + videoStore.once(VideoChannelEvent.Disconnect, resolve), + ); + widgetStore.setWidgetPersistence(VIDEO_CHANNEL, "!1:example.org", false); + await waitForDisconnect; + + expect(videoStore.roomId).toBeFalsy(); + }); +}); diff --git a/test/stores/VoiceChannelStore-test.ts b/test/stores/VoiceChannelStore-test.ts deleted file mode 100644 index cf70e7314c..0000000000 --- a/test/stores/VoiceChannelStore-test.ts +++ /dev/null @@ -1,95 +0,0 @@ -/* -Copyright 2022 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 { ClientWidgetApi, MatrixWidgetType } from "matrix-widget-api"; - -import "../skinned-sdk"; -import { stubClient } from "../test-utils"; -import WidgetStore from "../../src/stores/WidgetStore"; -import { WidgetMessagingStore } from "../../src/stores/widgets/WidgetMessagingStore"; -import { ElementWidgetActions } from "../../src/stores/widgets/ElementWidgetActions"; -import VoiceChannelStore, { VoiceChannelEvent } from "../../src/stores/VoiceChannelStore"; -import { VOICE_CHANNEL } from "../../src/utils/VoiceChannelUtils"; - -describe("VoiceChannelStore", () => { - // Set up mocks to simulate the remote end of the widget API - let messageSent; - let messageSendMock; - let onceMock; - beforeEach(() => { - stubClient(); - let resolveMessageSent; - messageSent = new Promise(resolve => resolveMessageSent = resolve); - messageSendMock = jest.fn().mockImplementation(() => resolveMessageSent()); - onceMock = jest.fn(); - - jest.spyOn(WidgetStore.instance, "getApps").mockReturnValue([{ - id: VOICE_CHANNEL, - eventId: "$1:example.org", - roomId: "!1:example.org", - type: MatrixWidgetType.JitsiMeet, - url: "", - name: "Voice channel", - creatorUserId: "@alice:example.org", - avatar_url: null, - }]); - jest.spyOn(WidgetMessagingStore.instance, "getMessagingForUid").mockReturnValue({ - on: () => {}, - off: () => {}, - once: onceMock, - transport: { - send: messageSendMock, - reply: () => {}, - }, - } as unknown as ClientWidgetApi); - }); - - it("connects and disconnects", async () => { - const store = VoiceChannelStore.instance; - - expect(store.roomId).toBeFalsy(); - - store.connect("!1:example.org"); - // Wait for the store to contact the widget API - await messageSent; - // Then, locate the callback that will confirm the join - const [, join] = onceMock.mock.calls.find(([action]) => - action === `action:${ElementWidgetActions.JoinCall}`, - ); - // Confirm the join, and wait for the store to update - const waitForConnect = new Promise(resolve => - store.once(VoiceChannelEvent.Connect, resolve), - ); - join({ detail: {} }); - await waitForConnect; - - expect(store.roomId).toEqual("!1:example.org"); - - store.disconnect(); - // Locate the callback that will perform the hangup - const [, hangup] = onceMock.mock.calls.find(([action]) => - action === `action:${ElementWidgetActions.HangupCall}`, - ); - // Hangup and wait for the store, once again - const waitForHangup = new Promise(resolve => - store.once(VoiceChannelEvent.Disconnect, resolve), - ); - hangup({ detail: {} }); - await waitForHangup; - - expect(store.roomId).toBeFalsy(); - }); -}); diff --git a/test/test-utils/index.ts b/test/test-utils/index.ts index b14bda3cbb..0859bd976b 100644 --- a/test/test-utils/index.ts +++ b/test/test-utils/index.ts @@ -4,6 +4,6 @@ export * from './location'; export * from './platform'; export * from './room'; export * from './test-utils'; -// TODO @@TR: Export voice.ts, which currently isn't exported here because it causes all tests to depend on skinning +// TODO @@TR: Export video.ts, which currently isn't exported here because it causes all tests to depend on skinning export * from './wrappers'; export * from './utilities'; diff --git a/test/test-utils/video.ts b/test/test-utils/video.ts new file mode 100644 index 0000000000..9130945215 --- /dev/null +++ b/test/test-utils/video.ts @@ -0,0 +1,39 @@ +/* +Copyright 2022 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 { EventEmitter } from "events"; + +import VideoChannelStore, { VideoChannelEvent } from "../../src/stores/VideoChannelStore"; + +class StubVideoChannelStore extends EventEmitter { + private _roomId: string; + public get roomId(): string { return this._roomId; } + + public connect = (roomId: string) => { + this._roomId = roomId; + this.emit(VideoChannelEvent.Connect); + }; + public disconnect = () => { + this._roomId = null; + this.emit(VideoChannelEvent.Disconnect); + }; +} + +export const stubVideoChannelStore = (): StubVideoChannelStore => { + const store = new StubVideoChannelStore(); + jest.spyOn(VideoChannelStore, "instance", "get").mockReturnValue(store as unknown as VideoChannelStore); + return store; +}; diff --git a/test/test-utils/voice.ts b/test/test-utils/voice.ts deleted file mode 100644 index 962e4c6c56..0000000000 --- a/test/test-utils/voice.ts +++ /dev/null @@ -1,60 +0,0 @@ -/* -Copyright 2022 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 { EventEmitter } from "events"; - -import VoiceChannelStore, { VoiceChannelEvent } from "../../src/stores/VoiceChannelStore"; - -class StubVoiceChannelStore extends EventEmitter { - private _roomId: string; - public get roomId(): string { return this._roomId; } - private _audioMuted: boolean; - public get audioMuted(): boolean { return this._audioMuted; } - private _videoMuted: boolean; - public get videoMuted(): boolean { return this._videoMuted; } - - public connect = jest.fn().mockImplementation(async (roomId: string) => { - this._roomId = roomId; - this._audioMuted = true; - this._videoMuted = true; - this.emit(VoiceChannelEvent.Connect); - }); - public disconnect = jest.fn().mockImplementation(async () => { - this._roomId = null; - this.emit(VoiceChannelEvent.Disconnect); - }); - public muteAudio = jest.fn().mockImplementation(async () => { - this._audioMuted = true; - this.emit(VoiceChannelEvent.MuteAudio); - }); - public unmuteAudio = jest.fn().mockImplementation(async () => { - this._audioMuted = false; - this.emit(VoiceChannelEvent.UnmuteAudio); - }); - public muteVideo = jest.fn().mockImplementation(async () => { - this._videoMuted = true; - this.emit(VoiceChannelEvent.MuteVideo); - }); - public unmuteVideo = jest.fn().mockImplementation(async () => { - this._videoMuted = false; - this.emit(VoiceChannelEvent.UnmuteVideo); - }); -} - -export const stubVoiceChannelStore = () => { - jest.spyOn(VoiceChannelStore, "instance", "get") - .mockReturnValue(new StubVoiceChannelStore() as unknown as VoiceChannelStore); -}; From 9bfd60e9153a453ca606b71fd4ab12db438bb739 Mon Sep 17 00:00:00 2001 From: Kat Gerasimova Date: Sun, 3 Apr 2022 22:01:48 +0100 Subject: [PATCH 05/16] Remove triage automation (#8192) GitHub don't support cross-organisation automation at this time, so removing the file for now. --- .../workflows/triage-move-review-requests.yml | 139 ------------------ 1 file changed, 139 deletions(-) delete mode 100644 .github/workflows/triage-move-review-requests.yml diff --git a/.github/workflows/triage-move-review-requests.yml b/.github/workflows/triage-move-review-requests.yml deleted file mode 100644 index 49db29ff5c..0000000000 --- a/.github/workflows/triage-move-review-requests.yml +++ /dev/null @@ -1,139 +0,0 @@ -name: Move pull requests asking for review to the relevant project -on: - pull_request_target: - types: [review_requested] - -jobs: - add_design_pr_to_project: - name: Move PRs asking for design review to the design board - runs-on: ubuntu-latest - steps: - - uses: octokit/graphql-action@v2.x - id: find_team_members - with: - headers: '{"GraphQL-Features": "projects_next_graphql"}' - query: | - query find_team_members($team: String!) { - organization(login: "matrix-org") { - team(slug: $team) { - members { - nodes { - login - } - } - } - } - } - team: ${{ env.TEAM }} - env: - TEAM: "design" - GITHUB_TOKEN: ${{ secrets.ELEMENT_BOT_TOKEN }} - - id: any_matching_reviewers - run: | - # Fetch requested reviewers, and people who are on the team - echo '${{ tojson(fromjson(steps.find_team_members.outputs.data).organization.team.members.nodes[*].login) }}' | tee /tmp/team_members.json - echo '${{ tojson(github.event.pull_request.requested_reviewers[*].login) }}' | tee /tmp/reviewers.json - jq --raw-output .[] < /tmp/team_members.json | sort | tee /tmp/team_members.txt - jq --raw-output .[] < /tmp/reviewers.json | sort | tee /tmp/reviewers.txt - - # Fetch requested team reviewers, and the name of the team - echo '${{ tojson(github.event.pull_request.requested_teams[*].slug) }}' | tee /tmp/team_reviewers.json - jq --raw-output .[] < /tmp/team_reviewers.json | sort | tee /tmp/team_reviewers.txt - echo '${{ env.TEAM }}' | tee /tmp/team.txt - - # If either a reviewer matches a team member, or a team matches our team, say "true" - if [ $(join /tmp/team_members.txt /tmp/reviewers.txt | wc -l) != 0 ]; then - echo "::set-output name=match::true" - elif [ $(join /tmp/team.txt /tmp/team_reviewers.txt | wc -l) != 0 ]; then - echo "::set-output name=match::true" - else - echo "::set-output name=match::false" - fi - env: - TEAM: "design" - - uses: octokit/graphql-action@v2.x - id: add_to_project - if: steps.any_matching_reviewers.outputs.match == 'true' - with: - headers: '{"GraphQL-Features": "projects_next_graphql"}' - query: | - mutation add_to_project($projectid:ID!, $contentid:ID!) { - addProjectNextItem(input:{projectId:$projectid contentId:$contentid}) { - projectNextItem { - id - } - } - } - projectid: ${{ env.PROJECT_ID }} - contentid: ${{ github.event.pull_request.node_id }} - env: - PROJECT_ID: "PN_kwDOAM0swc0sUA" - TEAM: "design" - GITHUB_TOKEN: ${{ secrets.ELEMENT_BOT_TOKEN }} - - add_product_pr_to_project: - name: Move PRs asking for design review to the design board - runs-on: ubuntu-latest - steps: - - uses: octokit/graphql-action@v2.x - id: find_team_members - with: - headers: '{"GraphQL-Features": "projects_next_graphql"}' - query: | - query find_team_members($team: String!) { - organization(login: "matrix-org") { - team(slug: $team) { - members { - nodes { - login - } - } - } - } - } - team: ${{ env.TEAM }} - env: - TEAM: "product" - GITHUB_TOKEN: ${{ secrets.ELEMENT_BOT_TOKEN }} - - id: any_matching_reviewers - run: | - # Fetch requested reviewers, and people who are on the team - echo '${{ tojson(fromjson(steps.find_team_members.outputs.data).organization.team.members.nodes[*].login) }}' | tee /tmp/team_members.json - echo '${{ tojson(github.event.pull_request.requested_reviewers[*].login) }}' | tee /tmp/reviewers.json - jq --raw-output .[] < /tmp/team_members.json | sort | tee /tmp/team_members.txt - jq --raw-output .[] < /tmp/reviewers.json | sort | tee /tmp/reviewers.txt - - # Fetch requested team reviewers, and the name of the team - echo '${{ tojson(github.event.pull_request.requested_teams[*].slug) }}' | tee /tmp/team_reviewers.json - jq --raw-output .[] < /tmp/team_reviewers.json | sort | tee /tmp/team_reviewers.txt - echo '${{ env.TEAM }}' | tee /tmp/team.txt - - # If either a reviewer matches a team member, or a team matches our team, say "true" - if [ $(join /tmp/team_members.txt /tmp/reviewers.txt | wc -l) != 0 ]; then - echo "::set-output name=match::true" - elif [ $(join /tmp/team.txt /tmp/team_reviewers.txt | wc -l) != 0 ]; then - echo "::set-output name=match::true" - else - echo "::set-output name=match::false" - fi - env: - TEAM: "product" - - uses: octokit/graphql-action@v2.x - id: add_to_project - if: steps.any_matching_reviewers.outputs.match == 'true' - with: - headers: '{"GraphQL-Features": "projects_next_graphql"}' - query: | - mutation add_to_project($projectid:ID!, $contentid:ID!) { - addProjectNextItem(input:{projectId:$projectid contentId:$contentid}) { - projectNextItem { - id - } - } - } - projectid: ${{ env.PROJECT_ID }} - contentid: ${{ github.event.pull_request.node_id }} - env: - PROJECT_ID: "PN_kwDOAM0swc4AAg6N" - TEAM: "product" - GITHUB_TOKEN: ${{ secrets.ELEMENT_BOT_TOKEN }} From 19c665f5b8249823b05adfa9a6a0e04120b0f3ef Mon Sep 17 00:00:00 2001 From: "Shivrani A. Jadhav" <86149243+ShivraniAJ@users.noreply.github.com> Date: Mon, 4 Apr 2022 11:18:25 +0530 Subject: [PATCH 06/16] Fix typo in key binding manager docs (#8221) I found a Typo error in KeyBindingManager, I have fixed that typo. --- docs/features/keyboardShortcuts.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/features/keyboardShortcuts.md b/docs/features/keyboardShortcuts.md index 7181402354..349535918b 100644 --- a/docs/features/keyboardShortcuts.md +++ b/docs/features/keyboardShortcuts.md @@ -1,6 +1,6 @@ # Keyboard shortcuts -## Using the `KeyBindingManger` +## Using the `KeyBindingManager` The `KeyBindingManager` (accessible using `getKeyBindingManager()`) is a class with several methods that allow you to get a `KeyBindingAction` based on a From 631fd875094cd58e6d7d99e130c657f1180baa17 Mon Sep 17 00:00:00 2001 From: Suguru Hirahara Date: Mon, 4 Apr 2022 06:34:39 +0000 Subject: [PATCH 07/16] Normalize call buttons (#8129) - Set a mixin to use it on call events and toasts Fixes https://github.com/vector-im/element-web/issues/21493 Signed-off-by: Suguru Hirahara --- res/css/_common.scss | 22 +++++++++++++++ res/css/views/messages/_CallEvent.scss | 28 ++++++-------------- res/css/views/toasts/_IncomingCallToast.scss | 15 +---------- 3 files changed, 31 insertions(+), 34 deletions(-) diff --git a/res/css/_common.scss b/res/css/_common.scss index a4b470d052..4ead7381fc 100644 --- a/res/css/_common.scss +++ b/res/css/_common.scss @@ -670,3 +670,25 @@ legend { line-height: inherit; cursor: pointer; } + +@define-mixin CallButton { + box-sizing: border-box; + font-weight: 600; + height: $font-24px; + line-height: $font-24px; + margin-right: 0; + + span { + display: flex; + align-items: center; + + &::before { + content: ''; + display: inline-block; + background-color: $button-fg-color; + mask-position: center; + mask-repeat: no-repeat; + margin-right: 8px; + } + } +} diff --git a/res/css/views/messages/_CallEvent.scss b/res/css/views/messages/_CallEvent.scss index 2587e73e50..b5ef5b0bc1 100644 --- a/res/css/views/messages/_CallEvent.scss +++ b/res/css/views/messages/_CallEvent.scss @@ -147,30 +147,18 @@ limitations under the License. align-items: center; color: $secondary-content; margin-right: 16px; - gap: 8px; + gap: 12px; // See mx_IncomingCallToast_buttons min-width: max-content; .mx_CallEvent_content_button { - padding: 0px 12px; + @mixin CallButton; + padding: 0 12px; - span { - padding: 1px 0; - display: flex; - align-items: center; - - &::before { - content: ''; - display: inline-block; - background-color: $button-fg-color; - mask-position: center; - mask-repeat: no-repeat; - mask-size: 16px; - width: 16px; - height: 16px; - margin-right: 8px; - - flex-shrink: 0; - } + span::before { + mask-size: 16px; + width: 16px; + height: 16px; + flex-shrink: 0; } } diff --git a/res/css/views/toasts/_IncomingCallToast.scss b/res/css/views/toasts/_IncomingCallToast.scss index cb05b1a977..5fd244c277 100644 --- a/res/css/views/toasts/_IncomingCallToast.scss +++ b/res/css/views/toasts/_IncomingCallToast.scss @@ -90,27 +90,14 @@ limitations under the License. gap: 12px; .mx_IncomingCallToast_button { - height: 24px; + @mixin CallButton; padding: 0px 8px; flex-shrink: 0; flex-grow: 1; - margin-right: 0; font-size: $font-15px; - line-height: $font-24px; span { padding: 8px 0; - display: flex; - align-items: center; - - &::before { - content: ''; - display: inline-block; - background-color: $button-fg-color; - mask-position: center; - mask-repeat: no-repeat; - margin-right: 8px; - } } &.mx_IncomingCallToast_button_accept span::before { From 13a51654e7826e67df7394f294d071bd1b993afe Mon Sep 17 00:00:00 2001 From: Sinharitik589 <67551927+Sinharitik589@users.noreply.github.com> Date: Mon, 4 Apr 2022 12:24:54 +0530 Subject: [PATCH 08/16] Spaces selected by default when created (#8085) * Spaces selected by default when created * Spaces selected by default when created * Spaces selected by default when created * Spaces selected by default when created => removed lines intended for room creation * Spaces selected by default when created * Spaces selected by default when created => removed unwanted console log * Spaces selected by default when created => added accidently removed line * Spaces selected by default when created => added accidently removed line * Spaces selected by default when created => linting and brackets added * Update src/stores/spaces/SpaceStore.ts Co-authored-by: Michael Telatynski <7t3chguy@gmail.com> * Update src/stores/spaces/SpaceStore.ts Co-authored-by: Michael Telatynski <7t3chguy@gmail.com> * Added missing bracket Co-authored-by: Michael Telatynski <7t3chguy@gmail.com> --- src/stores/spaces/SpaceStore.ts | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/stores/spaces/SpaceStore.ts b/src/stores/spaces/SpaceStore.ts index 6e98868712..3360e77c33 100644 --- a/src/stores/spaces/SpaceStore.ts +++ b/src/stores/spaces/SpaceStore.ts @@ -1116,7 +1116,8 @@ export class SpaceStoreClass extends AsyncStoreWithClient { case Action.ViewRoom: { // Don't auto-switch rooms when reacting to a context-switch or for new rooms being created // as this is not helpful and can create loops of rooms/space switching - if (payload.context_switch || payload.justCreatedOpts) break; + const isSpace = payload.justCreatedOpts?.roomType === RoomType.Space; + if (payload.context_switch || (payload.justCreatedOpts && !isSpace)) break; let roomId = payload.room_id; if (payload.room_alias && !roomId) { From 39f001e7f57a59bd35270784ccf64131d98ff584 Mon Sep 17 00:00:00 2001 From: Robin Date: Mon, 4 Apr 2022 07:32:36 -0400 Subject: [PATCH 09/16] Make "Jump to date" translatable (#8218) --- src/components/views/messages/JumpToDatePicker.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/views/messages/JumpToDatePicker.tsx b/src/components/views/messages/JumpToDatePicker.tsx index 1af8fff8d4..925a741c18 100644 --- a/src/components/views/messages/JumpToDatePicker.tsx +++ b/src/components/views/messages/JumpToDatePicker.tsx @@ -77,7 +77,7 @@ const JumpToDatePicker: React.FC = ({ ts, onDatePicked }: IProps) => { className="mx_JumpToDatePicker_form" onSubmit={onJumpToDateSubmit} > - Jump to date + { _t("Jump to date") } Date: Mon, 4 Apr 2022 12:36:54 +0100 Subject: [PATCH 10/16] Revamp notification dot for better readibility (#8197) --- res/css/structures/_RightPanel.scss | 28 ++++++++++++------- res/css/views/rooms/_EventTile.scss | 2 +- res/themes/dark/css/_dark.scss | 5 ++++ res/themes/legacy-dark/css/_legacy-dark.scss | 1 + .../legacy-light/css/_legacy-light.scss | 1 + res/themes/light/css/_light.scss | 5 ++++ .../views/right_panel/HeaderButton.tsx | 4 ++- .../views/right_panel/RoomHeaderButtons.tsx | 2 ++ 8 files changed, 36 insertions(+), 12 deletions(-) diff --git a/res/css/structures/_RightPanel.scss b/res/css/structures/_RightPanel.scss index 916f14b4e8..c53bc86400 100644 --- a/res/css/structures/_RightPanel.scss +++ b/res/css/structures/_RightPanel.scss @@ -93,7 +93,8 @@ limitations under the License. mask-position: center; } -$dot-size: 7px; +$dot-size: 8px; +$dot-offset: -3px; $pulse-color: $alert; .mx_RightPanel_pinnedMessagesButton { @@ -104,8 +105,8 @@ $pulse-color: $alert; } .mx_RightPanel_headerButton_unreadIndicator_bg { position: absolute; - right: 0; - top: 0; + right: $dot-offset; + top: $dot-offset; margin: 4px; width: $dot-size; height: $dot-size; @@ -117,8 +118,8 @@ $pulse-color: $alert; .mx_RightPanel_headerButton_unreadIndicator { position: absolute; - right: 0; - top: 0; + right: $dot-offset; + top: $dot-offset; margin: 4px; width: $dot-size; height: $dot-size; @@ -135,13 +136,13 @@ $pulse-color: $alert; } &.mx_Indicator_gray { - background: rgba($roomtile-default-badge-bg-color, 1); - box-shadow: rgba($roomtile-default-badge-bg-color, 1); + background: rgba($room-icon-unread-color, 1); + box-shadow: rgba($room-icon-unread-color, 1); } &.mx_Indicator_bold { - background: rgba($input-darker-fg-color, 1); - box-shadow: rgba($input-darker-fg-color, 1); + background: rgba($primary-content, 1); + box-shadow: rgba($primary-content, 1); } &::after { @@ -197,7 +198,14 @@ $pulse-color: $alert; } } -.mx_RightPanel_headerButton_highlight { +.mx_RightPanel_headerButton_unread { + &::before { + background-color: $room-icon-unread-color !important; + } +} + +.mx_RightPanel_headerButton_highlight, +.mx_RightPanel_headerButton:hover { &::before { background-color: $accent !important; } diff --git a/res/css/views/rooms/_EventTile.scss b/res/css/views/rooms/_EventTile.scss index bb60c95c99..988b79b6ef 100644 --- a/res/css/views/rooms/_EventTile.scss +++ b/res/css/views/rooms/_EventTile.scss @@ -70,7 +70,7 @@ $left-gutter: 64px; } &[data-shape=ThreadsList][data-notification=total]::before { - background-color: $roomtile-default-badge-bg-color; + background-color: $room-icon-unread-color; } &[data-shape=ThreadsList][data-notification=highlight]::before { diff --git a/res/themes/dark/css/_dark.scss b/res/themes/dark/css/_dark.scss index 37e3be485c..7921a4e1a8 100644 --- a/res/themes/dark/css/_dark.scss +++ b/res/themes/dark/css/_dark.scss @@ -79,6 +79,11 @@ $settings-profile-button-bg-color: #e7e7e7; $settings-subsection-fg-color: $text-secondary-color; // ******************** +// Room +// ******************** +$room-icon-unread-color: #fff; +// ******************** + // RoomHeader // ******************** $roomheader-addroom-bg-color: rgba(92, 100, 112, 0.3); diff --git a/res/themes/legacy-dark/css/_legacy-dark.scss b/res/themes/legacy-dark/css/_legacy-dark.scss index 887139e867..03ba8c70ea 100644 --- a/res/themes/legacy-dark/css/_legacy-dark.scss +++ b/res/themes/legacy-dark/css/_legacy-dark.scss @@ -85,6 +85,7 @@ $roomheader-addroom-bg-color: #3c4556; $roomheader-addroom-fg-color: $text-primary-color; $icon-button-color: $header-panel-text-primary-color; $roomtopic-color: $text-secondary-color; +$room-icon-unread-color: #fff; // Legacy theme backports $accent: #0DBD8B; diff --git a/res/themes/legacy-light/css/_legacy-light.scss b/res/themes/legacy-light/css/_legacy-light.scss index 311e2ab4db..b039cfa70f 100644 --- a/res/themes/legacy-light/css/_legacy-light.scss +++ b/res/themes/legacy-light/css/_legacy-light.scss @@ -127,6 +127,7 @@ $roomheader-addroom-bg-color: #91a1c0; $roomheader-addroom-fg-color: $accent-fg-color; $icon-button-color: #91a1c0; $roomtopic-color: #9e9e9e; +$room-icon-unread-color: #737D8C; // ******************** diff --git a/res/themes/light/css/_light.scss b/res/themes/light/css/_light.scss index 6ba458301b..36efeda5c4 100644 --- a/res/themes/light/css/_light.scss +++ b/res/themes/light/css/_light.scss @@ -118,6 +118,11 @@ $settings-profile-button-bg-color: $menu-border-color; $settings-subsection-fg-color: $muted-fg-color; // ******************** +// Room +// ******************** +$room-icon-unread-color: $secondary-content; +// ******************** + // RoomHeader // ******************** $roomheader-addroom-bg-color: rgba(92, 100, 112, 0.2); diff --git a/src/components/views/right_panel/HeaderButton.tsx b/src/components/views/right_panel/HeaderButton.tsx index 7f6c22fbd3..8341b03d2d 100644 --- a/src/components/views/right_panel/HeaderButton.tsx +++ b/src/components/views/right_panel/HeaderButton.tsx @@ -29,6 +29,7 @@ import { ButtonEvent } from "../elements/AccessibleButton"; interface IProps { // Whether this button is highlighted isHighlighted: boolean; + isUnread?: boolean; // click handler onClick: (ev: ButtonEvent) => void; // The parameters to track the click event @@ -50,11 +51,12 @@ export default class HeaderButton extends React.Component { public render() { // eslint-disable-next-line @typescript-eslint/no-unused-vars - const { isHighlighted, onClick, analytics, name, title, ...props } = this.props; + const { isHighlighted, isUnread = false, onClick, analytics, name, title, ...props } = this.props; const classes = classNames({ mx_RightPanel_headerButton: true, mx_RightPanel_headerButton_highlight: isHighlighted, + mx_RightPanel_headerButton_unread: isUnread, [`mx_RightPanel_${name}`]: true, }); diff --git a/src/components/views/right_panel/RoomHeaderButtons.tsx b/src/components/views/right_panel/RoomHeaderButtons.tsx index aa2a8ffd63..1ac90c91e6 100644 --- a/src/components/views/right_panel/RoomHeaderButtons.tsx +++ b/src/components/views/right_panel/RoomHeaderButtons.tsx @@ -93,6 +93,7 @@ const PinnedMessagesHeaderButton = ({ room, isHighlighted, onClick }: IHeaderBut name="pinnedMessagesButton" title={_t("Pinned messages")} isHighlighted={isHighlighted} + isUnread={!!unreadIndicator} onClick={onClick} analytics={["Right Panel", "Pinned Messages Button", "click"]} > @@ -243,6 +244,7 @@ export default class RoomHeaderButtons extends HeaderButtons { title={_t("Threads")} onClick={this.onThreadsPanelClicked} isHighlighted={this.isPhase(RoomHeaderButtons.THREAD_PHASES)} + isUnread={this.threadNotificationState.color > 0} analytics={['Right Panel', 'Threads List Button', 'click']}> From ba71fb169f952e1bf0077fc13aa314c3a9ec2486 Mon Sep 17 00:00:00 2001 From: Robin Date: Mon, 4 Apr 2022 10:25:33 -0400 Subject: [PATCH 11/16] Scale emoji with size of surrounding text (#8224) * Scale emoji with size of surrounding text * Fix lint --- res/css/views/elements/_RichText.scss | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/res/css/views/elements/_RichText.scss b/res/css/views/elements/_RichText.scss index 221fc54a05..4615f5da23 100644 --- a/res/css/views/elements/_RichText.scss +++ b/res/css/views/elements/_RichText.scss @@ -76,7 +76,9 @@ a.mx_Pill { } .mx_Emoji { - font-size: 1.8rem; + // Should be 1.8rem for our default 1.4rem message bodies, + // and scale with the size of the surrounding text + font-size: calc(18 / 14 * 1em); vertical-align: bottom; } From 371ccd78580f6ecff3d74b526a602c84af2f4f0c Mon Sep 17 00:00:00 2001 From: Robin Date: Mon, 4 Apr 2022 10:29:40 -0400 Subject: [PATCH 12/16] Don't use m.call for Jitsi video rooms (#8223) --- src/components/structures/RoomView.tsx | 2 +- src/components/structures/SpaceRoomView.tsx | 2 +- src/components/views/context_menus/RoomContextMenu.tsx | 2 +- src/components/views/dialogs/CreateRoomDialog.tsx | 2 +- src/components/views/right_panel/RoomSummaryCard.tsx | 2 +- src/components/views/rooms/RoomList.tsx | 4 ++-- src/components/views/rooms/RoomListHeader.tsx | 4 ++-- src/components/views/rooms/RoomTile.tsx | 2 +- src/createRoom.ts | 4 ++-- test/components/views/rooms/RoomTile-test.tsx | 2 +- test/test-utils/test-utils.ts | 2 +- 11 files changed, 14 insertions(+), 14 deletions(-) diff --git a/src/components/structures/RoomView.tsx b/src/components/structures/RoomView.tsx index ab06369406..ca529b8adf 100644 --- a/src/components/structures/RoomView.tsx +++ b/src/components/structures/RoomView.tsx @@ -375,7 +375,7 @@ export class RoomView extends React.Component { }; private getMainSplitContentType = (room: Room) => { - if (SettingsStore.getValue("feature_video_rooms") && room.isCallRoom()) { + if (SettingsStore.getValue("feature_video_rooms") && room.isElementVideoRoom()) { return MainSplitContentType.Video; } if (WidgetLayoutStore.instance.hasMaximisedWidget(room)) { diff --git a/src/components/structures/SpaceRoomView.tsx b/src/components/structures/SpaceRoomView.tsx index f6f8ae3f47..aaf3e4e135 100644 --- a/src/components/structures/SpaceRoomView.tsx +++ b/src/components/structures/SpaceRoomView.tsx @@ -347,7 +347,7 @@ const SpaceLandingAddButton = ({ space }) => { e.stopPropagation(); closeMenu(); - if (await showCreateNewRoom(space, RoomType.UnstableCall)) { + if (await showCreateNewRoom(space, RoomType.ElementVideo)) { defaultDispatcher.fire(Action.UpdateSpaceHierarchy); } }} diff --git a/src/components/views/context_menus/RoomContextMenu.tsx b/src/components/views/context_menus/RoomContextMenu.tsx index 35ecf97a9c..8a0f5a04c1 100644 --- a/src/components/views/context_menus/RoomContextMenu.tsx +++ b/src/components/views/context_menus/RoomContextMenu.tsx @@ -105,7 +105,7 @@ const RoomContextMenu = ({ room, onFinished, ...props }: IProps) => { } const isDm = DMRoomMap.shared().getUserIdForRoomId(room.roomId); - const isVideoRoom = useFeatureEnabled("feature_video_rooms") && room.isCallRoom(); + const isVideoRoom = useFeatureEnabled("feature_video_rooms") && room.isElementVideoRoom(); let inviteOption: JSX.Element; if (room.canInvite(cli.getUserId()) && !isDm) { diff --git a/src/components/views/dialogs/CreateRoomDialog.tsx b/src/components/views/dialogs/CreateRoomDialog.tsx index feec344313..ffb28719a7 100644 --- a/src/components/views/dialogs/CreateRoomDialog.tsx +++ b/src/components/views/dialogs/CreateRoomDialog.tsx @@ -221,7 +221,7 @@ export default class CreateRoomDialog extends React.Component { }); render() { - const isVideoRoom = this.props.type === RoomType.UnstableCall; + const isVideoRoom = this.props.type === RoomType.ElementVideo; let aliasField; if (this.state.joinRule === JoinRule.Public) { diff --git a/src/components/views/right_panel/RoomSummaryCard.tsx b/src/components/views/right_panel/RoomSummaryCard.tsx index 65654f37ea..018d2c6927 100644 --- a/src/components/views/right_panel/RoomSummaryCard.tsx +++ b/src/components/views/right_panel/RoomSummaryCard.tsx @@ -269,7 +269,7 @@ const RoomSummaryCard: React.FC = ({ room, onClose }) => { const isRoomEncrypted = useIsEncrypted(cli, room); const roomContext = useContext(RoomContext); const e2eStatus = roomContext.e2eStatus; - const isVideoRoom = useFeatureEnabled("feature_video_rooms") && room.isCallRoom(); + const isVideoRoom = useFeatureEnabled("feature_video_rooms") && room.isElementVideoRoom(); const alias = room.getCanonicalAlias() || room.getAltAliases()[0] || ""; const header = diff --git a/src/components/views/rooms/RoomList.tsx b/src/components/views/rooms/RoomList.tsx index b7e1f87dc5..69b5179af5 100644 --- a/src/components/views/rooms/RoomList.tsx +++ b/src/components/views/rooms/RoomList.tsx @@ -243,7 +243,7 @@ const UntaggedAuxButton = ({ tabIndex }: IAuxButtonProps) => { e.preventDefault(); e.stopPropagation(); closeMenu(); - showCreateNewRoom(activeSpace, RoomType.UnstableCall); + showCreateNewRoom(activeSpace, RoomType.ElementVideo); }} disabled={!canAddRooms} tooltip={canAddRooms ? undefined @@ -289,7 +289,7 @@ const UntaggedAuxButton = ({ tabIndex }: IAuxButtonProps) => { closeMenu(); defaultDispatcher.dispatch({ action: "view_create_room", - type: RoomType.UnstableCall, + type: RoomType.ElementVideo, }); }} /> } diff --git a/src/components/views/rooms/RoomListHeader.tsx b/src/components/views/rooms/RoomListHeader.tsx index cc85c4e6da..6b97e8a660 100644 --- a/src/components/views/rooms/RoomListHeader.tsx +++ b/src/components/views/rooms/RoomListHeader.tsx @@ -217,7 +217,7 @@ const RoomListHeader = ({ onVisibilityChange }: IProps) => { onClick={(e) => { e.preventDefault(); e.stopPropagation(); - showCreateNewRoom(activeSpace, RoomType.UnstableCall); + showCreateNewRoom(activeSpace, RoomType.ElementVideo); closePlusMenu(); }} /> } @@ -310,7 +310,7 @@ const RoomListHeader = ({ onVisibilityChange }: IProps) => { e.stopPropagation(); defaultDispatcher.dispatch({ action: "view_create_room", - type: RoomType.UnstableCall, + type: RoomType.ElementVideo, }); closePlusMenu(); }} diff --git a/src/components/views/rooms/RoomTile.tsx b/src/components/views/rooms/RoomTile.tsx index a2557506e2..30585b35ca 100644 --- a/src/components/views/rooms/RoomTile.tsx +++ b/src/components/views/rooms/RoomTile.tsx @@ -123,7 +123,7 @@ export default class RoomTile extends React.PureComponent { this.notificationState = RoomNotificationStateStore.instance.getRoomState(this.props.room); this.roomProps = EchoChamber.forRoom(this.props.room); - this.isVideoRoom = SettingsStore.getValue("feature_video_rooms") && this.props.room.isCallRoom(); + this.isVideoRoom = SettingsStore.getValue("feature_video_rooms") && this.props.room.isElementVideoRoom(); } private onRoomNameUpdate = (room: Room) => { diff --git a/src/createRoom.ts b/src/createRoom.ts index adfca7dd3a..f2b09bc0b3 100644 --- a/src/createRoom.ts +++ b/src/createRoom.ts @@ -129,7 +129,7 @@ export default async function createRoom(opts: IOpts): Promise { }; // In video rooms, allow all users to send video member updates - if (opts.roomType === RoomType.UnstableCall) { + if (opts.roomType === RoomType.ElementVideo) { createOpts.power_level_content_override = { events: { [VIDEO_CHANNEL_MEMBER]: 0, @@ -263,7 +263,7 @@ export default async function createRoom(opts: IOpts): Promise { } }).then(() => { // Set up video rooms with a Jitsi widget - if (opts.roomType === RoomType.UnstableCall) { + if (opts.roomType === RoomType.ElementVideo) { return addVideoChannel(roomId, createOpts.name); } }).then(function() { diff --git a/test/components/views/rooms/RoomTile-test.tsx b/test/components/views/rooms/RoomTile-test.tsx index b0a98c8b3c..92135c3b09 100644 --- a/test/components/views/rooms/RoomTile-test.tsx +++ b/test/components/views/rooms/RoomTile-test.tsx @@ -73,7 +73,7 @@ describe("RoomTile", () => { describe("video rooms", () => { const room = mkRoom(cli, "!1:example.org"); - room.isCallRoom.mockReturnValue(true); + room.isElementVideoRoom.mockReturnValue(true); it("tracks connection state", () => { const tile = mount( diff --git a/test/test-utils/test-utils.ts b/test/test-utils/test-utils.ts index 45edc7fa15..ca2737d3e2 100644 --- a/test/test-utils/test-utils.ts +++ b/test/test-utils/test-utils.ts @@ -367,7 +367,7 @@ export function mkStubRoom(roomId: string = null, name: string, client: MatrixCl getAvatarUrl: () => 'mxc://avatar.url/room.png', getMxcAvatarUrl: () => 'mxc://avatar.url/room.png', isSpaceRoom: jest.fn().mockReturnValue(false), - isCallRoom: jest.fn().mockReturnValue(false), + isElementVideoRoom: jest.fn().mockReturnValue(false), getUnreadNotificationCount: jest.fn(() => 0), getEventReadUpTo: jest.fn(() => null), getCanonicalAlias: jest.fn(), From c0c447ab9bb7cfb9319e56cbbc1cb87048ca3322 Mon Sep 17 00:00:00 2001 From: David Baker Date: Tue, 5 Apr 2022 11:10:23 +0100 Subject: [PATCH 13/16] Fix URL previews being enabled when room first created (#8227) We didn't update whether URL previews should be enabled when encryption was enabled in a room, so when you create a room (or enable encryption) it starts off with URL previews using the setting for non-e2e rooms untilyou switch rooms / refresh. --- src/components/structures/RoomView.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/structures/RoomView.tsx b/src/components/structures/RoomView.tsx index ca529b8adf..2cf8b42265 100644 --- a/src/components/structures/RoomView.tsx +++ b/src/components/structures/RoomView.tsx @@ -944,6 +944,7 @@ export class RoomView extends React.Component { if (ev.getType() === "m.room.encryption") { this.updateE2EStatus(room); + this.updatePreviewUrlVisibility(room); } // ignore anything but real-time updates at the end of the room: From 4f6b9394260bbc4a54c0282598ee527524727e87 Mon Sep 17 00:00:00 2001 From: Robin Date: Tue, 5 Apr 2022 06:30:57 -0400 Subject: [PATCH 14/16] More video rooms design updates (#8222) * Update video room icon * Hide room header border in video rooms * Fix inconsistent padding on AppTile frames --- res/css/structures/_RoomView.scss | 20 ++++++++++++------- res/css/views/rooms/_AppsDrawer.scss | 2 -- res/css/views/rooms/_RoomList.scss | 2 +- res/css/views/rooms/_RoomListHeader.scss | 2 +- res/img/element-icons/roomlist/hash-video.svg | 5 +++++ src/components/structures/RoomView.tsx | 1 + 6 files changed, 21 insertions(+), 11 deletions(-) create mode 100644 res/img/element-icons/roomlist/hash-video.svg diff --git a/res/css/structures/_RoomView.scss b/res/css/structures/_RoomView.scss index 3547225ce7..a008a83aa6 100644 --- a/res/css/structures/_RoomView.scss +++ b/res/css/structures/_RoomView.scss @@ -213,14 +213,20 @@ hr.mx_RoomView_myReadMarker { } // Immersive widgets -.mx_RoomView_body > .mx_AppTile { - margin: $container-gap-width; - margin-right: calc($container-gap-width / 2); - width: auto; - height: 100%; - padding-top: 33px; // to match the right panel chat heading +.mx_RoomView_immersive { + .mx_RoomHeader_wrapper { + border: unset; + } - border-radius: 8px; + .mx_AppTile { + margin: $container-gap-width; + margin-right: calc($container-gap-width / 2); + width: auto; + height: 100%; + padding-top: 33px; // to match the right panel chat heading + + border-radius: 8px; + } } .mx_RoomView_callStatusBar .mx_UploadBar_uploadProgressInner { diff --git a/res/css/views/rooms/_AppsDrawer.scss b/res/css/views/rooms/_AppsDrawer.scss index 1b008d76aa..47aa9a9d2a 100644 --- a/res/css/views/rooms/_AppsDrawer.scss +++ b/res/css/views/rooms/_AppsDrawer.scss @@ -148,8 +148,6 @@ $MinWidth: 240px; width: 50%; min-width: $MinWidth; border: $container-border-width solid $widget-menu-bar-bg-color; - border-left-width: 5px; - border-right-width: 5px; display: flex; flex-direction: column; box-sizing: border-box; diff --git a/res/css/views/rooms/_RoomList.scss b/res/css/views/rooms/_RoomList.scss index 2763ad653f..bbac00e0e6 100644 --- a/res/css/views/rooms/_RoomList.scss +++ b/res/css/views/rooms/_RoomList.scss @@ -25,7 +25,7 @@ limitations under the License. mask-image: url('$(res)/img/element-icons/roomlist/hash-plus.svg'); } .mx_RoomList_iconNewVideoRoom::before { - mask-image: url('$(res)/img/element-icons/call/video-call.svg'); + mask-image: url('$(res)/img/element-icons/roomlist/hash-video.svg'); } .mx_RoomList_iconAddExistingRoom::before { mask-image: url('$(res)/img/element-icons/roomlist/hash.svg'); diff --git a/res/css/views/rooms/_RoomListHeader.scss b/res/css/views/rooms/_RoomListHeader.scss index c4bc8c151f..7f5d06d549 100644 --- a/res/css/views/rooms/_RoomListHeader.scss +++ b/res/css/views/rooms/_RoomListHeader.scss @@ -107,7 +107,7 @@ limitations under the License. mask-image: url('$(res)/img/element-icons/roomlist/hash-plus.svg'); } .mx_RoomListHeader_iconNewVideoRoom::before { - mask-image: url('$(res)/img/element-icons/call/video-call.svg'); + mask-image: url('$(res)/img/element-icons/roomlist/hash-video.svg'); } .mx_RoomListHeader_iconExplore::before { mask-image: url('$(res)/img/element-icons/roomlist/hash-search.svg'); diff --git a/res/img/element-icons/roomlist/hash-video.svg b/res/img/element-icons/roomlist/hash-video.svg new file mode 100644 index 0000000000..b0e1decf68 --- /dev/null +++ b/res/img/element-icons/roomlist/hash-video.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/src/components/structures/RoomView.tsx b/src/components/structures/RoomView.tsx index 2cf8b42265..29f6445574 100644 --- a/src/components/structures/RoomView.tsx +++ b/src/components/structures/RoomView.tsx @@ -2100,6 +2100,7 @@ export class RoomView extends React.Component { const mainClasses = classNames("mx_RoomView", { mx_RoomView_inCall: Boolean(activeCall), + mx_RoomView_immersive: this.state.mainSplitContentType === MainSplitContentType.Video, }); const showChatEffects = SettingsStore.getValue('showChatEffects'); From 27e48062b6d6f4e42900963b5344ca69e16ace70 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Tue, 5 Apr 2022 17:01:34 +0100 Subject: [PATCH 15/16] Apply tweaks to Thread list as per design spec (#8149) Co-authored-by: Germain Souquet --- res/css/views/right_panel/_ThreadPanel.scss | 40 ++++++-- res/css/views/rooms/_EventTile.scss | 91 ++++++++++++++----- src/components/structures/ThreadPanel.tsx | 46 +++++++--- .../context_menus/MessageContextMenu.tsx | 8 +- src/components/views/messages/TextualBody.tsx | 15 +-- src/components/views/rooms/EventTile.tsx | 41 ++++++--- src/i18n/strings/en_EN.json | 4 +- 7 files changed, 173 insertions(+), 72 deletions(-) diff --git a/res/css/views/right_panel/_ThreadPanel.scss b/res/css/views/right_panel/_ThreadPanel.scss index cb438c4706..280404a649 100644 --- a/res/css/views/right_panel/_ThreadPanel.scss +++ b/res/css/views/right_panel/_ThreadPanel.scss @@ -20,14 +20,17 @@ limitations under the License. .mx_BaseCard_header { margin-bottom: 12px; + .mx_BaseCard_close, .mx_BaseCard_back { width: 24px; height: 24px; } + .mx_BaseCard_back { left: -4px; } + .mx_BaseCard_close { right: -4px; } @@ -66,6 +69,7 @@ limitations under the License. --size: 24px; width: var(--size); height: var(--size); + &::after { mask-size: var(--size); mask-image: url("$(res)/img/element-icons/message/overflow-large.svg"); @@ -99,11 +103,10 @@ limitations under the License. } .mx_AutoHideScrollbar { - background: #fff; background-color: $background; border-radius: 8px; - width: calc(100% - 16px); - padding-right: 16px; + width: calc(100% - 24px); + padding-right: 18px; } &.mx_ThreadView .mx_ThreadView_timelinePanelWrapper { @@ -125,13 +128,15 @@ limitations under the License. padding-right: 0; } - .mx_EventTile, .mx_GenericEventListSummary { + .mx_EventTile, + .mx_GenericEventListSummary { // Account for scrollbar when hovering padding-top: 0; .mx_ThreadInfo { position: relative; padding-right: 11px; + &::after { content: ''; display: block; @@ -157,6 +162,10 @@ limitations under the License. .mx_EventTile_e2eIcon { left: 8px; } + + &:hover .mx_EventTile_line { + box-shadow: unset !important; // don't show the verification left stroke in the thread list + } } .mx_MessageComposer { @@ -190,10 +199,6 @@ limitations under the License. float: right; } - .mx_ThreadPanel_dropdown[aria-expanded=true]::before { - transform: rotate(180deg); - } - .mx_MessageTimestamp { font-size: $font-12px; color: $secondary-content; @@ -272,19 +277,23 @@ limitations under the License. h2 { color: $primary-content; - font-weight: 600; + font-weight: $font-semi-bold; font-size: $font-18px; + margin-top: 24px; + margin-bottom: 10px; } p { font-size: $font-15px; color: $secondary-content; + margin: 10px 0; } button { border: none; background: none; color: $accent; + font-size: $font-15px; &:hover, &:active { @@ -292,6 +301,15 @@ limitations under the License. cursor: pointer; } } + + .mx_ThreadPanel_empty_tip { + font-size: $font-12px; + line-height: $font-15px; + + >b { + font-weight: $font-semi-bold; + } + } } .mx_ThreadPanel_largeIcon { @@ -317,6 +335,7 @@ limitations under the License. .mx_ContextualMenu_wrapper.mx_ThreadPanel__header { .mx_ContextualMenu { position: initial; + span:first-of-type { font-weight: $font-semi-bold; font-size: inherit; @@ -336,6 +355,7 @@ limitations under the License. left: auto; right: 22px; border-bottom-color: $quinary-content; + &::after { content: ""; border: inherit; @@ -357,10 +377,12 @@ limitations under the License. &:hover { background-color: $event-selected-color; } + &[aria-checked="true"] { :first-child { margin-left: -20px; } + :first-child::before { content: ""; width: 12px; diff --git a/res/css/views/rooms/_EventTile.scss b/res/css/views/rooms/_EventTile.scss index 988b79b6ef..ccd6b88d02 100644 --- a/res/css/views/rooms/_EventTile.scss +++ b/res/css/views/rooms/_EventTile.scss @@ -43,9 +43,11 @@ $left-gutter: 64px; right: 0; } } + .mx_EventTile_receiptSent::before { mask-image: url('$(res)/img/element-icons/circle-sent.svg'); } + .mx_EventTile_receiptSending::before { mask-image: url('$(res)/img/element-icons/circle-sending.svg'); } @@ -61,11 +63,11 @@ $left-gutter: 64px; &[data-shape=ThreadsList][data-notification]::before { content: ""; position: absolute; - width: 8px; - height: 8px; + width: 10px; + height: 10px; border-radius: 50%; - right: -16px; - top: 6px; + right: -25px; // center it in the gutter (16px margin + 4px padding + half 10px width) + top: 4px; left: auto; } @@ -79,7 +81,6 @@ $left-gutter: 64px; .mx_ThreadInfo, .mx_ThreadSummaryIcon { - margin-right: 110px; margin-left: 64px; } @@ -115,7 +116,8 @@ $left-gutter: 64px; .mx_DisambiguatedProfile { color: $primary-content; font-size: $font-14px; - display: inline-block; /* anti-zalgo, with overflow hidden */ + display: inline-block; + /* anti-zalgo, with overflow hidden */ overflow: hidden; padding-bottom: 0px; padding-top: 0px; @@ -142,7 +144,8 @@ $left-gutter: 64px; clear: both; } - .mx_EventTile_line, .mx_EventTile_reply { + .mx_EventTile_line, + .mx_EventTile_reply { position: relative; padding-left: $left-gutter; border-radius: 8px; @@ -308,11 +311,19 @@ $left-gutter: 64px; .mx_RoomView_timeline_rr_enabled { .mx_EventTile[data-layout=group] { + + .mx_ThreadInfo, + .mx_ThreadSummaryIcon, .mx_EventTile_line { /* ideally should be 100px, but 95px gives us a max thumbnail size of 800x600, which is nice */ margin-right: 110px; } + + .mx_ThreadInfo { + max-width: min(calc(100% - $left-gutter - 110px), 600px); // leave space on both left & right gutters + } } + // on ELS we need the margin to allow interaction with the expand/collapse button which is normally in the RR gutter } @@ -408,7 +419,8 @@ $left-gutter: 64px; background-repeat: no-repeat; background-size: contain; - &::before, &::after { + &::before, + &::after { content: ""; display: block; position: absolute; @@ -433,6 +445,7 @@ $left-gutter: 64px; mask-image: url('$(res)/img/e2e/warning.svg'); background-color: $alert; } + opacity: 1; } @@ -441,6 +454,7 @@ $left-gutter: 64px; mask-image: url('$(res)/img/e2e/normal.svg'); background-color: $header-panel-text-primary-color; } + opacity: 1; } @@ -479,7 +493,8 @@ $left-gutter: 64px; color: inherit; // inherit the colour from the dark or light theme by default (but not for code blocks) font-size: $font-14px; - pre, code { + pre, + code { font-family: $monospace-font-family !important; background-color: $codeblock-background-color; } @@ -492,7 +507,7 @@ $left-gutter: 64px; pre code { white-space: pre; // we want code blocks to be scrollable and not wrap - > * { + >* { display: inline; } } @@ -514,6 +529,7 @@ $left-gutter: 64px; float: left; margin: 0 0.5em 0 -1.5em; color: gray; + & span { text-align: right; display: block; @@ -547,18 +563,22 @@ $left-gutter: 64px; height: 19px; background-color: $message-action-bar-fg-color; } + .mx_EventTile_buttonBottom { top: 33px; } + .mx_EventTile_copyButton { mask-image: url($copy-button-url); } + .mx_EventTile_collapseButton { mask-size: 75%; mask-position: center; mask-repeat: no-repeat; mask-image: url("$(res)/img/element-icons/minimise-collapse.svg"); } + .mx_EventTile_expandButton { mask-size: 75%; mask-position: center; @@ -674,10 +694,13 @@ $left-gutter: 64px; } @media only screen and (max-width: 480px) { - .mx_EventTile_line, .mx_EventTile_reply { + + .mx_EventTile_line, + .mx_EventTile_reply { padding-left: 0; margin-right: 0; } + .mx_EventTile_content { margin-top: 10px; margin-right: 0; @@ -692,23 +715,28 @@ $left-gutter: 64px; mask-position: center; height: 18px; min-width: 18px; - background-color: $secondary-content; + background-color: $secondary-content !important; mask-repeat: no-repeat; mask-size: contain; } .mx_ThreadSummaryIcon { + display: inline-block; font-size: $font-12px; - color: $secondary-content; + color: $secondary-content !important; + margin-top: 8px; + margin-bottom: 8px; + &::before { vertical-align: middle; - margin-left: 8px; + margin-right: 8px; + margin-top: -2px; } } .mx_ThreadInfo { min-width: 267px; - max-width: min(calc(100% - $left-gutter - 64px), 600px); // leave space on both left & right gutters + max-width: min(calc(100% - $left-gutter), 600px); // leave space on both left & right gutters width: fit-content; height: 40px; position: relative; @@ -756,7 +784,8 @@ $left-gutter: 64px; } } - &:hover, &:focus { + &:hover, + &:focus { cursor: pointer; border-color: $quinary-content; @@ -782,6 +811,9 @@ $threadInfoLineHeight: calc(2 * $font-12px); .mx_ThreadInfo_sender { font-weight: $font-semi-bold; line-height: $threadInfoLineHeight; + text-overflow: ellipsis; + overflow: hidden; + white-space: nowrap; } .mx_ThreadInfo_content { @@ -792,6 +824,7 @@ $threadInfoLineHeight: calc(2 * $font-12px); font-size: $font-12px; line-height: $threadInfoLineHeight; color: $secondary-content; + flex: 1; } .mx_ThreadInfo_avatar { @@ -810,9 +843,10 @@ $threadInfoLineHeight: calc(2 * $font-12px); .mx_EventTile[data-shape=ThreadsList] { --topOffset: 20px; --leftOffset: 46px; + $borderRadius: 8px; margin: var(--topOffset) 16px var(--topOffset) 0; - border-radius: 8px; + border-radius: $borderRadius; display: flex; flex-flow: wrap; @@ -847,6 +881,7 @@ $threadInfoLineHeight: calc(2 * $font-12px); &::after { content: unset; } + margin-bottom: 0; } @@ -857,7 +892,7 @@ $threadInfoLineHeight: calc(2 * $font-12px); padding-top: 0; .mx_EventTile_avatar { - top: -4px; + top: 0; left: 0; } @@ -892,7 +927,7 @@ $threadInfoLineHeight: calc(2 * $font-12px); width: 100%; box-sizing: border-box; padding-left: var(--leftOffset) !important; - padding-bottom: 0; + border-radius: $borderRadius !important; // override 4px } .mx_MessageTimestamp { @@ -918,7 +953,7 @@ $threadInfoLineHeight: calc(2 * $font-12px); .mx_EventTile { display: flex; flex-direction: column; - padding-top: 0; + padding-top: 14px; // due to layout differences, this odd number matches the 18px padding-top of main tl events .mx_EventTile_line { padding-left: 0; @@ -973,7 +1008,7 @@ $threadInfoLineHeight: calc(2 * $font-12px); .mx_UnknownBody, .mx_MPollBody, .mx_ReplyChain_wrapper { - margin-left: 36px; + margin-left: 48px; margin-right: 8px; .mx_EventTile_content, @@ -997,16 +1032,17 @@ $threadInfoLineHeight: calc(2 * $font-12px); .mx_EventTile_senderDetails { display: flex; align-items: center; - gap: calc(6px + $selected-message-border-width); + gap: calc(14px + $selected-message-border-width); a { flex: 1; - min-width: none; + min-width: unset; max-width: 100%; display: flex; align-items: center; .mx_DisambiguatedProfile { + margin-left: 8px; flex: 1; } } @@ -1026,4 +1062,13 @@ $threadInfoLineHeight: calc(2 * $font-12px); .mx_MessageComposer_sendMessage { margin-right: 0; } + + .mx_EditMessageComposer { + margin-left: 30px !important; // align start of first letter with that of the event body + } + + .mx_EditMessageComposer_buttons { + padding-right: 11px; // align with right edge of input + margin-right: 0; // align with right edge of background + } } diff --git a/src/components/structures/ThreadPanel.tsx b/src/components/structures/ThreadPanel.tsx index 3364fdc27c..b9f227780e 100644 --- a/src/components/structures/ThreadPanel.tsx +++ b/src/components/structures/ThreadPanel.tsx @@ -101,7 +101,7 @@ export const ThreadPanelHeader = ({ filterOption, setFilterOption, empty }: { isSelected={opt === value} />); const contextMenu = menuDisplayed ? void; } -const EmptyThread: React.FC = ({ filterOption, showAllThreadsCallback }) => { +const EmptyThread: React.FC = ({ hasThreads, filterOption, showAllThreadsCallback }) => { + let body: JSX.Element; + if (hasThreads) { + body = <> +

+ { _t("Reply to an ongoing thread or use “%(replyInThread)s” " + + "when hovering over a message to start a new one.", { + replyInThread: _t("Reply in thread"), + }) } +

+

+ { /* Always display that paragraph to prevent layout shift when hiding the button */ } + { (filterOption === ThreadFilterType.My) + ? + : <>  + } +

+ ; + } else { + body = <> +

{ _t("Threads help keep your conversations on-topic and easy to track.") }

+

+ { _t('Tip: Use "Reply in thread" when hovering over a message.', {}, { + b: sub => { sub }, + }) } +

+ ; + } + return ; }; @@ -247,6 +266,7 @@ const ThreadPanel: React.FC = ({ timelineSet={timelineSet} showUrlPreview={false} // No URL previews at the threads list level empty={ 0} filterOption={filterOption} showAllThreadsCallback={() => setFilterOption(ThreadFilterType.All)} />} diff --git a/src/components/views/context_menus/MessageContextMenu.tsx b/src/components/views/context_menus/MessageContextMenu.tsx index 8899c13a60..e0b1b7c9a8 100644 --- a/src/components/views/context_menus/MessageContextMenu.tsx +++ b/src/components/views/context_menus/MessageContextMenu.tsx @@ -44,7 +44,6 @@ import { RoomPermalinkCreator } from "../../../utils/permalinks/Permalinks"; import { ChevronFace, IPosition } from '../../structures/ContextMenu'; import RoomContext, { TimelineRenderingType } from '../../../contexts/RoomContext'; import { ComposerInsertPayload } from "../../../dispatcher/payloads/ComposerInsertPayload"; -import { WidgetLayoutStore } from '../../../stores/widgets/WidgetLayoutStore'; import EndPollDialog from '../dialogs/EndPollDialog'; import { isPollEnded } from '../messages/MPollBody'; import { ViewRoomPayload } from "../../../dispatcher/payloads/ViewRoomPayload"; @@ -472,14 +471,11 @@ export default class MessageContextMenu extends React.Component timelineRenderingType === TimelineRenderingType.Thread || timelineRenderingType === TimelineRenderingType.ThreadsList ); - const isThreadRootEvent = isThread && this.props.mxEvent?.getThread()?.rootEvent === this.props.mxEvent; + const isThreadRootEvent = isThread && this.props.mxEvent.isThreadRoot; - const isMainSplitTimelineShown = !WidgetLayoutStore.instance.hasMaximisedWidget( - MatrixClientPeg.get().getRoom(mxEvent.getRoomId()), - ); const commonItemsList = ( - { (isThreadRootEvent && isMainSplitTimelineShown) && { if (this.props.highlightLink) { body = { body }; } else if (content.data && typeof content.data["org.matrix.neb.starter_link"] === "string") { - body = { body }; + body = ( + + { body } + + ); } let widgets; @@ -651,9 +656,7 @@ export default class TextualBody extends React.Component { ); } return ( -
+
{ body } { widgets }
diff --git a/src/components/views/rooms/EventTile.tsx b/src/components/views/rooms/EventTile.tsx index b73ec31e29..e811a37508 100644 --- a/src/components/views/rooms/EventTile.tsx +++ b/src/components/views/rooms/EventTile.tsx @@ -631,12 +631,22 @@ export class UnwrappedEventTile extends React.Component { } private renderThreadInfo(): React.ReactNode { + if (this.state.thread?.id === this.props.mxEvent.getId()) { + return ; + } + if (this.context.timelineRenderingType === TimelineRenderingType.Search && this.props.mxEvent.threadRootId) { + if (this.props.highlightLink) { + return ( + + { _t("From a thread") } + + ); + } + return (

{ _t("From a thread") }

); - } else if (this.state.thread?.id === this.props.mxEvent.getId()) { - return ; } } @@ -1100,6 +1110,7 @@ export class UnwrappedEventTile extends React.Component { let isContinuation = this.props.continuation; if (this.context.timelineRenderingType !== TimelineRenderingType.Room && this.context.timelineRenderingType !== TimelineRenderingType.Search && + this.context.timelineRenderingType !== TimelineRenderingType.Thread && this.props.layout !== Layout.Bubble ) { isContinuation = false; @@ -1146,16 +1157,17 @@ export class UnwrappedEventTile extends React.Component { ? undefined : this.props.mxEvent.getId(); - let avatar; - let sender; - let avatarSize; - let needsSenderProfile; + let avatar: JSX.Element; + let sender: JSX.Element; + let avatarSize: number; + let needsSenderProfile: boolean; - if (this.context.timelineRenderingType === TimelineRenderingType.Notification || - this.context.timelineRenderingType === TimelineRenderingType.ThreadsList - ) { + if (this.context.timelineRenderingType === TimelineRenderingType.Notification) { avatarSize = 24; needsSenderProfile = true; + } else if (this.context.timelineRenderingType === TimelineRenderingType.ThreadsList) { + avatarSize = 36; + needsSenderProfile = true; } else if (tileHandler === 'messages.RoomCreate' || isBubbleMessage) { avatarSize = 0; needsSenderProfile = false; @@ -1364,7 +1376,8 @@ export class UnwrappedEventTile extends React.Component {
,
- {
,
{ avatar } - - { sender } - + { sender }
,
{ replyChain } @@ -1417,7 +1428,9 @@ export class UnwrappedEventTile extends React.Component { isSeeingThroughMessageHiddenForModeration={isSeeingThroughMessageHiddenForModeration} /> { actionBar } - { timestamp } + + { timestamp } +
, reactionsRow, ]); diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index dea47408e9..795167ac67 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -3099,9 +3099,11 @@ "My threads": "My threads", "Shows all threads you've participated in": "Shows all threads you've participated in", "Show:": "Show:", - "Keep discussions organised with threads": "Keep discussions organised with threads", "Reply to an ongoing thread or use “%(replyInThread)s” when hovering over a message to start a new one.": "Reply to an ongoing thread or use “%(replyInThread)s” when hovering over a message to start a new one.", "Show all threads": "Show all threads", + "Threads help keep your conversations on-topic and easy to track.": "Threads help keep your conversations on-topic and easy to track.", + "Tip: Use \"Reply in thread\" when hovering over a message.": "Tip: Use \"Reply in thread\" when hovering over a message.", + "Keep discussions organised with threads": "Keep discussions organised with threads", "Thread": "Thread", "Tried to load a specific point in this room's timeline, but you do not have permission to view the message in question.": "Tried to load a specific point in this room's timeline, but you do not have permission to view the message in question.", "Tried to load a specific point in this room's timeline, but was unable to find it.": "Tried to load a specific point in this room's timeline, but was unable to find it.", From 694c39e72d62b56d48018fbefbb5d5015c08ae9a Mon Sep 17 00:00:00 2001 From: Germain Date: Tue, 5 Apr 2022 17:15:31 +0100 Subject: [PATCH 16/16] Enable threads by default and mark it as a beta feature (#8081) --- res/css/structures/_RightPanel.scss | 28 +------ res/css/structures/_RoomView.scss | 70 ++++++++++++++++-- res/css/views/elements/_Tooltip.scss | 18 ++++- res/css/views/messages/_MessageActionBar.scss | 7 +- res/css/views/right_panel/_ThreadPanel.scss | 24 +++++- res/css/views/rooms/_EventTile.scss | 1 + res/img/betas/threads.png | Bin 0 -> 86990 bytes res/themes/light/css/_light.scss | 28 +++++-- src/components/structures/ThreadPanel.tsx | 31 +++++++- src/components/views/beta/BetaCard.tsx | 18 ++++- .../views/dialogs/BetaFeedbackDialog.tsx | 2 +- .../views/messages/MessageActionBar.tsx | 53 ++++++++++--- .../views/right_panel/RoomHeaderButtons.tsx | 1 + src/components/views/rooms/EventTile.tsx | 2 +- src/i18n/strings/en_EN.json | 16 +++- src/settings/Settings.tsx | 26 ++++++- 16 files changed, 257 insertions(+), 68 deletions(-) create mode 100644 res/img/betas/threads.png diff --git a/res/css/structures/_RightPanel.scss b/res/css/structures/_RightPanel.scss index c53bc86400..a25e172c73 100644 --- a/res/css/structures/_RightPanel.scss +++ b/res/css/structures/_RightPanel.scss @@ -103,6 +103,7 @@ $pulse-color: $alert; mask-position: center; } } + .mx_RightPanel_headerButton_unreadIndicator_bg { position: absolute; right: $dot-offset; @@ -121,14 +122,6 @@ $pulse-color: $alert; right: $dot-offset; top: $dot-offset; margin: 4px; - width: $dot-size; - height: $dot-size; - border-radius: 50%; - transform: scale(1); - background: rgba($pulse-color, 1); - box-shadow: 0 0 0 0 rgba($pulse-color, 1); - animation: mx_RightPanel_indicator_pulse 2s infinite; - animation-iteration-count: 1; &.mx_Indicator_red { background: rgba($alert, 1); @@ -144,22 +137,6 @@ $pulse-color: $alert; background: rgba($primary-content, 1); box-shadow: rgba($primary-content, 1); } - - &::after { - content: ""; - position: absolute; - width: inherit; - height: inherit; - top: 0; - left: 0; - transform: scale(1); - transform-origin: center center; - animation-name: mx_RightPanel_indicator_pulse_shadow; - animation-duration: inherit; - animation-iteration-count: inherit; - border-radius: 50%; - background: inherit; - } } .mx_RightPanel_timelineCardButton { @@ -250,7 +227,8 @@ $pulse-color: $alert; margin: 16px 0; } - h2, p { + h2, + p { font-size: $font-14px; } diff --git a/res/css/structures/_RoomView.scss b/res/css/structures/_RoomView.scss index a008a83aa6..7990db8cf1 100644 --- a/res/css/structures/_RoomView.scss +++ b/res/css/structures/_RoomView.scss @@ -105,7 +105,9 @@ limitations under the License. flex: 1; min-width: 0; - .mx_RoomView_messagePanel, .mx_RoomView_messagePanelSpinner, .mx_RoomView_messagePanelSearchSpinner { + .mx_RoomView_messagePanel, + .mx_RoomView_messagePanelSpinner, + .mx_RoomView_messagePanelSearchSpinner { order: 2; } } @@ -147,20 +149,17 @@ limitations under the License. } .mx_RoomView_messageListWrapper { - min-height: 100%; - display: flex; - flex-direction: column; - justify-content: flex-end; + position: relative; } .mx_RoomView_searchResultsPanel { .mx_RoomView_messageListWrapper { justify-content: flex-start; - > .mx_RoomView_MessageList > li > ol { + >.mx_RoomView_MessageList > li > ol { list-style-type: none; } } @@ -295,3 +294,62 @@ hr.mx_RoomView_myReadMarker { min-height: 42px; } } + +@keyframes mx_Indicator_pulse { + 0% { + transform: scale(0.95); + } + + 70% { + transform: scale(1); + } + + 100% { + transform: scale(0.95); + } +} + +@keyframes mx_Indicator_pulse_shadow { + 0% { + opacity: 0.7; + } + + 70% { + transform: scale(2.2); + opacity: 0; + } + + 100% { + opacity: 0; + } +} + +.mx_Indicator { + position: absolute; + right: 0; + top: 0; + width: $dot-size; + height: $dot-size; + border-radius: 50%; + transform: scale(1); + background: rgba($pulse-color, 1); + box-shadow: 0 0 0 0 rgba($pulse-color, 1); + animation: mx_Indicator_pulse 2s infinite; + animation-iteration-count: 1; + + &::after { + content: ""; + position: absolute; + width: inherit; + height: inherit; + top: 0; + left: 0; + transform: scale(1); + transform-origin: center center; + animation-name: mx_Indicator_pulse_shadow; + animation-duration: inherit; + animation-iteration-count: inherit; + border-radius: 50%; + background: inherit; + } +} diff --git a/res/css/views/elements/_Tooltip.scss b/res/css/views/elements/_Tooltip.scss index f5621a61d5..c89c654178 100644 --- a/res/css/views/elements/_Tooltip.scss +++ b/res/css/views/elements/_Tooltip.scss @@ -16,13 +16,23 @@ limitations under the License. */ @keyframes mx_fadein { - from { opacity: 0; } - to { opacity: 1; } + from { + opacity: 0; + } + + to { + opacity: 1; + } } @keyframes mx_fadeout { - from { opacity: 1; } - to { opacity: 0; } + from { + opacity: 1; + } + + to { + opacity: 0; + } } .mx_Tooltip_chevron { diff --git a/res/css/views/messages/_MessageActionBar.scss b/res/css/views/messages/_MessageActionBar.scss index ab434d8286..75318757a7 100644 --- a/res/css/views/messages/_MessageActionBar.scss +++ b/res/css/views/messages/_MessageActionBar.scss @@ -48,7 +48,7 @@ limitations under the License. cursor: initial; } - > * { + >* { white-space: nowrap; display: inline-block; position: relative; @@ -102,6 +102,11 @@ limitations under the License. mask-image: url('$(res)/img/element-icons/message/thread.svg'); } +.mx_MessageActionBar_threadButton .mx_Indicator { + background: $links; + animation-iteration-count: infinite; +} + .mx_MessageActionBar_editButton::after { mask-image: url('$(res)/img/element-icons/room/message-bar/edit.svg'); } diff --git a/res/css/views/right_panel/_ThreadPanel.scss b/res/css/views/right_panel/_ThreadPanel.scss index 280404a649..37cabe5e08 100644 --- a/res/css/views/right_panel/_ThreadPanel.scss +++ b/res/css/views/right_panel/_ThreadPanel.scss @@ -17,6 +17,8 @@ limitations under the License. .mx_ThreadPanel { display: flex; flex-direction: column; + height: 100px; + overflow: visible; .mx_BaseCard_header { margin-bottom: 12px; @@ -225,6 +227,20 @@ limitations under the License. display: none; // hide the hidden event expand button, not enough space, view source can still be used } } + + .mx_BaseCard_footer { + text-align: left; + font-size: $font-12px; + align-items: center; + justify-content: end; + gap: 4px; + position: relative; + top: 2px; + + .mx_AccessibleButton_kind_link_inline { + color: $secondary-content; + } + } } .mx_ThreadPanel_replies { @@ -269,10 +285,10 @@ limitations under the License. align-items: center; justify-content: center; position: absolute; - top: 48px; - bottom: 8px; - left: 8px; - right: 8px; + top: 0; + bottom: 0; + left: 0; + right: 0; padding: 20px; h2 { diff --git a/res/css/views/rooms/_EventTile.scss b/res/css/views/rooms/_EventTile.scss index ccd6b88d02..4238dca938 100644 --- a/res/css/views/rooms/_EventTile.scss +++ b/res/css/views/rooms/_EventTile.scss @@ -940,6 +940,7 @@ $threadInfoLineHeight: calc(2 * $font-12px); .mx_ThreadView { display: flex; flex-direction: column; + max-height: 100%; .mx_ThreadView_List { flex: 1; diff --git a/res/img/betas/threads.png b/res/img/betas/threads.png new file mode 100644 index 0000000000000000000000000000000000000000..f34fb5f89584180a36418e00d09b5fc80e4db986 GIT binary patch literal 86990 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

EL!T(?03cQH8fad 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 = ({ } }, [timelineSet, timelinePanel]); + const openFeedback = SdkConfig.get().bug_report_endpoint_url ? () => { + Modal.createTrackedDialog("Threads Feedback", "feature_thread", BetaFeedbackDialog, { + featureId: "feature_thread", + }); + } : null; + return ( = ({ setFilterOption={setFilterOption} empty={threadCount === 0} />} + footer={<> + { + dis.dispatch({ + action: Action.ViewUserSettings, + initialTabId: UserTab.Labs, + }); + }} + /> + { openFeedback && _t("Give feedback", {}, { + a: sub => + { sub }, + }) } + } className="mx_ThreadPanel" onClose={onClose} withoutScrollContainer={true} diff --git a/src/components/views/beta/BetaCard.tsx b/src/components/views/beta/BetaCard.tsx index 1d625fc843..4639886b70 100644 --- a/src/components/views/beta/BetaCard.tsx +++ b/src/components/views/beta/BetaCard.tsx @@ -36,17 +36,27 @@ interface IProps { featureId: string; } -export const BetaPill = ({ onClick }: { onClick?: () => void }) => { +interface IBetaPillProps { + onClick?: () => void; + tooltipTitle?: string; + tooltipCaption?: string; +} + +export const BetaPill = ({ + onClick, + tooltipTitle = _t("This is a beta feature"), + tooltipCaption = _t("Click for more info"), +}: IBetaPillProps) => { if (onClick) { return

- { _t("This is a beta feature") } + { tooltipTitle }
- { _t("Click for more info") } + { tooltipCaption }
} onClick={onClick} diff --git a/src/components/views/dialogs/BetaFeedbackDialog.tsx b/src/components/views/dialogs/BetaFeedbackDialog.tsx index c5fba52b51..b0afec4e91 100644 --- a/src/components/views/dialogs/BetaFeedbackDialog.tsx +++ b/src/components/views/dialogs/BetaFeedbackDialog.tsx @@ -35,7 +35,7 @@ const BetaFeedbackDialog: React.FC = ({ featureId, onFinished }) => { const info = SettingsStore.getBetaInfo(featureId); return { - showThread({ rootEvent: this.props.mxEvent, push: isCard }); + if (localStorage.getItem("mx_seen_feature_thread") === null) { + localStorage.setItem("mx_seen_feature_thread", "true"); + } + + if (!SettingsStore.getValue("feature_thread")) { + dis.dispatch({ + action: Action.ViewUserSettings, + initialTabId: UserTab.Labs, + }); + } else { + showThread({ rootEvent: this.props.mxEvent, push: isCard }); + } }; private onEditClick = (): void => { @@ -235,14 +248,13 @@ export default class MessageActionBar extends React.PureComponent; - const hasARelation = !!this.props.mxEvent?.getRelation()?.rel_type; - + const relationType = this.props.mxEvent?.getRelation()?.rel_type; + const hasARelation = !!relationType && relationType !== RelationType.Thread; + const firstTimeSeeingThreads = localStorage.getItem("mx_seen_feature_thread") === null && + !SettingsStore.getValue("feature_thread"); const threadTooltipButton = { context => +
+ { !hasARelation + ? _t("Reply in thread") + : _t("Can't create a thread from an event with an existing relation") } +
+ { !hasARelation && ( +
+ { SettingsStore.getValue("feature_thread") + ? _t("Beta feature") + : _t("Beta feature. Click to learn more.") + } +
+ ) } + } + title={!hasARelation ? _t("Reply in thread") - : _t("Can't create a thread from an event with an existing relation") - } + : _t("Can't create a thread from an event with an existing relation")} onClick={this.onThreadClick.bind(null, context.isCard)} - /> + > + { firstTimeSeeingThreads && ( +
+ ) } + } ; @@ -387,14 +420,14 @@ export default class MessageActionBar extends React.PureComponent + const tooltip = <>
{ this.props.isQuoteExpanded ? _t("Collapse quotes") : _t("Expand quotes") }
{ _t(ALTERNATE_KEY_NAME[Key.SHIFT]) + " + " + _t("Click") }
-
; + ; toolbarOpts.push( { } const classes = classNames({ + "mx_Indicator": true, "mx_RightPanel_headerButton_unreadIndicator": true, "mx_Indicator_bold": color === NotificationColor.Bold, "mx_Indicator_gray": color === NotificationColor.Grey, diff --git a/src/components/views/rooms/EventTile.tsx b/src/components/views/rooms/EventTile.tsx index e811a37508..46379a8815 100644 --- a/src/components/views/rooms/EventTile.tsx +++ b/src/components/views/rooms/EventTile.tsx @@ -612,7 +612,7 @@ export class UnwrappedEventTile extends React.Component { * when we are at the sync stage */ const room = MatrixClientPeg.get().getRoom(this.props.mxEvent.getRoomId()); - const thread = room?.threads.get(this.props.mxEvent.getId()); + const thread = room?.threads?.get(this.props.mxEvent.getId()); return thread || null; } diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index 795167ac67..28584afaf6 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -867,6 +867,13 @@ "Render LaTeX maths in messages": "Render LaTeX maths in messages", "Message Pinning": "Message Pinning", "Threaded messaging": "Threaded messaging", + "Keep discussions organised with threads.": "Keep discussions organised with threads.", + "Threads help keep conversations on-topic and easy to track. Learn more.": "Threads help keep conversations on-topic and easy to track. Learn more.", + "How can I start a thread?": "How can I start a thread?", + "Use \"Reply in thread\" when hovering over a message.": "Use \"Reply in thread\" when hovering over a message.", + "How can I leave the beta?": "How can I leave the beta?", + "To leave, return to this page and use the “Leave the beta” button.": "To leave, return to this page and use the “Leave the beta” button.", + "Thank you for trying the beta, please go into as much detail as you can so we can improve it.": "Thank you for trying the beta, please go into as much detail as you can so we can improve it.", "Custom user status messages": "Custom user status messages", "Video rooms (under active development)": "Video rooms (under active development)", "Render simple counters in room header": "Render simple counters in room header", @@ -886,9 +893,7 @@ "This feature is a work in progress, we'd love to hear your feedback.": "This feature is a work in progress, we'd love to hear your feedback.", "How can I give feedback?": "How can I give feedback?", "To feedback, join the beta, start a search and click on feedback.": "To feedback, join the beta, start a search and click on feedback.", - "How can I leave the beta?": "How can I leave the beta?", "To leave, just return to this page or click on the beta badge when you search.": "To leave, just return to this page or click on the beta badge when you search.", - "Thank you for trying the beta, please go into as much detail as you can so we can improve it.": "Thank you for trying the beta, please go into as much detail as you can so we can improve it.", "Right panel stays open (defaults to room member list)": "Right panel stays open (defaults to room member list)", "Jump to date (adds /jumptodate and jump to date headers)": "Jump to date (adds /jumptodate and jump to date headers)", "Don't send read receipts": "Don't send read receipts", @@ -2075,6 +2080,8 @@ "Edit": "Edit", "Reply in thread": "Reply in thread", "Can't create a thread from an event with an existing relation": "Can't create a thread from an event with an existing relation", + "Beta feature": "Beta feature", + "Beta feature. Click to learn more.": "Beta feature. Click to learn more.", "Reply": "Reply", "Collapse quotes": "Collapse quotes", "Expand quotes": "Expand quotes", @@ -2371,7 +2378,7 @@ "Invite anyway and never warn me again": "Invite anyway and never warn me again", "Invite anyway": "Invite anyway", "Close dialog": "Close dialog", - "%(featureName)s beta feedback": "%(featureName)s beta feedback", + "%(featureName)s Beta feedback": "%(featureName)s Beta feedback", "To leave the beta, visit your settings.": "To leave the beta, visit your settings.", "Please tell us what went wrong or, better, create a GitHub issue that describes the problem.": "Please tell us what went wrong or, better, create a GitHub issue that describes the problem.", "Preparing to send logs": "Preparing to send logs", @@ -2886,7 +2893,6 @@ "Revoke permissions": "Revoke permissions", "Move left": "Move left", "Move right": "Move right", - "This is a beta feature. Click for more info": "This is a beta feature. Click for more info", "This is a beta feature": "This is a beta feature", "Click for more info": "Click for more info", "Beta": "Beta", @@ -3104,6 +3110,8 @@ "Threads help keep your conversations on-topic and easy to track.": "Threads help keep your conversations on-topic and easy to track.", "Tip: Use \"Reply in thread\" when hovering over a message.": "Tip: Use \"Reply in thread\" when hovering over a message.", "Keep discussions organised with threads": "Keep discussions organised with threads", + "Threads are a beta feature": "Threads are a beta feature", + "Give feedback": "Give feedback", "Thread": "Thread", "Tried to load a specific point in this room's timeline, but you do not have permission to view the message in question.": "Tried to load a specific point in this room's timeline, but you do not have permission to view the message in question.", "Tried to load a specific point in this room's timeline, but was unable to find it.": "Tried to load a specific point in this room's timeline, but was unable to find it.", diff --git a/src/settings/Settings.tsx b/src/settings/Settings.tsx index f25a4bf8ce..8cd842b74e 100644 --- a/src/settings/Settings.tsx +++ b/src/settings/Settings.tsx @@ -165,7 +165,7 @@ export interface IBaseSetting { title: string; // _td caption: () => ReactNode; disclaimer?: (enabled: boolean) => ReactNode; - image: string; // require(...) + image?: string; // require(...) feedbackSubheading?: string; feedbackLabel?: string; extraSettings?: string[]; @@ -228,6 +228,30 @@ export const SETTINGS: {[setting: string]: ISetting} = { displayName: _td("Threaded messaging"), supportedLevels: LEVELS_FEATURE, default: false, + betaInfo: { + title: _td("Threads"), + caption: () => <> +

{ _t("Keep discussions organised with threads.") }

+

{ _t("Threads help keep conversations on-topic and easy to track. Learn more.", {}, { + a: (sub) => + { sub } + , + }) }

+ , + disclaimer: () => + SdkConfig.get().bug_report_endpoint_url && <> +

{ _t("How can I start a thread?") }

+

{ _t("Use \"Reply in thread\" when hovering over a message.") }

+

{ _t("How can I leave the beta?") }

+

{ _t("To leave, return to this page and use the “Leave the beta” button.") }

+ , + feedbackLabel: "thread-feedback", + feedbackSubheading: _td("Thank you for trying the beta, " + + "please go into as much detail as you can so we can improve it."), + image: require("../../res/img/betas/threads.png"), + requiresRefresh: true, + }, + }, "feature_custom_status": { isFeature: true,