From 2fd8f2f1c671fab118698270df6b6fd37195ac20 Mon Sep 17 00:00:00 2001
From: manancodes <manancodes.dev@gmail.com>
Date: Sun, 15 Oct 2023 18:54:42 +0530
Subject: [PATCH] Chat icon added in new header

---
 res/css/views/rooms/_RoomHeader.pcss      |  6 ++++++
 src/components/views/rooms/RoomHeader.tsx | 18 ++++++++++++++++++
 2 files changed, 24 insertions(+)

diff --git a/res/css/views/rooms/_RoomHeader.pcss b/res/css/views/rooms/_RoomHeader.pcss
index 6fd3897c5e7..15f331ebc91 100644
--- a/res/css/views/rooms/_RoomHeader.pcss
+++ b/res/css/views/rooms/_RoomHeader.pcss
@@ -87,3 +87,9 @@ limitations under the License.
         background: var(--cpd-color-bg-subtle-primary);
     }
 }
+.mx_RoomHeader_ChatIcon {
+    * {
+        fill: $icon-button-color;
+    }
+    color: $icon-button-color;
+}
diff --git a/src/components/views/rooms/RoomHeader.tsx b/src/components/views/rooms/RoomHeader.tsx
index f7ff511ce84..96aa99c386f 100644
--- a/src/components/views/rooms/RoomHeader.tsx
+++ b/src/components/views/rooms/RoomHeader.tsx
@@ -48,6 +48,8 @@ import RoomAvatar from "../avatars/RoomAvatar";
 import { formatCount } from "../../../utils/FormattingUtils";
 import RightPanelStore from "../../../stores/right-panel/RightPanelStore";
 import { Linkify, topicToHtml } from "../../../HtmlUtils";
+import { Icon as ChatIcon } from "../../../../res/img/element-icons/feedback.svg";
+import { isVideoRoom as calcIsVideoRoom } from "../../../utils/video-rooms";
 
 /**
  * A helper to transform a notification color to the what the Compound Icon Button
@@ -74,6 +76,7 @@ export default function RoomHeader({ room }: { room: Room }): JSX.Element {
     const memberCount = useRoomMemberCount(room, { throttleWait: 2500 });
 
     const { voiceCallDisabledReason, voiceCallClick, videoCallDisabledReason, videoCallClick } = useRoomCall(room);
+    const isVideoRoom = useFeatureEnabled("feature_video_rooms") && calcIsVideoRoom(room);
 
     const groupCallsEnabled = useFeatureEnabled("feature_group_calls");
     /**
@@ -189,6 +192,21 @@ export default function RoomHeader({ room }: { room: Room }): JSX.Element {
                         <VideoCallIcon />
                     </IconButton>
                 </Tooltip>
+                {/* Ensure that the chat button is only visible in video rooms */}
+                {isVideoRoom && (
+                    <Tooltip label={_t("right_panel|video_room_chat|title")}>
+                        <IconButton
+                            // indicator={notificationColorToIndicator(threadNotifications)}  TODO: This still needs work
+                            onClick={(evt) => {
+                                evt.stopPropagation();
+                                RightPanelStore.instance.showOrHidePanel(RightPanelPhases.Timeline);
+                            }}
+                            aria-label={_t("right_panel|video_room_chat|title")}
+                        >
+                            <ChatIcon className="mx_RoomHeader_ChatIcon" />
+                        </IconButton>
+                    </Tooltip>
+                )}
                 <Tooltip label={_t("common|threads")}>
                     <IconButton
                         indicator={notificationColorToIndicator(threadNotifications)}