diff --git a/src/components/views/rooms/RoomHeader.tsx b/src/components/views/rooms/RoomHeader.tsx index 19b368cd180..c7b1673166c 100644 --- a/src/components/views/rooms/RoomHeader.tsx +++ b/src/components/views/rooms/RoomHeader.tsx @@ -57,6 +57,9 @@ import { isVideoRoom } from "../../../utils/video-rooms"; import { notificationLevelToIndicator } from "../../../utils/notifications"; import { CallGuestLinkButton } from "./RoomHeader/CallGuestLinkButton"; import { ButtonEvent } from "../elements/AccessibleButton"; +import { ReleaseAnnouncement } from "../../structures/ReleaseAnnouncement"; +import { useIsReleaseAnnouncementOpen } from "../../../hooks/useIsReleaseAnnouncementOpen"; +import { ReleaseAnnouncementStore } from "../../../stores/ReleaseAnnouncementStore"; export default function RoomHeader({ room, @@ -238,74 +241,87 @@ export default function RoomHeader({ voiceCallButton = undefined; } + const isReleaseAnnouncementOpen = useIsReleaseAnnouncementOpen("newRoomHeader"); + return ( <> - + {roomTopic && ( + + {roomTopicBody} + + )} + + + {additionalButtons?.map((props) => { const label = props.label(); diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index 12ad79607d6..37e69b7a77c 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -1950,6 +1950,8 @@ "one": "Asking to join", "other": "%(count)s people asking to join" }, + "release_announcement_description": "Enjoy a simpler, more accessible room header.", + "release_announcement_header": "New design!", "room_is_public": "This room is public", "show_widgets_button": "Show Widgets", "video_call_button_ec": "Video call (%(brand)s)", diff --git a/src/stores/ReleaseAnnouncementStore.ts b/src/stores/ReleaseAnnouncementStore.ts index 604c13fc496..1fd3388982f 100644 --- a/src/stores/ReleaseAnnouncementStore.ts +++ b/src/stores/ReleaseAnnouncementStore.ts @@ -27,7 +27,7 @@ import { Features } from "../settings/Settings"; /** * The features are shown in the array order. */ -const FEATURES = ["threadsActivityCentre"] as const; +const FEATURES = ["threadsActivityCentre", "newRoomHeader"] as const; /** * All the features that can be shown in the release announcements. */ diff --git a/test/components/views/rooms/__snapshots__/RoomHeader-test.tsx.snap b/test/components/views/rooms/__snapshots__/RoomHeader-test.tsx.snap index 58abdb0991f..dd76c363676 100644 --- a/test/components/views/rooms/__snapshots__/RoomHeader-test.tsx.snap +++ b/test/components/views/rooms/__snapshots__/RoomHeader-test.tsx.snap @@ -7,6 +7,8 @@ exports[`RoomHeader does not show the face pile for DMs 1`] = ` style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x);" >