Show the room name in the room header during calls (#9942)

matrix-org · Jan 20, 2023 · 9d0230b · 9d0230b
1 parent da30b30
commit 9d0230b
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 12 deletions.
diff --git a/res/css/views/rooms/_RoomHeader.pcss b/res/css/views/rooms/_RoomHeader.pcss
@@ -108,7 +108,7 @@ limitations under the License.
     display: flex;
     user-select: none;
 
-    &:not(.mx_RoomHeader_name--textonly):hover {
+    &:hover {
         background-color: $quinary-content;
     }
 

diff --git a/src/components/views/rooms/RoomHeader.tsx b/src/components/views/rooms/RoomHeader.tsx
@@ -743,6 +743,13 @@ export default class RoomHeader extends React.Component<IProps, IState> {
 
         const buttons = this.props.showButtons ? this.renderButtons(isVideoRoom) : null;
 
+        let oobName = _t("Join Room");
+        if (this.props.oobData && this.props.oobData.name) {
+            oobName = this.props.oobData.name;
+        }
+
+        const name = this.renderName(oobName);
+
         if (this.props.viewingCall && !isVideoRoom) {
             return (
                 <header className="mx_RoomHeader light-panel">
@@ -752,9 +759,7 @@ export default class RoomHeader extends React.Component<IProps, IState> {
                     >
                         <div className="mx_RoomHeader_avatar">{roomAvatar}</div>
                         {icon}
-                        <div className="mx_RoomHeader_name mx_RoomHeader_name--textonly mx_RoomHeader_name--small">
-                            {_t("Video call")}
-                        </div>
+                        {name}
                         {this.props.activeCall instanceof ElementCall && (
                             <GroupCallDuration groupCall={this.props.activeCall.groupCall} />
                         )}
@@ -779,13 +784,6 @@ export default class RoomHeader extends React.Component<IProps, IState> {
             );
         }
 
-        let oobName = _t("Join Room");
-        if (this.props.oobData && this.props.oobData.name) {
-            oobName = this.props.oobData.name;
-        }
-
-        const name = this.renderName(oobName);
-
         const topicElement = <RoomTopic room={this.props.room} className="mx_RoomHeader_topic" />;
 
         const viewLabs = (): void =>

diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json
@@ -1997,9 +1997,9 @@
     "Close call": "Close call",
     "View chat timeline": "View chat timeline",
     "Room options": "Room options",
+    "Join Room": "Join Room",
     "(~%(count)s results)|other": "(~%(count)s results)",
     "(~%(count)s results)|one": "(~%(count)s result)",
-    "Join Room": "Join Room",
     "Video rooms are a beta feature": "Video rooms are a beta feature",
     "Video room": "Video room",
     "Public space": "Public space",