Merge branch 'develop' of github.com:matrix-org/matrix-react-sdk into t3chguy/react18/update

# Conflicts: # src/components/views/settings/tabs/user/GeneralUserSettingsTab.tsx # test/components/views/right_panel/__snapshots__/RoomSummaryCard-test.tsx.snap
2025-08-09 08:42:50 +03:00 · 2024-08-01 17:04:11 +01:00
parent 8d7f0aa3cc 9cd0c247a2
commit 78378615d1
17 changed files with 463 additions and 419 deletions
--- a/playwright/e2e/polls/pollHistory.spec.ts
+++ b/playwright/e2e/polls/pollHistory.spec.ts
@@ -69,7 +69,7 @@ test.describe("Poll history", () => {
    async function openPollHistory(app: ElementAppPage): Promise<void> {
        const { page } = app;
        await app.toggleRoomInfoPanel();
-        await page.locator(".mx_RoomSummaryCard").getByRole("menuitem", { name: "Poll history" }).click();
+        await page.locator(".mx_RoomSummaryCard").getByRole("menuitem", { name: "Polls" }).click();
    }

    test.use({
--- a/playwright/snapshots/crypto/crypto.spec.ts/RoomSummaryCard-with-verified-e2ee-linux.png
+++ b/playwright/snapshots/crypto/crypto.spec.ts/RoomSummaryCard-with-verified-e2ee-linux.png
--- a/playwright/snapshots/right-panel/right-panel.spec.ts/with-name-and-address-linux.png
+++ b/playwright/snapshots/right-panel/right-panel.spec.ts/with-name-and-address-linux.png
--- a/playwright/snapshots/settings/general-room-settings-tab.spec.ts/General-room-settings-tab-should-be-rendered-properly-1-linux.png
+++ b/playwright/snapshots/settings/general-room-settings-tab.spec.ts/General-room-settings-tab-should-be-rendered-properly-1-linux.png
--- a/res/css/views/right_panel/_RoomSummaryCard.pcss
+++ b/res/css/views/right_panel/_RoomSummaryCard.pcss
@@ -15,6 +15,9 @@ limitations under the License.
 */

 .mx_RoomSummaryCard {
+    --cpd-separator-inset: var(--cpd-space-4x);
+    --cpd-separator-spacing: var(--cpd-space-4x);
+
    .mx_RoomSummaryCard_container {
        text-align: center;
        margin: $spacing-20 var(--cpd-space-4x) 0;
--- a/res/css/views/rooms/_RoomPreviewBar.pcss
+++ b/res/css/views/rooms/_RoomPreviewBar.pcss
@@ -163,6 +163,10 @@ a.mx_RoomPreviewBar_inviter {
    cursor: pointer;
 }

+.mx_RoomPreviewBar_inviter_mxid {
+    color: var(--cpd-color-text-secondary);
+}
+
 .mx_RoomPreviewBar_icon {
    margin-right: 8px;
    vertical-align: text-top;
--- a/src/components/views/right_panel/RoomSummaryCard.tsx
+++ b/src/components/views/right_panel/RoomSummaryCard.tsx
@@ -385,18 +385,11 @@ const RoomSummaryCard: React.FC<IProps> = ({
                    disabled={!canInviteToState}
                    onSelect={() => inviteToRoom(room)}
                />
-                <MenuItem Icon={LinkIcon} label={_t("action|copy_link")} onSelect={onShareRoomClick} />
-                <MenuItem Icon={SettingsIcon} label={_t("common|settings")} onSelect={onRoomSettingsClick} />

                <Separator />
+
                {!isVideoRoom && (
                    <>
-                        <MenuItem Icon={FilesIcon} label={_t("right_panel|files_button")} onSelect={onRoomFilesClick} />
-                        <MenuItem
-                            Icon={PollsIcon}
-                            label={_t("right_panel|polls_button")}
-                            onSelect={onRoomPollHistoryClick}
-                        />
                        {pinningEnabled && (
                            <MenuItem
                                Icon={PinIcon}
@@ -408,6 +401,21 @@ const RoomSummaryCard: React.FC<IProps> = ({
                                </Text>
                            </MenuItem>
                        )}
+                        <MenuItem Icon={FilesIcon} label={_t("right_panel|files_button")} onSelect={onRoomFilesClick} />
+                    </>
+                )}
+
+                <Separator />
+
+                <MenuItem Icon={LinkIcon} label={_t("action|copy_link")} onSelect={onShareRoomClick} />
+
+                {!isVideoRoom && (
+                    <>
+                        <MenuItem
+                            Icon={PollsIcon}
+                            label={_t("right_panel|polls_button")}
+                            onSelect={onRoomPollHistoryClick}
+                        />
                        <MenuItem
                            Icon={ExportArchiveIcon}
                            label={_t("export_chat|title")}
@@ -416,6 +424,8 @@ const RoomSummaryCard: React.FC<IProps> = ({
                    </>
                )}

+                <MenuItem Icon={SettingsIcon} label={_t("common|settings")} onSelect={onRoomSettingsClick} />
+
                <Separator />

                <MenuItem
--- a/src/components/views/rooms/RoomPreviewBar.tsx
+++ b/src/components/views/rooms/RoomPreviewBar.tsx
@@ -506,33 +506,39 @@ export default class RoomPreviewBar extends React.Component<IProps, IState> {
                break;
            }
            case MessageCase.Invite: {
+                const isDM = this.isDMInvite();
                const avatar = <RoomAvatar room={this.props.room} oobData={this.props.oobData} />;

                const inviteMember = this.getInviteMember();
-                let inviterElement: JSX.Element;
-                if (inviteMember) {
-                    inviterElement = (
-                        <span>
-                            <span className="mx_RoomPreviewBar_inviter">{inviteMember.rawDisplayName}</span> (
-                            {inviteMember.userId})
+                const userName = (
+                    <span className="mx_RoomPreviewBar_inviter">
+                        {inviteMember?.rawDisplayName ?? this.props.inviterName}
                    </span>
                );
-                } else {
-                    inviterElement = <span className="mx_RoomPreviewBar_inviter">{this.props.inviterName}</span>;
-                }
+                const inviterElement = (
+                    <>
+                        {isDM
+                            ? _t("room|dm_invite_subtitle", {}, { userName })
+                            : _t("room|invite_subtitle", {}, { userName })}
+                        {inviteMember && (
+                            <>
+                                <br />
+                                <span className="mx_RoomPreviewBar_inviter_mxid">{inviteMember.userId}</span>
+                            </>
+                        )}
+                    </>
+                );

-                const isDM = this.isDMInvite();
                if (isDM) {
                    title = _t("room|dm_invite_title", {
                        user: inviteMember?.name ?? this.props.inviterName,
                    });
-                    subTitle = [avatar, _t("room|dm_invite_subtitle", {}, { userName: () => inviterElement })];
                    primaryActionLabel = _t("room|dm_invite_action");
                } else {
                    title = _t("room|invite_title", { roomName });
-                    subTitle = [avatar, _t("room|invite_subtitle", {}, { userName: () => inviterElement })];
                    primaryActionLabel = _t("action|accept");
                }
+                subTitle = [avatar, inviterElement];

                const myUserId = MatrixClientPeg.safeGet().getSafeUserId();
                const member = this.props.room?.currentState.getMember(myUserId);
--- a/src/components/views/settings/tabs/user/GeneralUserSettingsTab.tsx
+++ b/src/components/views/settings/tabs/user/GeneralUserSettingsTab.tsx
@@ -16,7 +16,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */

-import React from "react";
+import React, { useCallback, useContext, useEffect } from "react";
 import { HTTPError } from "matrix-js-sdk/src/matrix";
 import { logger } from "matrix-js-sdk/src/logger";

@@ -34,40 +34,77 @@ import { SettingsSection } from "../../shared/SettingsSection";
 import SettingsSubsection, { SettingsSubsectionText } from "../../shared/SettingsSubsection";
 import { SDKContext } from "../../../../../contexts/SDKContext";
 import UserPersonalInfoSettings from "../../UserPersonalInfoSettings";
+import { useMatrixClientContext } from "../../../../../contexts/MatrixClientContext";

 interface IProps {
    closeSettingsFn: () => void;
 }

-interface IState {
+interface AccountSectionProps {
    canChangePassword: boolean;
-    idServerName?: string;
-    externalAccountManagementUrl?: string;
-    canMake3pidChanges: boolean;
-    canSetDisplayName: boolean;
-    canSetAvatar: boolean;
+    onPasswordChangeError: (e: Error) => void;
+    onPasswordChanged: () => void;
 }

-export default class GeneralUserSettingsTab extends React.Component<IProps, IState> {
-    public static contextType = SDKContext;
-    public declare context: React.ContextType<typeof SDKContext>;
+const AccountSection: React.FC<AccountSectionProps> = ({
+    canChangePassword,
+    onPasswordChangeError,
+    onPasswordChanged,
+}) => {
+    if (!canChangePassword) return <></>;

-    public constructor(props: IProps, context: React.ContextType<typeof SDKContext>) {
-        super(props, context);
+    return (
+        <>
+            <SettingsSubsection
+                heading={_t("settings|general|account_section")}
+                stretchContent
+                data-testid="accountSection"
+            >
+                <SettingsSubsectionText>{_t("settings|general|password_change_section")}</SettingsSubsectionText>
+                <ChangePassword
+                    className="mx_GeneralUserSettingsTab_section--account_changePassword"
+                    rowClassName=""
+                    buttonKind="primary"
+                    onError={onPasswordChangeError}
+                    onFinished={onPasswordChanged}
+                />
+            </SettingsSubsection>
+        </>
+    );
+};

-        this.state = {
-            canChangePassword: false,
-            canMake3pidChanges: false,
-            canSetDisplayName: false,
-            canSetAvatar: false,
-        };
+interface ManagementSectionProps {
+    onDeactivateClicked: () => void;
+}

-        this.getCapabilities();
-    }
+const ManagementSection: React.FC<ManagementSectionProps> = ({ onDeactivateClicked }) => {
+    return (
+        <SettingsSection heading={_t("settings|general|deactivate_section")}>
+            <SettingsSubsection
+                heading={_t("settings|general|account_management_section")}
+                data-testid="account-management-section"
+                description={_t("settings|general|deactivate_warning")}
+            >
+                <AccessibleButton onClick={onDeactivateClicked} kind="danger">
+                    {_t("settings|general|deactivate_section")}
+                </AccessibleButton>
+            </SettingsSubsection>
+        </SettingsSection>
+    );
+};

-    private async getCapabilities(): Promise<void> {
-        const cli = this.context.client!;
+const GeneralUserSettingsTab: React.FC<IProps> = ({ closeSettingsFn }) => {
+    const [externalAccountManagementUrl, setExternalAccountManagementUrl] = React.useState<string | undefined>();
+    const [canMake3pidChanges, setCanMake3pidChanges] = React.useState<boolean>(false);
+    const [canSetDisplayName, setCanSetDisplayName] = React.useState<boolean>(false);
+    const [canSetAvatar, setCanSetAvatar] = React.useState<boolean>(false);
+    const [canChangePassword, setCanChangePassword] = React.useState<boolean>(false);

+    const cli = useMatrixClientContext();
+    const sdkContext = useContext(SDKContext);
+
+    useEffect(() => {
+        (async () => {
            const capabilities = (await cli.getCapabilities()) ?? {};
            const changePasswordCap = capabilities["m.change_password"];

@@ -76,27 +113,27 @@ export default class GeneralUserSettingsTab extends React.Component<IProps, ISta
            // the enabled flag value.
            const canChangePassword = !changePasswordCap || changePasswordCap["enabled"] !== false;

-        await this.context.oidcClientStore.readyPromise; // wait for the store to be ready
-        const externalAccountManagementUrl = this.context.oidcClientStore.accountManagementEndpoint;
+            await sdkContext.oidcClientStore.readyPromise; // wait for the store to be ready
+            const externalAccountManagementUrl = sdkContext.oidcClientStore.accountManagementEndpoint;
            // https://spec.matrix.org/v1.7/client-server-api/#m3pid_changes-capability
            // We support as far back as v1.1 which doesn't have m.3pid_changes
            // so the behaviour for when it is missing has to be assume true
-        const canMake3pidChanges = !capabilities["m.3pid_changes"] || capabilities["m.3pid_changes"].enabled === true;
+            const canMake3pidChanges =
+                !capabilities["m.3pid_changes"] || capabilities["m.3pid_changes"].enabled === true;

            const canSetDisplayName =
                !capabilities["m.set_displayname"] || capabilities["m.set_displayname"].enabled === true;
            const canSetAvatar = !capabilities["m.set_avatar_url"] || capabilities["m.set_avatar_url"].enabled === true;

-        this.setState({
-            canChangePassword,
-            externalAccountManagementUrl,
-            canMake3pidChanges,
-            canSetDisplayName,
-            canSetAvatar,
-        });
-    }
+            setCanMake3pidChanges(canMake3pidChanges);
+            setCanSetDisplayName(canSetDisplayName);
+            setCanSetAvatar(canSetAvatar);
+            setExternalAccountManagementUrl(externalAccountManagementUrl);
+            setCanChangePassword(canChangePassword);
+        })();
+    }, [cli, sdkContext.oidcClientStore]);

-    private onPasswordChangeError = (err: Error): void => {
+    const onPasswordChangeError = useCallback((err: Error): void => {
        logger.error("Failed to change password: " + err);

        let underlyingError = err;
@@ -126,85 +163,49 @@ export default class GeneralUserSettingsTab extends React.Component<IProps, ISta
            title: _t("settings|general|error_password_change_title"),
            description: errorMessageToDisplay,
        });
-    };
+    }, []);

-    private onPasswordChanged = (): void => {
+    const onPasswordChanged = useCallback((): void => {
        const description = _t("settings|general|password_change_success");
        // TODO: Figure out a design that doesn't involve replacing the current dialog
        Modal.createDialog(ErrorDialog, {
            title: _t("common|success"),
            description,
        });
-    };
+    }, []);

-    private onDeactivateClicked = (): void => {
+    const onDeactivateClicked = useCallback((): void => {
        Modal.createDialog(DeactivateAccountDialog, {
            onFinished: (success) => {
-                if (success) this.props.closeSettingsFn();
+                if (success) closeSettingsFn();
            },
        });
-    };
+    }, [closeSettingsFn]);

-    private renderAccountSection(): JSX.Element | undefined {
-        if (!this.state.canChangePassword) return undefined;
-
-        return (
-            <>
-                <SettingsSubsection
-                    heading={_t("settings|general|account_section")}
-                    stretchContent
-                    data-testid="accountSection"
-                >
-                    <SettingsSubsectionText>{_t("settings|general|password_change_section")}</SettingsSubsectionText>
-                    <ChangePassword
-                        className="mx_GeneralUserSettingsTab_section--account_changePassword"
-                        rowClassName=""
-                        buttonKind="primary"
-                        onError={this.onPasswordChangeError}
-                        onFinished={this.onPasswordChanged}
-                    />
-                </SettingsSubsection>
-            </>
-        );
-    }
-
-    private renderManagementSection(): JSX.Element {
-        // TODO: Improve warning text for account deactivation
-        return (
-            <SettingsSection heading={_t("settings|general|deactivate_section")}>
-                <SettingsSubsection
-                    heading={_t("settings|general|account_management_section")}
-                    data-testid="account-management-section"
-                    description={_t("settings|general|deactivate_warning")}
-                >
-                    <AccessibleButton onClick={this.onDeactivateClicked} kind="danger">
-                        {_t("settings|general|deactivate_section")}
-                    </AccessibleButton>
-                </SettingsSubsection>
-            </SettingsSection>
-        );
-    }
-
-    public render(): React.ReactNode {
    let accountManagementSection: JSX.Element | undefined;
-        const isAccountManagedExternally = !!this.state.externalAccountManagementUrl;
+    const isAccountManagedExternally = Boolean(externalAccountManagementUrl);
    if (SettingsStore.getValue(UIFeature.Deactivate) && !isAccountManagedExternally) {
-            accountManagementSection = this.renderManagementSection();
+        accountManagementSection = <ManagementSection onDeactivateClicked={onDeactivateClicked} />;
    }

    return (
        <SettingsTab data-testid="mx_GeneralUserSettingsTab">
            <SettingsSection>
                <UserProfileSettings
-                        externalAccountManagementUrl={this.state.externalAccountManagementUrl}
-                        canSetDisplayName={this.state.canSetDisplayName}
-                        canSetAvatar={this.state.canSetAvatar}
+                    externalAccountManagementUrl={externalAccountManagementUrl}
+                    canSetDisplayName={canSetDisplayName}
+                    canSetAvatar={canSetAvatar}
+                />
+                <UserPersonalInfoSettings canMake3pidChanges={canMake3pidChanges} />
+                <AccountSection
+                    canChangePassword={canChangePassword}
+                    onPasswordChanged={onPasswordChanged}
+                    onPasswordChangeError={onPasswordChangeError}
                />
-                    <UserPersonalInfoSettings canMake3pidChanges={this.state.canMake3pidChanges} />
-                    {this.renderAccountSection()}
            </SettingsSection>
            {accountManagementSection}
        </SettingsTab>
    );
-    }
-}
+};
+
+export default GeneralUserSettingsTab;
--- a/src/i18n/strings/en_EN.json
+++ b/src/i18n/strings/en_EN.json
@@ -1846,7 +1846,7 @@
            },
            "title": "Pinned messages"
        },
-        "pinned_messages_button": "Pinned",
+        "pinned_messages_button": "Pinned messages",
        "poll": {
            "active_heading": "Active polls",
            "empty_active": "There are no active polls in this room",
@@ -1871,7 +1871,7 @@
            "view_in_timeline": "View poll in timeline",
            "view_poll": "View poll"
        },
-        "polls_button": "Poll history",
+        "polls_button": "Polls",
        "room_summary_card": {
            "title": "Room info"
        },
@@ -1991,7 +1991,7 @@
        "invite_reject_ignore": "Reject & Ignore user",
        "invite_sent_to_email": "This invite was sent to %(email)s",
        "invite_sent_to_email_room": "This invite to %(roomName)s was sent to %(email)s",
-        "invite_subtitle": "<userName/> invited you",
+        "invite_subtitle": "Invited by <userName/>",
        "invite_this_room": "Invite to this room",
        "invite_title": "Do you want to join %(roomName)s?",
        "inviter_unknown": "Unknown",
--- a/test/components/views/dialogs/RoomSettingsDialog-test.tsx
+++ b/test/components/views/dialogs/RoomSettingsDialog-test.tsx
@@ -183,7 +183,7 @@ describe("<RoomSettingsDialog />", () => {
        it("displays poll history when tab clicked", () => {
            const { container } = getComponent();

-            fireEvent.click(screen.getByText("Poll history"));
+            fireEvent.click(screen.getByText("Polls"));

            expect(container.querySelector(".mx_SettingsTab")).toMatchSnapshot();
        });
--- a/test/components/views/dialogs/snapshots/RoomSettingsDialog-test.tsx.snap
+++ b/test/components/views/dialogs/snapshots/RoomSettingsDialog-test.tsx.snap
@@ -89,7 +89,7 @@ NodeList [
      class="mx_TabbedView_tabLabel_text"
      id="mx_tabpanel_ROOM_POLL_HISTORY_TAB_label"
    >
-      Poll history
+      Polls
    </span>
  </li>,
 ]
@@ -105,7 +105,7 @@ exports[`<RoomSettingsDialog /> poll history displays poll history when tab clic
    <h2
      class="mx_Heading_h2 mx_PollHistory_header"
    >
-      Poll history
+      Polls
    </h2>
    <div
      class="mx_PollHistoryList"
--- a/test/components/views/polls/pollHistory/PollHistory-test.tsx
+++ b/test/components/views/polls/pollHistory/PollHistory-test.tsx
@@ -321,7 +321,7 @@ describe("<PollHistory />", () => {

            fireEvent.click(getByText("Question?"));

-            expect(queryByText("Poll history")).not.toBeInTheDocument();
+            expect(queryByText("Polls")).not.toBeInTheDocument();
            // elements from MPollBody
            expect(getByText("Question?")).toMatchSnapshot();
            expect(getByText("Socks")).toBeInTheDocument();
@@ -397,13 +397,13 @@ describe("<PollHistory />", () => {
            expect(getByText("Question?")).toBeInTheDocument();

            // header not shown
-            expect(queryByText("Poll history")).not.toBeInTheDocument();
+            expect(queryByText("Polls")).not.toBeInTheDocument();

            expect(getByText("Active polls")).toMatchSnapshot();
            fireEvent.click(getByText("Active polls"));

            // main list header displayed again
-            expect(getByText("Poll history")).toBeInTheDocument();
+            expect(getByText("Polls")).toBeInTheDocument();
            // active filter still active
            expect(getByTestId("filter-tab-PollHistory_filter-ACTIVE").firstElementChild).toBeChecked();
            // list displayed
--- a/test/components/views/polls/pollHistory/snapshots/PollHistory-test.tsx.snap
+++ b/test/components/views/polls/pollHistory/snapshots/PollHistory-test.tsx.snap
@@ -37,7 +37,7 @@ exports[`<PollHistory /> renders a list of active polls when there are polls in
    <h2
      class="mx_Heading_h2 mx_PollHistory_header"
    >
-      Poll history
+      Polls
    </h2>
    <div
      class="mx_PollHistoryList"
--- a/test/components/views/right_panel/RoomSummaryCard-test.tsx
+++ b/test/components/views/right_panel/RoomSummaryCard-test.tsx
@@ -271,7 +271,7 @@ describe("<RoomSummaryCard />", () => {
            mocked(settingsHooks.useFeatureEnabled).mockImplementation((feature) => feature === "feature_pinning");
            const { getByText } = getComponent();

-            expect(getByText("Pinned")).toBeInTheDocument();
+            expect(getByText("Pinned messages")).toBeInTheDocument();
        });
    });

@@ -279,14 +279,14 @@ describe("<RoomSummaryCard />", () => {
        it("renders poll history option", () => {
            const { getByText } = getComponent();

-            expect(getByText("Poll history")).toBeInTheDocument();
+            expect(getByText("Polls")).toBeInTheDocument();
        });

        it("opens poll history dialog on button click", () => {
            const permalinkCreator = new RoomPermalinkCreator(room);
            const { getByText } = getComponent({ permalinkCreator });

-            fireEvent.click(getByText("Poll history"));
+            fireEvent.click(getByText("Polls"));

            expect(Modal.createDialog).toHaveBeenCalledWith(PollHistoryDialog, {
                room,
--- a/test/components/views/right_panel/snapshots/RoomSummaryCard-test.tsx.snap
+++ b/test/components/views/right_panel/snapshots/RoomSummaryCard-test.tsx.snap
@@ -180,6 +180,55 @@ exports[`<RoomSummaryCard /> has button to edit topic 1`] = `
            />
          </svg>
        </button>
+        <div
+          class="_separator_144s5_17"
+          data-kind="primary"
+          data-orientation="horizontal"
+          role="separator"
+        />
+        <button
+          class="_item_1gwvj_17 _interactive_1gwvj_36"
+          data-kind="primary"
+          role="menuitem"
+        >
+          <svg
+            aria-hidden="true"
+            class="_icon_1gwvj_44"
+            fill="currentColor"
+            height="24"
+            viewBox="0 0 24 24"
+            width="24"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <path
+              d="M6 22c-.55 0-1.02-.196-1.412-.587A1.926 1.926 0 0 1 4 20V4c0-.55.196-1.02.588-1.413A1.926 1.926 0 0 1 6 2h7.175a1.975 1.975 0 0 1 1.4.575l4.85 4.85a1.975 1.975 0 0 1 .575 1.4V20c0 .55-.196 1.02-.587 1.413A1.926 1.926 0 0 1 18 22H6Zm7-14V4H6v16h12V9h-4a.968.968 0 0 1-.713-.287A.967.967 0 0 1 13 8Z"
+            />
+          </svg>
+          <span
+            class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_1gwvj_53"
+          >
+            Files
+          </span>
+          <svg
+            aria-hidden="true"
+            class="_nav-hint_1gwvj_60"
+            fill="currentColor"
+            height="24"
+            viewBox="8 0 8 24"
+            width="8"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <path
+              d="M8.7 17.3a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7l3.9-3.9-3.9-3.9a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7.948.948 0 0 1 .7-.275.95.95 0 0 1 .7.275l4.6 4.6c.1.1.17.208.213.325.041.117.062.242.062.375s-.02.258-.063.375a.876.876 0 0 1-.212.325l-4.6 4.6a.948.948 0 0 1-.7.275.948.948 0 0 1-.7-.275Z"
+            />
+          </svg>
+        </button>
+        <div
+          class="_separator_144s5_17"
+          data-kind="primary"
+          data-orientation="horizontal"
+          role="separator"
+        />
        <button
          class="_item_1gwvj_17 _interactive_1gwvj_36"
          data-kind="primary"
@@ -217,89 +266,6 @@ exports[`<RoomSummaryCard /> has button to edit topic 1`] = `
            />
          </svg>
        </button>
-        <button
-          class="_item_1gwvj_17 _interactive_1gwvj_36"
-          data-kind="primary"
-          role="menuitem"
-        >
-          <svg
-            aria-hidden="true"
-            class="_icon_1gwvj_44"
-            fill="currentColor"
-            height="24"
-            viewBox="0 0 24 24"
-            width="24"
-            xmlns="http://www.w3.org/2000/svg"
-          >
-            <path
-              d="M16 12a4 4 0 1 1-8 0 4 4 0 0 1 8 0Zm-2 0a2 2 0 1 0-4 0 2 2 0 0 0 4 0Z"
-            />
-            <path
-              d="M11.312 2h1.376A2.312 2.312 0 0 1 15 4.312v.247l.002.003c.01.014.031.033.064.047.03.013.056.013.07.01h.002l.177-.177a2.312 2.312 0 0 1 3.27 0l.973.974a2.312 2.312 0 0 1 0 3.269l-.177.177v.003a.134.134 0 0 0 .01.07.153.153 0 0 0 .047.063l.003.002h.247A2.312 2.312 0 0 1 22 11.312v1.376A2.312 2.312 0 0 1 19.688 15h-.247l-.003.002a.152.152 0 0 0-.047.064.134.134 0 0 0-.01.07v.002l.177.177a2.312 2.312 0 0 1 0 3.27l-.974.973a2.312 2.312 0 0 1-3.269 0l-.177-.177h-.003a.134.134 0 0 0-.07.01.152.152 0 0 0-.063.047l-.002.003v.247A2.312 2.312 0 0 1 12.688 22h-1.376A2.312 2.312 0 0 1 9 19.688v-.247l-.002-.003a.153.153 0 0 0-.064-.047.134.134 0 0 0-.07-.01h-.002l-.177.177a2.312 2.312 0 0 1-3.27 0l-.973-.974a2.312 2.312 0 0 1 0-3.269l.177-.177v-.003a.135.135 0 0 0-.01-.07.152.152 0 0 0-.047-.063L4.559 15h-.247A2.312 2.312 0 0 1 2 12.688v-1.376A2.312 2.312 0 0 1 4.312 9h.247l.003-.002a.153.153 0 0 0 .047-.064.135.135 0 0 0 .01-.07v-.002l-.177-.177a2.312 2.312 0 0 1 0-3.27l.974-.973a2.312 2.312 0 0 1 3.269 0l.177.177h.003a.135.135 0 0 0 .07-.01.153.153 0 0 0 .063-.047L9 4.559v-.247A2.312 2.312 0 0 1 11.312 2ZM11 4.312v.257c0 .893-.59 1.593-1.299 1.887-.716.297-1.622.21-2.248-.418l-.182-.182a.312.312 0 0 0-.441 0l-.974.974a.312.312 0 0 0 0 .44l.182.183c.627.626.715 1.531.418 2.248C6.162 10.41 5.462 11 4.569 11h-.257a.312.312 0 0 0-.312.312v1.376c0 .172.14.312.312.312h.257c.893 0 1.593.59 1.887 1.299.297.716.21 1.622-.418 2.248l-.182.182a.312.312 0 0 0 0 .441l.974.973a.31.31 0 0 0 .44 0l.183-.181c.626-.627 1.532-.715 2.248-.418.709.294 1.299.994 1.299 1.887v.257c0 .172.14.312.312.312h1.376c.172 0 .312-.14.312-.312v-.257c0-.893.59-1.593 1.299-1.887.716-.297 1.622-.21 2.248.418l.182.181c.122.122.32.122.441 0l.973-.973a.312.312 0 0 0 0-.44l-.181-.183c-.627-.627-.715-1.532-.418-2.248.294-.709.994-1.299 1.887-1.299h.257c.172 0 .312-.14.312-.312v-1.376a.312.312 0 0 0-.312-.312h-.257c-.893 0-1.593-.59-1.887-1.299-.297-.717-.21-1.622.418-2.248l.181-.182a.312.312 0 0 0 0-.441l-.973-.974a.312.312 0 0 0-.44 0l-.183.182c-.627.627-1.532.715-2.248.418C13.59 6.162 13 5.462 13 4.569v-.257A.312.312 0 0 0 12.688 4h-1.376a.312.312 0 0 0-.312.312Z"
-            />
-          </svg>
-          <span
-            class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_1gwvj_53"
-          >
-            Settings
-          </span>
-          <svg
-            aria-hidden="true"
-            class="_nav-hint_1gwvj_60"
-            fill="currentColor"
-            height="24"
-            viewBox="8 0 8 24"
-            width="8"
-            xmlns="http://www.w3.org/2000/svg"
-          >
-            <path
-              d="M8.7 17.3a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7l3.9-3.9-3.9-3.9a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7.948.948 0 0 1 .7-.275.95.95 0 0 1 .7.275l4.6 4.6c.1.1.17.208.213.325.041.117.062.242.062.375s-.02.258-.063.375a.876.876 0 0 1-.212.325l-4.6 4.6a.948.948 0 0 1-.7.275.948.948 0 0 1-.7-.275Z"
-            />
-          </svg>
-        </button>
-        <div
-          class="_separator_144s5_17"
-          data-kind="primary"
-          data-orientation="horizontal"
-          role="separator"
-        />
-        <button
-          class="_item_1gwvj_17 _interactive_1gwvj_36"
-          data-kind="primary"
-          role="menuitem"
-        >
-          <svg
-            aria-hidden="true"
-            class="_icon_1gwvj_44"
-            fill="currentColor"
-            height="24"
-            viewBox="0 0 24 24"
-            width="24"
-            xmlns="http://www.w3.org/2000/svg"
-          >
-            <path
-              d="M6 22c-.55 0-1.02-.196-1.412-.587A1.926 1.926 0 0 1 4 20V4c0-.55.196-1.02.588-1.413A1.926 1.926 0 0 1 6 2h7.175a1.975 1.975 0 0 1 1.4.575l4.85 4.85a1.975 1.975 0 0 1 .575 1.4V20c0 .55-.196 1.02-.587 1.413A1.926 1.926 0 0 1 18 22H6Zm7-14V4H6v16h12V9h-4a.968.968 0 0 1-.713-.287A.967.967 0 0 1 13 8Z"
-            />
-          </svg>
-          <span
-            class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_1gwvj_53"
-          >
-            Files
-          </span>
-          <svg
-            aria-hidden="true"
-            class="_nav-hint_1gwvj_60"
-            fill="currentColor"
-            height="24"
-            viewBox="8 0 8 24"
-            width="8"
-            xmlns="http://www.w3.org/2000/svg"
-          >
-            <path
-              d="M8.7 17.3a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7l3.9-3.9-3.9-3.9a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7.948.948 0 0 1 .7-.275.95.95 0 0 1 .7.275l4.6 4.6c.1.1.17.208.213.325.041.117.062.242.062.375s-.02.258-.063.375a.876.876 0 0 1-.212.325l-4.6 4.6a.948.948 0 0 1-.7.275.948.948 0 0 1-.7-.275Z"
-            />
-          </svg>
-        </button>
        <button
          class="_item_1gwvj_17 _interactive_1gwvj_36"
          data-kind="primary"
@@ -321,7 +287,7 @@ exports[`<RoomSummaryCard /> has button to edit topic 1`] = `
          <span
            class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_1gwvj_53"
          >
-            Poll history
+            Polls
          </span>
          <svg
            aria-hidden="true"
@@ -367,6 +333,46 @@ exports[`<RoomSummaryCard /> has button to edit topic 1`] = `
            />
          </svg>
        </button>
+        <button
+          class="_item_1gwvj_17 _interactive_1gwvj_36"
+          data-kind="primary"
+          role="menuitem"
+        >
+          <svg
+            aria-hidden="true"
+            class="_icon_1gwvj_44"
+            fill="currentColor"
+            height="24"
+            viewBox="0 0 24 24"
+            width="24"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <path
+              d="M16 12a4 4 0 1 1-8 0 4 4 0 0 1 8 0Zm-2 0a2 2 0 1 0-4 0 2 2 0 0 0 4 0Z"
+            />
+            <path
+              d="M11.312 2h1.376A2.312 2.312 0 0 1 15 4.312v.247l.002.003c.01.014.031.033.064.047.03.013.056.013.07.01h.002l.177-.177a2.312 2.312 0 0 1 3.27 0l.973.974a2.312 2.312 0 0 1 0 3.269l-.177.177v.003a.134.134 0 0 0 .01.07.153.153 0 0 0 .047.063l.003.002h.247A2.312 2.312 0 0 1 22 11.312v1.376A2.312 2.312 0 0 1 19.688 15h-.247l-.003.002a.152.152 0 0 0-.047.064.134.134 0 0 0-.01.07v.002l.177.177a2.312 2.312 0 0 1 0 3.27l-.974.973a2.312 2.312 0 0 1-3.269 0l-.177-.177h-.003a.134.134 0 0 0-.07.01.152.152 0 0 0-.063.047l-.002.003v.247A2.312 2.312 0 0 1 12.688 22h-1.376A2.312 2.312 0 0 1 9 19.688v-.247l-.002-.003a.153.153 0 0 0-.064-.047.134.134 0 0 0-.07-.01h-.002l-.177.177a2.312 2.312 0 0 1-3.27 0l-.973-.974a2.312 2.312 0 0 1 0-3.269l.177-.177v-.003a.135.135 0 0 0-.01-.07.152.152 0 0 0-.047-.063L4.559 15h-.247A2.312 2.312 0 0 1 2 12.688v-1.376A2.312 2.312 0 0 1 4.312 9h.247l.003-.002a.153.153 0 0 0 .047-.064.135.135 0 0 0 .01-.07v-.002l-.177-.177a2.312 2.312 0 0 1 0-3.27l.974-.973a2.312 2.312 0 0 1 3.269 0l.177.177h.003a.135.135 0 0 0 .07-.01.153.153 0 0 0 .063-.047L9 4.559v-.247A2.312 2.312 0 0 1 11.312 2ZM11 4.312v.257c0 .893-.59 1.593-1.299 1.887-.716.297-1.622.21-2.248-.418l-.182-.182a.312.312 0 0 0-.441 0l-.974.974a.312.312 0 0 0 0 .44l.182.183c.627.626.715 1.531.418 2.248C6.162 10.41 5.462 11 4.569 11h-.257a.312.312 0 0 0-.312.312v1.376c0 .172.14.312.312.312h.257c.893 0 1.593.59 1.887 1.299.297.716.21 1.622-.418 2.248l-.182.182a.312.312 0 0 0 0 .441l.974.973a.31.31 0 0 0 .44 0l.183-.181c.626-.627 1.532-.715 2.248-.418.709.294 1.299.994 1.299 1.887v.257c0 .172.14.312.312.312h1.376c.172 0 .312-.14.312-.312v-.257c0-.893.59-1.593 1.299-1.887.716-.297 1.622-.21 2.248.418l.182.181c.122.122.32.122.441 0l.973-.973a.312.312 0 0 0 0-.44l-.181-.183c-.627-.627-.715-1.532-.418-2.248.294-.709.994-1.299 1.887-1.299h.257c.172 0 .312-.14.312-.312v-1.376a.312.312 0 0 0-.312-.312h-.257c-.893 0-1.593-.59-1.887-1.299-.297-.717-.21-1.622.418-2.248l.181-.182a.312.312 0 0 0 0-.441l-.973-.974a.312.312 0 0 0-.44 0l-.183.182c-.627.627-1.532.715-2.248.418C13.59 6.162 13 5.462 13 4.569v-.257A.312.312 0 0 0 12.688 4h-1.376a.312.312 0 0 0-.312.312Z"
+            />
+          </svg>
+          <span
+            class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_1gwvj_53"
+          >
+            Settings
+          </span>
+          <svg
+            aria-hidden="true"
+            class="_nav-hint_1gwvj_60"
+            fill="currentColor"
+            height="24"
+            viewBox="8 0 8 24"
+            width="8"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <path
+              d="M8.7 17.3a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7l3.9-3.9-3.9-3.9a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7.948.948 0 0 1 .7-.275.95.95 0 0 1 .7.275l4.6 4.6c.1.1.17.208.213.325.041.117.062.242.062.375s-.02.258-.063.375a.876.876 0 0 1-.212.325l-4.6 4.6a.948.948 0 0 1-.7.275.948.948 0 0 1-.7-.275Z"
+            />
+          </svg>
+        </button>
        <div
          class="_separator_144s5_17"
          data-kind="primary"
@@ -572,6 +578,55 @@ exports[`<RoomSummaryCard /> renders the room summary 1`] = `
            />
          </svg>
        </button>
+        <div
+          class="_separator_144s5_17"
+          data-kind="primary"
+          data-orientation="horizontal"
+          role="separator"
+        />
+        <button
+          class="_item_1gwvj_17 _interactive_1gwvj_36"
+          data-kind="primary"
+          role="menuitem"
+        >
+          <svg
+            aria-hidden="true"
+            class="_icon_1gwvj_44"
+            fill="currentColor"
+            height="24"
+            viewBox="0 0 24 24"
+            width="24"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <path
+              d="M6 22c-.55 0-1.02-.196-1.412-.587A1.926 1.926 0 0 1 4 20V4c0-.55.196-1.02.588-1.413A1.926 1.926 0 0 1 6 2h7.175a1.975 1.975 0 0 1 1.4.575l4.85 4.85a1.975 1.975 0 0 1 .575 1.4V20c0 .55-.196 1.02-.587 1.413A1.926 1.926 0 0 1 18 22H6Zm7-14V4H6v16h12V9h-4a.968.968 0 0 1-.713-.287A.967.967 0 0 1 13 8Z"
+            />
+          </svg>
+          <span
+            class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_1gwvj_53"
+          >
+            Files
+          </span>
+          <svg
+            aria-hidden="true"
+            class="_nav-hint_1gwvj_60"
+            fill="currentColor"
+            height="24"
+            viewBox="8 0 8 24"
+            width="8"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <path
+              d="M8.7 17.3a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7l3.9-3.9-3.9-3.9a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7.948.948 0 0 1 .7-.275.95.95 0 0 1 .7.275l4.6 4.6c.1.1.17.208.213.325.041.117.062.242.062.375s-.02.258-.063.375a.876.876 0 0 1-.212.325l-4.6 4.6a.948.948 0 0 1-.7.275.948.948 0 0 1-.7-.275Z"
+            />
+          </svg>
+        </button>
+        <div
+          class="_separator_144s5_17"
+          data-kind="primary"
+          data-orientation="horizontal"
+          role="separator"
+        />
        <button
          class="_item_1gwvj_17 _interactive_1gwvj_36"
          data-kind="primary"
@@ -609,89 +664,6 @@ exports[`<RoomSummaryCard /> renders the room summary 1`] = `
            />
          </svg>
        </button>
-        <button
-          class="_item_1gwvj_17 _interactive_1gwvj_36"
-          data-kind="primary"
-          role="menuitem"
-        >
-          <svg
-            aria-hidden="true"
-            class="_icon_1gwvj_44"
-            fill="currentColor"
-            height="24"
-            viewBox="0 0 24 24"
-            width="24"
-            xmlns="http://www.w3.org/2000/svg"
-          >
-            <path
-              d="M16 12a4 4 0 1 1-8 0 4 4 0 0 1 8 0Zm-2 0a2 2 0 1 0-4 0 2 2 0 0 0 4 0Z"
-            />
-            <path
-              d="M11.312 2h1.376A2.312 2.312 0 0 1 15 4.312v.247l.002.003c.01.014.031.033.064.047.03.013.056.013.07.01h.002l.177-.177a2.312 2.312 0 0 1 3.27 0l.973.974a2.312 2.312 0 0 1 0 3.269l-.177.177v.003a.134.134 0 0 0 .01.07.153.153 0 0 0 .047.063l.003.002h.247A2.312 2.312 0 0 1 22 11.312v1.376A2.312 2.312 0 0 1 19.688 15h-.247l-.003.002a.152.152 0 0 0-.047.064.134.134 0 0 0-.01.07v.002l.177.177a2.312 2.312 0 0 1 0 3.27l-.974.973a2.312 2.312 0 0 1-3.269 0l-.177-.177h-.003a.134.134 0 0 0-.07.01.152.152 0 0 0-.063.047l-.002.003v.247A2.312 2.312 0 0 1 12.688 22h-1.376A2.312 2.312 0 0 1 9 19.688v-.247l-.002-.003a.153.153 0 0 0-.064-.047.134.134 0 0 0-.07-.01h-.002l-.177.177a2.312 2.312 0 0 1-3.27 0l-.973-.974a2.312 2.312 0 0 1 0-3.269l.177-.177v-.003a.135.135 0 0 0-.01-.07.152.152 0 0 0-.047-.063L4.559 15h-.247A2.312 2.312 0 0 1 2 12.688v-1.376A2.312 2.312 0 0 1 4.312 9h.247l.003-.002a.153.153 0 0 0 .047-.064.135.135 0 0 0 .01-.07v-.002l-.177-.177a2.312 2.312 0 0 1 0-3.27l.974-.973a2.312 2.312 0 0 1 3.269 0l.177.177h.003a.135.135 0 0 0 .07-.01.153.153 0 0 0 .063-.047L9 4.559v-.247A2.312 2.312 0 0 1 11.312 2ZM11 4.312v.257c0 .893-.59 1.593-1.299 1.887-.716.297-1.622.21-2.248-.418l-.182-.182a.312.312 0 0 0-.441 0l-.974.974a.312.312 0 0 0 0 .44l.182.183c.627.626.715 1.531.418 2.248C6.162 10.41 5.462 11 4.569 11h-.257a.312.312 0 0 0-.312.312v1.376c0 .172.14.312.312.312h.257c.893 0 1.593.59 1.887 1.299.297.716.21 1.622-.418 2.248l-.182.182a.312.312 0 0 0 0 .441l.974.973a.31.31 0 0 0 .44 0l.183-.181c.626-.627 1.532-.715 2.248-.418.709.294 1.299.994 1.299 1.887v.257c0 .172.14.312.312.312h1.376c.172 0 .312-.14.312-.312v-.257c0-.893.59-1.593 1.299-1.887.716-.297 1.622-.21 2.248.418l.182.181c.122.122.32.122.441 0l.973-.973a.312.312 0 0 0 0-.44l-.181-.183c-.627-.627-.715-1.532-.418-2.248.294-.709.994-1.299 1.887-1.299h.257c.172 0 .312-.14.312-.312v-1.376a.312.312 0 0 0-.312-.312h-.257c-.893 0-1.593-.59-1.887-1.299-.297-.717-.21-1.622.418-2.248l.181-.182a.312.312 0 0 0 0-.441l-.973-.974a.312.312 0 0 0-.44 0l-.183.182c-.627.627-1.532.715-2.248.418C13.59 6.162 13 5.462 13 4.569v-.257A.312.312 0 0 0 12.688 4h-1.376a.312.312 0 0 0-.312.312Z"
-            />
-          </svg>
-          <span
-            class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_1gwvj_53"
-          >
-            Settings
-          </span>
-          <svg
-            aria-hidden="true"
-            class="_nav-hint_1gwvj_60"
-            fill="currentColor"
-            height="24"
-            viewBox="8 0 8 24"
-            width="8"
-            xmlns="http://www.w3.org/2000/svg"
-          >
-            <path
-              d="M8.7 17.3a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7l3.9-3.9-3.9-3.9a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7.948.948 0 0 1 .7-.275.95.95 0 0 1 .7.275l4.6 4.6c.1.1.17.208.213.325.041.117.062.242.062.375s-.02.258-.063.375a.876.876 0 0 1-.212.325l-4.6 4.6a.948.948 0 0 1-.7.275.948.948 0 0 1-.7-.275Z"
-            />
-          </svg>
-        </button>
-        <div
-          class="_separator_144s5_17"
-          data-kind="primary"
-          data-orientation="horizontal"
-          role="separator"
-        />
-        <button
-          class="_item_1gwvj_17 _interactive_1gwvj_36"
-          data-kind="primary"
-          role="menuitem"
-        >
-          <svg
-            aria-hidden="true"
-            class="_icon_1gwvj_44"
-            fill="currentColor"
-            height="24"
-            viewBox="0 0 24 24"
-            width="24"
-            xmlns="http://www.w3.org/2000/svg"
-          >
-            <path
-              d="M6 22c-.55 0-1.02-.196-1.412-.587A1.926 1.926 0 0 1 4 20V4c0-.55.196-1.02.588-1.413A1.926 1.926 0 0 1 6 2h7.175a1.975 1.975 0 0 1 1.4.575l4.85 4.85a1.975 1.975 0 0 1 .575 1.4V20c0 .55-.196 1.02-.587 1.413A1.926 1.926 0 0 1 18 22H6Zm7-14V4H6v16h12V9h-4a.968.968 0 0 1-.713-.287A.967.967 0 0 1 13 8Z"
-            />
-          </svg>
-          <span
-            class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_1gwvj_53"
-          >
-            Files
-          </span>
-          <svg
-            aria-hidden="true"
-            class="_nav-hint_1gwvj_60"
-            fill="currentColor"
-            height="24"
-            viewBox="8 0 8 24"
-            width="8"
-            xmlns="http://www.w3.org/2000/svg"
-          >
-            <path
-              d="M8.7 17.3a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7l3.9-3.9-3.9-3.9a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7.948.948 0 0 1 .7-.275.95.95 0 0 1 .7.275l4.6 4.6c.1.1.17.208.213.325.041.117.062.242.062.375s-.02.258-.063.375a.876.876 0 0 1-.212.325l-4.6 4.6a.948.948 0 0 1-.7.275.948.948 0 0 1-.7-.275Z"
-            />
-          </svg>
-        </button>
        <button
          class="_item_1gwvj_17 _interactive_1gwvj_36"
          data-kind="primary"
@@ -713,7 +685,7 @@ exports[`<RoomSummaryCard /> renders the room summary 1`] = `
          <span
            class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_1gwvj_53"
          >
-            Poll history
+            Polls
          </span>
          <svg
            aria-hidden="true"
@@ -759,6 +731,46 @@ exports[`<RoomSummaryCard /> renders the room summary 1`] = `
            />
          </svg>
        </button>
+        <button
+          class="_item_1gwvj_17 _interactive_1gwvj_36"
+          data-kind="primary"
+          role="menuitem"
+        >
+          <svg
+            aria-hidden="true"
+            class="_icon_1gwvj_44"
+            fill="currentColor"
+            height="24"
+            viewBox="0 0 24 24"
+            width="24"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <path
+              d="M16 12a4 4 0 1 1-8 0 4 4 0 0 1 8 0Zm-2 0a2 2 0 1 0-4 0 2 2 0 0 0 4 0Z"
+            />
+            <path
+              d="M11.312 2h1.376A2.312 2.312 0 0 1 15 4.312v.247l.002.003c.01.014.031.033.064.047.03.013.056.013.07.01h.002l.177-.177a2.312 2.312 0 0 1 3.27 0l.973.974a2.312 2.312 0 0 1 0 3.269l-.177.177v.003a.134.134 0 0 0 .01.07.153.153 0 0 0 .047.063l.003.002h.247A2.312 2.312 0 0 1 22 11.312v1.376A2.312 2.312 0 0 1 19.688 15h-.247l-.003.002a.152.152 0 0 0-.047.064.134.134 0 0 0-.01.07v.002l.177.177a2.312 2.312 0 0 1 0 3.27l-.974.973a2.312 2.312 0 0 1-3.269 0l-.177-.177h-.003a.134.134 0 0 0-.07.01.152.152 0 0 0-.063.047l-.002.003v.247A2.312 2.312 0 0 1 12.688 22h-1.376A2.312 2.312 0 0 1 9 19.688v-.247l-.002-.003a.153.153 0 0 0-.064-.047.134.134 0 0 0-.07-.01h-.002l-.177.177a2.312 2.312 0 0 1-3.27 0l-.973-.974a2.312 2.312 0 0 1 0-3.269l.177-.177v-.003a.135.135 0 0 0-.01-.07.152.152 0 0 0-.047-.063L4.559 15h-.247A2.312 2.312 0 0 1 2 12.688v-1.376A2.312 2.312 0 0 1 4.312 9h.247l.003-.002a.153.153 0 0 0 .047-.064.135.135 0 0 0 .01-.07v-.002l-.177-.177a2.312 2.312 0 0 1 0-3.27l.974-.973a2.312 2.312 0 0 1 3.269 0l.177.177h.003a.135.135 0 0 0 .07-.01.153.153 0 0 0 .063-.047L9 4.559v-.247A2.312 2.312 0 0 1 11.312 2ZM11 4.312v.257c0 .893-.59 1.593-1.299 1.887-.716.297-1.622.21-2.248-.418l-.182-.182a.312.312 0 0 0-.441 0l-.974.974a.312.312 0 0 0 0 .44l.182.183c.627.626.715 1.531.418 2.248C6.162 10.41 5.462 11 4.569 11h-.257a.312.312 0 0 0-.312.312v1.376c0 .172.14.312.312.312h.257c.893 0 1.593.59 1.887 1.299.297.716.21 1.622-.418 2.248l-.182.182a.312.312 0 0 0 0 .441l.974.973a.31.31 0 0 0 .44 0l.183-.181c.626-.627 1.532-.715 2.248-.418.709.294 1.299.994 1.299 1.887v.257c0 .172.14.312.312.312h1.376c.172 0 .312-.14.312-.312v-.257c0-.893.59-1.593 1.299-1.887.716-.297 1.622-.21 2.248.418l.182.181c.122.122.32.122.441 0l.973-.973a.312.312 0 0 0 0-.44l-.181-.183c-.627-.627-.715-1.532-.418-2.248.294-.709.994-1.299 1.887-1.299h.257c.172 0 .312-.14.312-.312v-1.376a.312.312 0 0 0-.312-.312h-.257c-.893 0-1.593-.59-1.887-1.299-.297-.717-.21-1.622.418-2.248l.181-.182a.312.312 0 0 0 0-.441l-.973-.974a.312.312 0 0 0-.44 0l-.183.182c-.627.627-1.532.715-2.248.418C13.59 6.162 13 5.462 13 4.569v-.257A.312.312 0 0 0 12.688 4h-1.376a.312.312 0 0 0-.312.312Z"
+            />
+          </svg>
+          <span
+            class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_1gwvj_53"
+          >
+            Settings
+          </span>
+          <svg
+            aria-hidden="true"
+            class="_nav-hint_1gwvj_60"
+            fill="currentColor"
+            height="24"
+            viewBox="8 0 8 24"
+            width="8"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <path
+              d="M8.7 17.3a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7l3.9-3.9-3.9-3.9a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7.948.948 0 0 1 .7-.275.95.95 0 0 1 .7.275l4.6 4.6c.1.1.17.208.213.325.041.117.062.242.062.375s-.02.258-.063.375a.876.876 0 0 1-.212.325l-4.6 4.6a.948.948 0 0 1-.7.275.948.948 0 0 1-.7-.275Z"
+            />
+          </svg>
+        </button>
        <div
          class="_separator_144s5_17"
          data-kind="primary"
@@ -991,6 +1003,55 @@ exports[`<RoomSummaryCard /> renders the room topic in the summary 1`] = `
            />
          </svg>
        </button>
+        <div
+          class="_separator_144s5_17"
+          data-kind="primary"
+          data-orientation="horizontal"
+          role="separator"
+        />
+        <button
+          class="_item_1gwvj_17 _interactive_1gwvj_36"
+          data-kind="primary"
+          role="menuitem"
+        >
+          <svg
+            aria-hidden="true"
+            class="_icon_1gwvj_44"
+            fill="currentColor"
+            height="24"
+            viewBox="0 0 24 24"
+            width="24"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <path
+              d="M6 22c-.55 0-1.02-.196-1.412-.587A1.926 1.926 0 0 1 4 20V4c0-.55.196-1.02.588-1.413A1.926 1.926 0 0 1 6 2h7.175a1.975 1.975 0 0 1 1.4.575l4.85 4.85a1.975 1.975 0 0 1 .575 1.4V20c0 .55-.196 1.02-.587 1.413A1.926 1.926 0 0 1 18 22H6Zm7-14V4H6v16h12V9h-4a.968.968 0 0 1-.713-.287A.967.967 0 0 1 13 8Z"
+            />
+          </svg>
+          <span
+            class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_1gwvj_53"
+          >
+            Files
+          </span>
+          <svg
+            aria-hidden="true"
+            class="_nav-hint_1gwvj_60"
+            fill="currentColor"
+            height="24"
+            viewBox="8 0 8 24"
+            width="8"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <path
+              d="M8.7 17.3a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7l3.9-3.9-3.9-3.9a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7.948.948 0 0 1 .7-.275.95.95 0 0 1 .7.275l4.6 4.6c.1.1.17.208.213.325.041.117.062.242.062.375s-.02.258-.063.375a.876.876 0 0 1-.212.325l-4.6 4.6a.948.948 0 0 1-.7.275.948.948 0 0 1-.7-.275Z"
+            />
+          </svg>
+        </button>
+        <div
+          class="_separator_144s5_17"
+          data-kind="primary"
+          data-orientation="horizontal"
+          role="separator"
+        />
        <button
          class="_item_1gwvj_17 _interactive_1gwvj_36"
          data-kind="primary"
@@ -1028,89 +1089,6 @@ exports[`<RoomSummaryCard /> renders the room topic in the summary 1`] = `
            />
          </svg>
        </button>
-        <button
-          class="_item_1gwvj_17 _interactive_1gwvj_36"
-          data-kind="primary"
-          role="menuitem"
-        >
-          <svg
-            aria-hidden="true"
-            class="_icon_1gwvj_44"
-            fill="currentColor"
-            height="24"
-            viewBox="0 0 24 24"
-            width="24"
-            xmlns="http://www.w3.org/2000/svg"
-          >
-            <path
-              d="M16 12a4 4 0 1 1-8 0 4 4 0 0 1 8 0Zm-2 0a2 2 0 1 0-4 0 2 2 0 0 0 4 0Z"
-            />
-            <path
-              d="M11.312 2h1.376A2.312 2.312 0 0 1 15 4.312v.247l.002.003c.01.014.031.033.064.047.03.013.056.013.07.01h.002l.177-.177a2.312 2.312 0 0 1 3.27 0l.973.974a2.312 2.312 0 0 1 0 3.269l-.177.177v.003a.134.134 0 0 0 .01.07.153.153 0 0 0 .047.063l.003.002h.247A2.312 2.312 0 0 1 22 11.312v1.376A2.312 2.312 0 0 1 19.688 15h-.247l-.003.002a.152.152 0 0 0-.047.064.134.134 0 0 0-.01.07v.002l.177.177a2.312 2.312 0 0 1 0 3.27l-.974.973a2.312 2.312 0 0 1-3.269 0l-.177-.177h-.003a.134.134 0 0 0-.07.01.152.152 0 0 0-.063.047l-.002.003v.247A2.312 2.312 0 0 1 12.688 22h-1.376A2.312 2.312 0 0 1 9 19.688v-.247l-.002-.003a.153.153 0 0 0-.064-.047.134.134 0 0 0-.07-.01h-.002l-.177.177a2.312 2.312 0 0 1-3.27 0l-.973-.974a2.312 2.312 0 0 1 0-3.269l.177-.177v-.003a.135.135 0 0 0-.01-.07.152.152 0 0 0-.047-.063L4.559 15h-.247A2.312 2.312 0 0 1 2 12.688v-1.376A2.312 2.312 0 0 1 4.312 9h.247l.003-.002a.153.153 0 0 0 .047-.064.135.135 0 0 0 .01-.07v-.002l-.177-.177a2.312 2.312 0 0 1 0-3.27l.974-.973a2.312 2.312 0 0 1 3.269 0l.177.177h.003a.135.135 0 0 0 .07-.01.153.153 0 0 0 .063-.047L9 4.559v-.247A2.312 2.312 0 0 1 11.312 2ZM11 4.312v.257c0 .893-.59 1.593-1.299 1.887-.716.297-1.622.21-2.248-.418l-.182-.182a.312.312 0 0 0-.441 0l-.974.974a.312.312 0 0 0 0 .44l.182.183c.627.626.715 1.531.418 2.248C6.162 10.41 5.462 11 4.569 11h-.257a.312.312 0 0 0-.312.312v1.376c0 .172.14.312.312.312h.257c.893 0 1.593.59 1.887 1.299.297.716.21 1.622-.418 2.248l-.182.182a.312.312 0 0 0 0 .441l.974.973a.31.31 0 0 0 .44 0l.183-.181c.626-.627 1.532-.715 2.248-.418.709.294 1.299.994 1.299 1.887v.257c0 .172.14.312.312.312h1.376c.172 0 .312-.14.312-.312v-.257c0-.893.59-1.593 1.299-1.887.716-.297 1.622-.21 2.248.418l.182.181c.122.122.32.122.441 0l.973-.973a.312.312 0 0 0 0-.44l-.181-.183c-.627-.627-.715-1.532-.418-2.248.294-.709.994-1.299 1.887-1.299h.257c.172 0 .312-.14.312-.312v-1.376a.312.312 0 0 0-.312-.312h-.257c-.893 0-1.593-.59-1.887-1.299-.297-.717-.21-1.622.418-2.248l.181-.182a.312.312 0 0 0 0-.441l-.973-.974a.312.312 0 0 0-.44 0l-.183.182c-.627.627-1.532.715-2.248.418C13.59 6.162 13 5.462 13 4.569v-.257A.312.312 0 0 0 12.688 4h-1.376a.312.312 0 0 0-.312.312Z"
-            />
-          </svg>
-          <span
-            class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_1gwvj_53"
-          >
-            Settings
-          </span>
-          <svg
-            aria-hidden="true"
-            class="_nav-hint_1gwvj_60"
-            fill="currentColor"
-            height="24"
-            viewBox="8 0 8 24"
-            width="8"
-            xmlns="http://www.w3.org/2000/svg"
-          >
-            <path
-              d="M8.7 17.3a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7l3.9-3.9-3.9-3.9a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7.948.948 0 0 1 .7-.275.95.95 0 0 1 .7.275l4.6 4.6c.1.1.17.208.213.325.041.117.062.242.062.375s-.02.258-.063.375a.876.876 0 0 1-.212.325l-4.6 4.6a.948.948 0 0 1-.7.275.948.948 0 0 1-.7-.275Z"
-            />
-          </svg>
-        </button>
-        <div
-          class="_separator_144s5_17"
-          data-kind="primary"
-          data-orientation="horizontal"
-          role="separator"
-        />
-        <button
-          class="_item_1gwvj_17 _interactive_1gwvj_36"
-          data-kind="primary"
-          role="menuitem"
-        >
-          <svg
-            aria-hidden="true"
-            class="_icon_1gwvj_44"
-            fill="currentColor"
-            height="24"
-            viewBox="0 0 24 24"
-            width="24"
-            xmlns="http://www.w3.org/2000/svg"
-          >
-            <path
-              d="M6 22c-.55 0-1.02-.196-1.412-.587A1.926 1.926 0 0 1 4 20V4c0-.55.196-1.02.588-1.413A1.926 1.926 0 0 1 6 2h7.175a1.975 1.975 0 0 1 1.4.575l4.85 4.85a1.975 1.975 0 0 1 .575 1.4V20c0 .55-.196 1.02-.587 1.413A1.926 1.926 0 0 1 18 22H6Zm7-14V4H6v16h12V9h-4a.968.968 0 0 1-.713-.287A.967.967 0 0 1 13 8Z"
-            />
-          </svg>
-          <span
-            class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_1gwvj_53"
-          >
-            Files
-          </span>
-          <svg
-            aria-hidden="true"
-            class="_nav-hint_1gwvj_60"
-            fill="currentColor"
-            height="24"
-            viewBox="8 0 8 24"
-            width="8"
-            xmlns="http://www.w3.org/2000/svg"
-          >
-            <path
-              d="M8.7 17.3a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7l3.9-3.9-3.9-3.9a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7.948.948 0 0 1 .7-.275.95.95 0 0 1 .7.275l4.6 4.6c.1.1.17.208.213.325.041.117.062.242.062.375s-.02.258-.063.375a.876.876 0 0 1-.212.325l-4.6 4.6a.948.948 0 0 1-.7.275.948.948 0 0 1-.7-.275Z"
-            />
-          </svg>
-        </button>
        <button
          class="_item_1gwvj_17 _interactive_1gwvj_36"
          data-kind="primary"
@@ -1132,7 +1110,7 @@ exports[`<RoomSummaryCard /> renders the room topic in the summary 1`] = `
          <span
            class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_1gwvj_53"
          >
-            Poll history
+            Polls
          </span>
          <svg
            aria-hidden="true"
@@ -1178,6 +1156,46 @@ exports[`<RoomSummaryCard /> renders the room topic in the summary 1`] = `
            />
          </svg>
        </button>
+        <button
+          class="_item_1gwvj_17 _interactive_1gwvj_36"
+          data-kind="primary"
+          role="menuitem"
+        >
+          <svg
+            aria-hidden="true"
+            class="_icon_1gwvj_44"
+            fill="currentColor"
+            height="24"
+            viewBox="0 0 24 24"
+            width="24"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <path
+              d="M16 12a4 4 0 1 1-8 0 4 4 0 0 1 8 0Zm-2 0a2 2 0 1 0-4 0 2 2 0 0 0 4 0Z"
+            />
+            <path
+              d="M11.312 2h1.376A2.312 2.312 0 0 1 15 4.312v.247l.002.003c.01.014.031.033.064.047.03.013.056.013.07.01h.002l.177-.177a2.312 2.312 0 0 1 3.27 0l.973.974a2.312 2.312 0 0 1 0 3.269l-.177.177v.003a.134.134 0 0 0 .01.07.153.153 0 0 0 .047.063l.003.002h.247A2.312 2.312 0 0 1 22 11.312v1.376A2.312 2.312 0 0 1 19.688 15h-.247l-.003.002a.152.152 0 0 0-.047.064.134.134 0 0 0-.01.07v.002l.177.177a2.312 2.312 0 0 1 0 3.27l-.974.973a2.312 2.312 0 0 1-3.269 0l-.177-.177h-.003a.134.134 0 0 0-.07.01.152.152 0 0 0-.063.047l-.002.003v.247A2.312 2.312 0 0 1 12.688 22h-1.376A2.312 2.312 0 0 1 9 19.688v-.247l-.002-.003a.153.153 0 0 0-.064-.047.134.134 0 0 0-.07-.01h-.002l-.177.177a2.312 2.312 0 0 1-3.27 0l-.973-.974a2.312 2.312 0 0 1 0-3.269l.177-.177v-.003a.135.135 0 0 0-.01-.07.152.152 0 0 0-.047-.063L4.559 15h-.247A2.312 2.312 0 0 1 2 12.688v-1.376A2.312 2.312 0 0 1 4.312 9h.247l.003-.002a.153.153 0 0 0 .047-.064.135.135 0 0 0 .01-.07v-.002l-.177-.177a2.312 2.312 0 0 1 0-3.27l.974-.973a2.312 2.312 0 0 1 3.269 0l.177.177h.003a.135.135 0 0 0 .07-.01.153.153 0 0 0 .063-.047L9 4.559v-.247A2.312 2.312 0 0 1 11.312 2ZM11 4.312v.257c0 .893-.59 1.593-1.299 1.887-.716.297-1.622.21-2.248-.418l-.182-.182a.312.312 0 0 0-.441 0l-.974.974a.312.312 0 0 0 0 .44l.182.183c.627.626.715 1.531.418 2.248C6.162 10.41 5.462 11 4.569 11h-.257a.312.312 0 0 0-.312.312v1.376c0 .172.14.312.312.312h.257c.893 0 1.593.59 1.887 1.299.297.716.21 1.622-.418 2.248l-.182.182a.312.312 0 0 0 0 .441l.974.973a.31.31 0 0 0 .44 0l.183-.181c.626-.627 1.532-.715 2.248-.418.709.294 1.299.994 1.299 1.887v.257c0 .172.14.312.312.312h1.376c.172 0 .312-.14.312-.312v-.257c0-.893.59-1.593 1.299-1.887.716-.297 1.622-.21 2.248.418l.182.181c.122.122.32.122.441 0l.973-.973a.312.312 0 0 0 0-.44l-.181-.183c-.627-.627-.715-1.532-.418-2.248.294-.709.994-1.299 1.887-1.299h.257c.172 0 .312-.14.312-.312v-1.376a.312.312 0 0 0-.312-.312h-.257c-.893 0-1.593-.59-1.887-1.299-.297-.717-.21-1.622.418-2.248l.181-.182a.312.312 0 0 0 0-.441l-.973-.974a.312.312 0 0 0-.44 0l-.183.182c-.627.627-1.532.715-2.248.418C13.59 6.162 13 5.462 13 4.569v-.257A.312.312 0 0 0 12.688 4h-1.376a.312.312 0 0 0-.312.312Z"
+            />
+          </svg>
+          <span
+            class="_typography_yh5dq_162 _font-body-md-medium_yh5dq_69 _label_1gwvj_53"
+          >
+            Settings
+          </span>
+          <svg
+            aria-hidden="true"
+            class="_nav-hint_1gwvj_60"
+            fill="currentColor"
+            height="24"
+            viewBox="8 0 8 24"
+            width="8"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <path
+              d="M8.7 17.3a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7l3.9-3.9-3.9-3.9a.948.948 0 0 1-.275-.7.95.95 0 0 1 .275-.7.948.948 0 0 1 .7-.275.95.95 0 0 1 .7.275l4.6 4.6c.1.1.17.208.213.325.041.117.062.242.062.375s-.02.258-.063.375a.876.876 0 0 1-.212.325l-4.6 4.6a.948.948 0 0 1-.7.275.948.948 0 0 1-.7-.275Z"
+            />
+          </svg>
+        </button>
        <div
          class="_separator_144s5_17"
          data-kind="primary"
--- a/test/components/views/rooms/snapshots/RoomPreviewBar-test.tsx.snap
+++ b/test/components/views/rooms/snapshots/RoomPreviewBar-test.tsx.snap
@@ -264,12 +264,12 @@ exports[`<RoomPreviewBar /> with an invite with an invited email when client has
  </p>
  <p>
    <span>
+      Invited by 
      <span
        class="mx_RoomPreviewBar_inviter"
      >
        @inviter:test.com
      </span>
-       invited you
    </span>
  </p>
 </div>
@@ -321,19 +321,20 @@ exports[`<RoomPreviewBar /> with an invite without an invited email for a dm roo
    </span>
  </p>
  <p>
-    <span>
    <span>
      <span
        class="mx_RoomPreviewBar_inviter"
      >
        @inviter:test.com name
-        </span>
-         (
-        @inviter:test.com
-        )
      </span>
       wants to chat
    </span>
+    <br />
+    <span
+      class="mx_RoomPreviewBar_inviter_mxid"
+    >
+      @inviter:test.com
+    </span>
  </p>
 </div>
 `;
@@ -387,17 +388,18 @@ exports[`<RoomPreviewBar /> with an invite without an invited email for a non-dm
  </p>
  <p>
    <span>
-      <span>
+      Invited by 
      <span
        class="mx_RoomPreviewBar_inviter"
      >
        @inviter:test.com name
      </span>
-         (
-        @inviter:test.com
-        )
    </span>
-       invited you
+    <br />
+    <span
+      class="mx_RoomPreviewBar_inviter_mxid"
+    >
+      @inviter:test.com
    </span>
  </p>
 </div>