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
}