mirror of
https://github.com/vector-im/element-web.git
synced 2026-05-05 20:26:19 +02:00
Make the stories code more DRY
This commit is contained in:
parent
30d177f956
commit
9b1f118886
@ -73,23 +73,19 @@ const meta = {
|
||||
export default meta;
|
||||
type Story = StoryObj<typeof meta>;
|
||||
|
||||
// Closed state
|
||||
export const Default: Story = {
|
||||
args: {
|
||||
canMarkAsRead: false,
|
||||
canMarkAsUnread: true,
|
||||
isFavourite: false,
|
||||
isLowPriority: false,
|
||||
},
|
||||
// Reusable play function to open the menu
|
||||
const openMenu: Story["play"] = async ({ canvasElement }) => {
|
||||
const canvas = within(canvasElement);
|
||||
const trigger = canvas.getByRole("button", { name: "More Options" });
|
||||
await userEvent.click(trigger);
|
||||
};
|
||||
|
||||
// Closed state
|
||||
export const Default: Story = {};
|
||||
|
||||
// Open state - default (can mark as unread, favourite off, low priority off)
|
||||
export const Open: Story = {
|
||||
play: async ({ canvasElement }) => {
|
||||
const canvas = within(canvasElement);
|
||||
const trigger = canvas.getByRole("button", { name: "More Options" });
|
||||
await userEvent.click(trigger);
|
||||
},
|
||||
play: openMenu,
|
||||
};
|
||||
|
||||
// Open state - can mark as read (has unread messages)
|
||||
@ -98,11 +94,7 @@ export const OpenCanMarkAsRead: Story = {
|
||||
canMarkAsRead: true,
|
||||
canMarkAsUnread: false,
|
||||
},
|
||||
play: async ({ canvasElement }) => {
|
||||
const canvas = within(canvasElement);
|
||||
const trigger = canvas.getByRole("button", { name: "More Options" });
|
||||
await userEvent.click(trigger);
|
||||
},
|
||||
play: openMenu,
|
||||
};
|
||||
|
||||
// Open state - favourite enabled
|
||||
@ -110,11 +102,7 @@ export const OpenFavouriteOn: Story = {
|
||||
args: {
|
||||
isFavourite: true,
|
||||
},
|
||||
play: async ({ canvasElement }) => {
|
||||
const canvas = within(canvasElement);
|
||||
const trigger = canvas.getByRole("button", { name: "More Options" });
|
||||
await userEvent.click(trigger);
|
||||
},
|
||||
play: openMenu,
|
||||
};
|
||||
|
||||
// Open state - low priority enabled
|
||||
@ -122,11 +110,7 @@ export const OpenLowPriorityOn: Story = {
|
||||
args: {
|
||||
isLowPriority: true,
|
||||
},
|
||||
play: async ({ canvasElement }) => {
|
||||
const canvas = within(canvasElement);
|
||||
const trigger = canvas.getByRole("button", { name: "More Options" });
|
||||
await userEvent.click(trigger);
|
||||
},
|
||||
play: openMenu,
|
||||
};
|
||||
|
||||
// Open state - without invite option (DM or no permission)
|
||||
@ -134,11 +118,7 @@ export const OpenWithoutInvite: Story = {
|
||||
args: {
|
||||
canInvite: false,
|
||||
},
|
||||
play: async ({ canvasElement }) => {
|
||||
const canvas = within(canvasElement);
|
||||
const trigger = canvas.getByRole("button", { name: "More Options" });
|
||||
await userEvent.click(trigger);
|
||||
},
|
||||
play: openMenu,
|
||||
};
|
||||
|
||||
// Open state - without copy room link (DM room)
|
||||
@ -146,9 +126,5 @@ export const OpenWithoutCopyLink: Story = {
|
||||
args: {
|
||||
canCopyRoomLink: false,
|
||||
},
|
||||
play: async ({ canvasElement }) => {
|
||||
const canvas = within(canvasElement);
|
||||
const trigger = canvas.getByRole("button", { name: "More Options" });
|
||||
await userEvent.click(trigger);
|
||||
},
|
||||
play: openMenu,
|
||||
};
|
||||
|
||||
@ -73,12 +73,15 @@ const meta = {
|
||||
export default meta;
|
||||
type Story = StoryObj<typeof meta>;
|
||||
|
||||
export const Default: Story = {
|
||||
args: {
|
||||
roomNotifState: RoomNotifState.AllMessages,
|
||||
},
|
||||
// Reusable play function to open the menu
|
||||
const openMenu: Story["play"] = async ({ canvasElement }) => {
|
||||
const canvas = within(canvasElement);
|
||||
const trigger = canvas.getByRole("button", { name: "Notification options" });
|
||||
await userEvent.click(trigger);
|
||||
};
|
||||
|
||||
export const Default: Story = {};
|
||||
|
||||
export const Muted: Story = {
|
||||
args: {
|
||||
roomNotifState: RoomNotifState.Mute,
|
||||
@ -86,45 +89,26 @@ export const Muted: Story = {
|
||||
};
|
||||
|
||||
export const Open: Story = {
|
||||
args: {
|
||||
roomNotifState: RoomNotifState.AllMessages,
|
||||
},
|
||||
play: async ({ canvasElement }) => {
|
||||
const canvas = within(canvasElement);
|
||||
const trigger = canvas.getByRole("button", { name: "Notification options" });
|
||||
await userEvent.click(trigger);
|
||||
},
|
||||
play: openMenu,
|
||||
};
|
||||
|
||||
export const OpenMuted: Story = {
|
||||
args: {
|
||||
roomNotifState: RoomNotifState.Mute,
|
||||
},
|
||||
play: async ({ canvasElement }) => {
|
||||
const canvas = within(canvasElement);
|
||||
const trigger = canvas.getByRole("button", { name: "Notification options" });
|
||||
await userEvent.click(trigger);
|
||||
},
|
||||
play: openMenu,
|
||||
};
|
||||
|
||||
export const AllMessagesLoud: Story = {
|
||||
args: {
|
||||
roomNotifState: RoomNotifState.AllMessagesLoud,
|
||||
},
|
||||
play: async ({ canvasElement }) => {
|
||||
const canvas = within(canvasElement);
|
||||
const trigger = canvas.getByRole("button", { name: "Notification options" });
|
||||
await userEvent.click(trigger);
|
||||
},
|
||||
play: openMenu,
|
||||
};
|
||||
|
||||
export const MentionsOnly: Story = {
|
||||
args: {
|
||||
roomNotifState: RoomNotifState.MentionsOnly,
|
||||
},
|
||||
play: async ({ canvasElement }) => {
|
||||
const canvas = within(canvasElement);
|
||||
const trigger = canvas.getByRole("button", { name: "Notification options" });
|
||||
await userEvent.click(trigger);
|
||||
},
|
||||
play: openMenu,
|
||||
};
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user