Room list: edit or remove custom sections (#33283)
* feat(sc): add section menu to section header * feat(rls): add edit and remove sections * feat(dialog): add editing mode to CreateSectionDialog * feat(dialog): add remove section dialog * feat(vm): wire up vm and stores * test: update existing snapshots * test(e2e): add playwright tests to edit and remove a section * chore: fix remove section i18n key * fix: able to send empty sections * chore: update create section editing docs * chore: remove useless fallback * chore: add logs when section is unknown * feat: use different wording when removing an empty section * fix: only animate the chevron icon in the section header * fix: change dialog subtitle weight to medium
This commit is contained in:
@@ -196,6 +196,68 @@ test.describe("Room list custom sections", () => {
|
||||
});
|
||||
});
|
||||
|
||||
test.describe("Section editing", () => {
|
||||
test("should edit a custom section name via the section header menu", async ({ page, app }) => {
|
||||
await app.client.createRoom({ name: "my room" });
|
||||
await createCustomSection(page, "Work");
|
||||
|
||||
// Open the section header menu
|
||||
const sectionHeader = getSectionHeader(page, "Work");
|
||||
await sectionHeader.hover();
|
||||
await sectionHeader.getByRole("button", { name: "More options" }).click();
|
||||
|
||||
// Click "Edit section"
|
||||
await page.getByRole("menuitem", { name: "Edit section" }).click();
|
||||
|
||||
// The edit dialog should appear pre-filled with the current name
|
||||
const dialog = page.getByRole("dialog", { name: "Edit a section" });
|
||||
await expect(dialog).toBeVisible();
|
||||
await expect(dialog.getByRole("textbox", { name: "Section name" })).toHaveValue("Work");
|
||||
|
||||
// Change the name and confirm
|
||||
await dialog.getByRole("textbox", { name: "Section name" }).fill("Personal");
|
||||
await dialog.getByRole("button", { name: "Edit section" }).click();
|
||||
|
||||
// Dialog should close
|
||||
await expect(dialog).not.toBeVisible();
|
||||
|
||||
// Section should have the new name
|
||||
await expect(getSectionHeader(page, "Personal")).toBeVisible();
|
||||
await expect(getSectionHeader(page, "Work")).not.toBeVisible();
|
||||
});
|
||||
});
|
||||
|
||||
test.describe("Section removal", () => {
|
||||
test("should move rooms back to Chats when their section is removed", async ({ page, app }) => {
|
||||
await app.client.createRoom({ name: "my room" });
|
||||
await createCustomSection(page, "Work");
|
||||
await createCustomSection(page, "Personal");
|
||||
|
||||
const roomList = getRoomList(page);
|
||||
|
||||
// Move room to Work section
|
||||
const roomItem = roomList.getByRole("row", { name: "Open room my room" });
|
||||
await roomItem.hover();
|
||||
await roomItem.getByRole("button", { name: "More Options" }).click();
|
||||
await page.getByRole("menuitem", { name: "Move to" }).hover();
|
||||
await page.getByRole("menuitem", { name: "Work" }).click();
|
||||
await assertRoomInSection(page, "Work", "my room");
|
||||
|
||||
// Remove the Work section
|
||||
const sectionHeader = getSectionHeader(page, "Work");
|
||||
await sectionHeader.hover();
|
||||
await sectionHeader.getByRole("button", { name: "More options" }).click();
|
||||
await page.getByRole("menuitem", { name: "Remove section" }).click();
|
||||
const dialog = page.getByRole("dialog", { name: "Remove section?" });
|
||||
await dialog.getByRole("button", { name: "Remove section" }).click();
|
||||
|
||||
// Section should be gone
|
||||
await expect(getSectionHeader(page, "Work")).not.toBeVisible();
|
||||
// Room should now be in the Chats section
|
||||
await assertRoomInSection(page, "Chats", "my room");
|
||||
});
|
||||
});
|
||||
|
||||
test.describe("Adding a room to a custom section", () => {
|
||||
test("should add a room to a custom section via the More Options menu", async ({ page, app }) => {
|
||||
await app.client.createRoom({ name: "my room" });
|
||||
|
||||
Reference in New Issue
Block a user