diff --git a/apps/web/__e2e__/models/reminder-item.model.ts b/apps/web/__e2e__/models/reminder-item.model.ts index 8d0f30a76..f0ce606f3 100644 --- a/apps/web/__e2e__/models/reminder-item.model.ts +++ b/apps/web/__e2e__/models/reminder-item.model.ts @@ -22,7 +22,7 @@ import { Locator } from "@playwright/test"; import { getTestId } from "../utils"; import { BaseItemModel } from "./base-item.model"; import { ContextMenuModel } from "./context-menu.model"; -import { fillReminderDialog } from "./utils"; +import { confirmDialog, fillReminderDialog } from "./utils"; export class ReminderItemModel extends BaseItemModel { private readonly contextMenu: ContextMenuModel; @@ -47,6 +47,7 @@ export class ReminderItemModel extends BaseItemModel { await this.contextMenu.open(this.locator); await this.contextMenu.clickOnItem("delete"); + await confirmDialog(this.page); await this.waitFor("detached"); } diff --git a/apps/web/src/components/reminder/index.tsx b/apps/web/src/components/reminder/index.tsx index e9c556236..b63455c99 100644 --- a/apps/web/src/components/reminder/index.tsx +++ b/apps/web/src/components/reminder/index.tsx @@ -19,7 +19,7 @@ along with this program. If not, see . import React from "react"; import ListItem from "../list-item"; -import { Flex } from "@theme-ui/components"; +import { Flex, Text } from "@theme-ui/components"; import * as Icon from "../icons"; import IconTag from "../icon-tag"; import { @@ -31,7 +31,11 @@ import { hashNavigate } from "../../navigation"; import { Multiselect } from "../../common/multi-select"; import { store } from "../../stores/reminder-store"; import { db } from "../../common/db"; -import { showEditReminderDialog } from "../../common/dialog-controller"; +import { + confirm, + showEditReminderDialog +} from "../../common/dialog-controller"; +import { pluralize } from "../../utils/string"; const RECURRING_MODE_MAP = { week: "Weekly", @@ -154,7 +158,18 @@ const menuItems: { iconColor: "error", icon: Icon.Trash, onClick: async ({ items }) => { - await Multiselect.moveRemindersToTrash(items); + confirm({ + title: `Delete ${pluralize(items.length, "reminder", "reminders")}`, + message: ( + + Are you sure you want to proceed? + This action is IRREVERSIBLE. + + ), + yesText: "Yes", + noText: "No", + yesAction: () => Multiselect.moveRemindersToTrash(items) + }); }, multiSelect: true }