Matrix/element-web-Github
1
0
Fork 0
mirror of https://github.com/vector-im/element-web.git synced 2024-11-15 20:54:59 +08:00
Code Issues Packages Projects Releases Wiki Activity

Remove release announcement of new header (#23)

Browse Source
This commit is contained in:
Florian Duros 2024-09-11 11:17:44 +02:00 committed by GitHub
parent ccb1a61f56
commit 07125f554d
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
6 changed files with 57 additions and 91 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

122
src/components/views/rooms/RoomHeader.tsx
View File

@ -46,9 +46,6 @@ import { useIsVideoRoom } 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";
import WithPresenceIndicator, { useDmMember } from "../avatars/WithPresenceIndicator";
import { IOOBData } from "../../../stores/ThreepidInviteStore";
import RoomContext from "../../../contexts/RoomContext";
@ -225,8 +222,6 @@ export default function RoomHeader({
voiceCallButton = undefined;
}
const isReleaseAnnouncementOpen = useIsReleaseAnnouncementOpen("newRoomHeader");
const roomContext = useContext(RoomContext);
const isVideoRoom = useIsVideoRoom(room);
const showChatButton =
@ -237,75 +232,62 @@ export default function RoomHeader({
return (
<>
<Flex as="header" align="center" gap="var(--cpd-space-3x)" className="mx_RoomHeader light-panel">
<ReleaseAnnouncement
feature="newRoomHeader"
header={_t("room|header|release_announcement_header")}
description={_t("room|header|release_announcement_description")}
closeLabel={_t("action|ok")}
placement="bottom"
<button
aria-label={_t("right_panel|room_summary_card|title")}
tabIndex={0}
onClick={() => RightPanelStore.instance.showOrHidePanel(RightPanelPhases.RoomSummary)}
className="mx_RoomHeader_infoWrapper"
>
<button
aria-label={_t("right_panel|room_summary_card|title")}
tabIndex={0}
onClick={() => {
if (isReleaseAnnouncementOpen) {
ReleaseAnnouncementStore.instance.nextReleaseAnnouncement();
}
RightPanelStore.instance.showOrHidePanel(RightPanelPhases.RoomSummary);
}}
className="mx_RoomHeader_infoWrapper"
>
<WithPresenceIndicator room={room} size="8px">
<RoomAvatar room={room} size="40px" oobData={oobData} />
</WithPresenceIndicator>
<Box flex="1" className="mx_RoomHeader_info">
<BodyText
as="div"
size="lg"
weight="semibold"
dir="auto"
role="heading"
aria-level={1}
className="mx_RoomHeader_heading"
>
<span className="mx_RoomHeader_truncated mx_lineClamp">{roomName}</span>
<WithPresenceIndicator room={room} size="8px">
<RoomAvatar room={room} size="40px" oobData={oobData} />
</WithPresenceIndicator>
<Box flex="1" className="mx_RoomHeader_info">
<BodyText
as="div"
size="lg"
weight="semibold"
dir="auto"
role="heading"
aria-level={1}
className="mx_RoomHeader_heading"
>
<span className="mx_RoomHeader_truncated mx_lineClamp">{roomName}</span>
{!isDirectMessage && joinRule === JoinRule.Public && (
<Tooltip label={_t("common|public_room")} placement="right">
<PublicIcon
width="16px"
height="16px"
className="mx_RoomHeader_icon text-secondary"
aria-label={_t("common|public_room")}
/>
</Tooltip>
)}
{!isDirectMessage && joinRule === JoinRule.Public && (
<Tooltip label={_t("common|public_room")} placement="right">
<PublicIcon
width="16px"
height="16px"
className="mx_RoomHeader_icon text-secondary"
aria-label={_t("common|public_room")}
/>
</Tooltip>
)}
{isDirectMessage && e2eStatus === E2EStatus.Verified && (
<Tooltip label={_t("common|verified")} placement="right">
<VerifiedIcon
width="16px"
height="16px"
className="mx_RoomHeader_icon mx_Verified"
aria-label={_t("common|verified")}
/>
</Tooltip>
)}
{isDirectMessage && e2eStatus === E2EStatus.Verified && (
<Tooltip label={_t("common|verified")} placement="right">
<VerifiedIcon
width="16px"
height="16px"
className="mx_RoomHeader_icon mx_Verified"
aria-label={_t("common|verified")}
/>
</Tooltip>
)}
{isDirectMessage && e2eStatus === E2EStatus.Warning && (
<Tooltip label={_t("room|header_untrusted_label")} placement="right">
<ErrorIcon
width="16px"
height="16px"
className="mx_RoomHeader_icon mx_Untrusted"
aria-label={_t("room|header_untrusted_label")}
/>
</Tooltip>
)}
</BodyText>
</Box>
</button>
</ReleaseAnnouncement>
{isDirectMessage && e2eStatus === E2EStatus.Warning && (
<Tooltip label={_t("room|header_untrusted_label")} placement="right">
<ErrorIcon
width="16px"
height="16px"
className="mx_RoomHeader_icon mx_Untrusted"
aria-label={_t("room|header_untrusted_label")}
/>
</Tooltip>
)}
</BodyText>
</Box>
</button>
<Flex align="center" gap="var(--cpd-space-2x)">
{additionalButtons?.map((props) => {
const label = props.label();

2
src/i18n/strings/en_EN.json
View File

@ -1965,8 +1965,6 @@
"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)",

2
src/stores/ReleaseAnnouncementStore.ts
View File

@ -17,7 +17,7 @@ import { Features } from "../settings/Settings";
/**
* The features are shown in the array order.
*/
const FEATURES = ["threadsActivityCentre", "newRoomHeader"] as const;
const FEATURES = ["threadsActivityCentre"] as const;
/**
* All the features that can be shown in the release announcements.
*/

8
test/components/structures/__snapshots__/RoomView-test.tsx.snap
View File

@ -10,8 +10,6 @@ exports[`RoomView for a local room in state CREATING should match the snapshot 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);"
>
<button
aria-expanded="false"
aria-haspopup="dialog"
aria-label="Room info"
class="mx_RoomHeader_infoWrapper"
tabindex="0"
@ -182,8 +180,6 @@ exports[`RoomView for a local room in state ERROR should match the snapshot 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);"
>
<button
aria-expanded="false"
aria-haspopup="dialog"
aria-label="Room info"
class="mx_RoomHeader_infoWrapper"
tabindex="0"
@ -439,8 +435,6 @@ exports[`RoomView for a local room in state NEW should match the snapshot 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);"
>
<button
aria-expanded="false"
aria-haspopup="dialog"
aria-label="Room info"
class="mx_RoomHeader_infoWrapper"
tabindex="0"
@ -773,8 +767,6 @@ exports[`RoomView for a local room in state NEW that is encrypted should match t
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x);"
>
<button
aria-expanded="false"
aria-haspopup="dialog"
aria-label="Room info"
class="mx_RoomHeader_infoWrapper"
tabindex="0"

2
test/components/views/rooms/__snapshots__/RoomHeader-test.tsx.snap
View File

@ -7,8 +7,6 @@ exports[`RoomHeader dm 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);"
>
<button
aria-expanded="false"
aria-haspopup="dialog"
aria-label="Room info"
class="mx_RoomHeader_infoWrapper"
tabindex="0"

12
test/stores/ReleaseAnnouncementStore-test.tsx
View File

@ -89,15 +89,11 @@ describe("ReleaseAnnouncementStore", () => {
// Sanity check
expect(releaseAnnouncementStore.getReleaseAnnouncement()).toBe("threadsActivityCentre");
let promise = listenReleaseAnnouncementChanged();
const promise = listenReleaseAnnouncementChanged();
await releaseAnnouncementStore.nextReleaseAnnouncement();
expect(await promise).toBe("newRoomHeader");
expect(releaseAnnouncementStore.getReleaseAnnouncement()).toBe("newRoomHeader");
promise = listenReleaseAnnouncementChanged();
await releaseAnnouncementStore.nextReleaseAnnouncement();
expect(await promise).toBeNull();
expect(releaseAnnouncementStore.getReleaseAnnouncement()).toBeNull();
const secondStore = new ReleaseAnnouncementStore();
// All the release announcements have been viewed, so it should be updated in the store account
@ -112,7 +108,7 @@ describe("ReleaseAnnouncementStore", () => {
const promise = listenReleaseAnnouncementChanged();
await secondStore.nextReleaseAnnouncement();
expect(await promise).toBe("newRoomHeader");
expect(releaseAnnouncementStore.getReleaseAnnouncement()).toBe("newRoomHeader");
expect(await promise).toBeNull();
expect(releaseAnnouncementStore.getReleaseAnnouncement()).toBeNull();
});
});