Skip to content

Commit ba90f3a

Browse files
committed
Adds tooltip for compose menu button
1 parent a9993ae commit ba90f3a

File tree

4 files changed

+34
-27
lines changed

4 files changed

+34
-27
lines changed

src/components/views/rooms/RoomListPanel/RoomListHeaderView.tsx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -70,8 +70,9 @@ export function RoomListHeaderView(): JSX.Element {
7070
<ComposeMenu vm={vm} />
7171
) : (
7272
<IconButton
73-
aria-label={_t("action|start_chat")}
73+
aria-label={_t("action|new_conversation")}
7474
onClick={(e) => vm.createChatRoom(e.nativeEvent)}
75+
tooltip={_t("action|new_conversation")}
7576
>
7677
<ComposeIcon color="var(--cpd-color-icon-secondary)" />
7778
</IconButton>
@@ -163,7 +164,7 @@ function ComposeMenu({ vm }: ComposeMenuProps): JSX.Element {
163164
side="right"
164165
align="start"
165166
trigger={
166-
<IconButton aria-label={_t("action|add")}>
167+
<IconButton aria-label={_t("action|new_conversation")} tooltip={_t("action|new_conversation")}>
167168
<ComposeIcon color="var(--cpd-color-icon-secondary)" />
168169
</IconButton>
169170
}

src/i18n/strings/en_EN.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -93,6 +93,7 @@
9393
"maximise": "Maximise",
9494
"mention": "Mention",
9595
"minimise": "Minimise",
96+
"new_conversation": "New conversation",
9697
"new_room": "New room",
9798
"new_video_room": "New video room",
9899
"next": "Next",

test/unit-tests/components/views/rooms/RoomListPanel/RoomListHeaderView-test.tsx

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -57,7 +57,7 @@ describe("<RoomListHeaderView />", () => {
5757
mocked(useRoomListHeaderViewModel).mockReturnValue(defaultValue);
5858

5959
const { asFragment } = render(<RoomListHeaderView />);
60-
expect(screen.queryByRole("button", { name: "Add" })).toBeInTheDocument();
60+
expect(screen.queryByRole("button", { name: "New conversation" })).toBeInTheDocument();
6161
expect(asFragment()).toMatchSnapshot();
6262
});
6363

@@ -66,18 +66,18 @@ describe("<RoomListHeaderView />", () => {
6666
mocked(useRoomListHeaderViewModel).mockReturnValue({ ...defaultValue, displayComposeMenu: false });
6767

6868
const { asFragment } = render(<RoomListHeaderView />);
69-
expect(screen.queryByRole("button", { name: "Add" })).toBeNull();
69+
expect(screen.queryByRole("button", { name: "New conversation" })).toBeInTheDocument();
7070
expect(asFragment()).toMatchSnapshot();
7171

72-
await user.click(screen.getByRole("button", { name: "Start chat" }));
72+
await user.click(screen.getByRole("button", { name: "New conversation" }));
7373
expect(defaultValue.createChatRoom).toHaveBeenCalled();
7474
});
7575

7676
it("should display all the buttons when the menu is opened", async () => {
7777
const user = userEvent.setup();
7878
mocked(useRoomListHeaderViewModel).mockReturnValue(defaultValue);
7979
render(<RoomListHeaderView />);
80-
const openMenu = screen.getByRole("button", { name: "Add" });
80+
const openMenu = screen.getByRole("button", { name: "New conversation" });
8181
await user.click(openMenu);
8282

8383
await user.click(screen.getByRole("menuitem", { name: "Start chat" }));
@@ -101,7 +101,7 @@ describe("<RoomListHeaderView />", () => {
101101
});
102102

103103
render(<RoomListHeaderView />);
104-
await user.click(screen.getByRole("button", { name: "Add" }));
104+
await user.click(screen.getByRole("button", { name: "New conversation" }));
105105

106106
expect(screen.queryByRole("menuitem", { name: "New room" })).toBeNull();
107107
expect(screen.queryByRole("menuitem", { name: "New video room" })).toBeNull();
@@ -157,7 +157,7 @@ describe("<RoomListHeaderView />", () => {
157157
});
158158

159159
render(<RoomListHeaderView />);
160-
await user.click(screen.getByRole("button", { name: "Add" }));
160+
await user.click(screen.getByRole("button", { name: "Open space menu" }));
161161

162162
expect(screen.queryByRole("menuitem", { name: "Invite" })).toBeNull();
163163
expect(screen.queryByRole("menuitem", { name: "Space Setting" })).toBeNull();

test/unit-tests/components/views/rooms/RoomListPanel/__snapshots__/RoomListHeaderView-test.tsx.snap

Lines changed: 24 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ exports[`<RoomListHeaderView /> compose menu should display the compose menu 1`]
2525
class="_icon-button_1pz9o_8 mx_SpaceMenu_button"
2626
data-kind="primary"
2727
data-state="closed"
28-
id="radix-_r_k_"
28+
id="radix-_r_q_"
2929
role="button"
3030
style="--cpd-icon-button-size: 20px;"
3131
tabindex="0"
@@ -63,11 +63,11 @@ exports[`<RoomListHeaderView /> compose menu should display the compose menu 1`]
6363
aria-expanded="false"
6464
aria-haspopup="menu"
6565
aria-label="Room Options"
66-
aria-labelledby="_r_s_"
66+
aria-labelledby="_r_12_"
6767
class="_icon-button_1pz9o_8"
6868
data-kind="primary"
6969
data-state="closed"
70-
id="radix-_r_q_"
70+
id="radix-_r_10_"
7171
role="button"
7272
style="--cpd-icon-button-size: 32px;"
7373
tabindex="0"
@@ -100,11 +100,12 @@ exports[`<RoomListHeaderView /> compose menu should display the compose menu 1`]
100100
aria-disabled="false"
101101
aria-expanded="false"
102102
aria-haspopup="menu"
103-
aria-label="Add"
103+
aria-label="New conversation"
104+
aria-labelledby="_r_1d_"
104105
class="_icon-button_1pz9o_8"
105106
data-kind="primary"
106107
data-state="closed"
107-
id="radix-_r_15_"
108+
id="radix-_r_1b_"
108109
role="button"
109110
style="--cpd-icon-button-size: 32px;"
110111
tabindex="0"
@@ -164,7 +165,7 @@ exports[`<RoomListHeaderView /> compose menu should not display the compose menu
164165
class="_icon-button_1pz9o_8 mx_SpaceMenu_button"
165166
data-kind="primary"
166167
data-state="closed"
167-
id="radix-_r_18_"
168+
id="radix-_r_1k_"
168169
role="button"
169170
style="--cpd-icon-button-size: 20px;"
170171
tabindex="0"
@@ -202,11 +203,11 @@ exports[`<RoomListHeaderView /> compose menu should not display the compose menu
202203
aria-expanded="false"
203204
aria-haspopup="menu"
204205
aria-label="Room Options"
205-
aria-labelledby="_r_1g_"
206+
aria-labelledby="_r_1s_"
206207
class="_icon-button_1pz9o_8"
207208
data-kind="primary"
208209
data-state="closed"
209-
id="radix-_r_1e_"
210+
id="radix-_r_1q_"
210211
role="button"
211212
style="--cpd-icon-button-size: 32px;"
212213
tabindex="0"
@@ -236,7 +237,8 @@ exports[`<RoomListHeaderView /> compose menu should not display the compose menu
236237
class="mx_RoomListHeaderView_ReleaseAnnouncementAnchor"
237238
>
238239
<button
239-
aria-label="Start chat"
240+
aria-label="New conversation"
241+
aria-labelledby="_r_25_"
240242
class="_icon-button_1pz9o_8"
241243
data-kind="primary"
242244
role="button"
@@ -372,7 +374,8 @@ exports[`<RoomListHeaderView /> should render 'room options' button 1`] = `
372374
aria-disabled="false"
373375
aria-expanded="false"
374376
aria-haspopup="menu"
375-
aria-label="Add"
377+
aria-label="New conversation"
378+
aria-labelledby="_r_j_"
376379
class="_icon-button_1pz9o_8"
377380
data-kind="primary"
378381
data-state="closed"
@@ -436,7 +439,7 @@ exports[`<RoomListHeaderView /> space menu should display the space menu 1`] = `
436439
class="_icon-button_1pz9o_8 mx_SpaceMenu_button"
437440
data-kind="primary"
438441
data-state="closed"
439-
id="radix-_r_3g_"
442+
id="radix-_r_4e_"
440443
role="button"
441444
style="--cpd-icon-button-size: 20px;"
442445
tabindex="0"
@@ -474,11 +477,11 @@ exports[`<RoomListHeaderView /> space menu should display the space menu 1`] = `
474477
aria-expanded="false"
475478
aria-haspopup="menu"
476479
aria-label="Room Options"
477-
aria-labelledby="_r_3o_"
480+
aria-labelledby="_r_4m_"
478481
class="_icon-button_1pz9o_8"
479482
data-kind="primary"
480483
data-state="closed"
481-
id="radix-_r_3m_"
484+
id="radix-_r_4k_"
482485
role="button"
483486
style="--cpd-icon-button-size: 32px;"
484487
tabindex="0"
@@ -511,11 +514,12 @@ exports[`<RoomListHeaderView /> space menu should display the space menu 1`] = `
511514
aria-disabled="false"
512515
aria-expanded="false"
513516
aria-haspopup="menu"
514-
aria-label="Add"
517+
aria-label="New conversation"
518+
aria-labelledby="_r_51_"
515519
class="_icon-button_1pz9o_8"
516520
data-kind="primary"
517521
data-state="closed"
518-
id="radix-_r_41_"
522+
id="radix-_r_4v_"
519523
role="button"
520524
style="--cpd-icon-button-size: 32px;"
521525
tabindex="0"
@@ -581,11 +585,11 @@ exports[`<RoomListHeaderView /> space menu should not display the space menu 1`]
581585
aria-expanded="false"
582586
aria-haspopup="menu"
583587
aria-label="Room Options"
584-
aria-labelledby="_r_4a_"
588+
aria-labelledby="_r_5e_"
585589
class="_icon-button_1pz9o_8"
586590
data-kind="primary"
587591
data-state="closed"
588-
id="radix-_r_48_"
592+
id="radix-_r_5c_"
589593
role="button"
590594
style="--cpd-icon-button-size: 32px;"
591595
tabindex="0"
@@ -618,11 +622,12 @@ exports[`<RoomListHeaderView /> space menu should not display the space menu 1`]
618622
aria-disabled="false"
619623
aria-expanded="false"
620624
aria-haspopup="menu"
621-
aria-label="Add"
625+
aria-label="New conversation"
626+
aria-labelledby="_r_5p_"
622627
class="_icon-button_1pz9o_8"
623628
data-kind="primary"
624629
data-state="closed"
625-
id="radix-_r_4j_"
630+
id="radix-_r_5n_"
626631
role="button"
627632
style="--cpd-icon-button-size: 32px;"
628633
tabindex="0"

0 commit comments

Comments
 (0)