diff --git a/app/assets/javascripts/discourse/app/components/bookmark.js b/app/assets/javascripts/discourse/app/components/bookmark.js
index 0ede10b3c25..14997c5aad9 100644
--- a/app/assets/javascripts/discourse/app/components/bookmark.js
+++ b/app/assets/javascripts/discourse/app/components/bookmark.js
@@ -261,7 +261,11 @@ export default Component.extend({
     KeyboardShortcuts.unpause();
   },
 
-  showExistingReminderAt: notEmpty("model.reminderAt"),
+  @discourseComputed("model.reminderAt")
+  showExistingReminderAt(reminderAt) {
+    return reminderAt && Date.parse(reminderAt) > new Date().getTime();
+  },
+
   showDelete: notEmpty("model.id"),
   userHasTimezoneSet: notEmpty("userTimezone"),
   editingExistingBookmark: and("model", "model.id"),
diff --git a/app/assets/javascripts/discourse/tests/integration/components/bookmark-alert-test.js b/app/assets/javascripts/discourse/tests/integration/components/bookmark-alert-test.js
new file mode 100644
index 00000000000..f90e5415ab4
--- /dev/null
+++ b/app/assets/javascripts/discourse/tests/integration/components/bookmark-alert-test.js
@@ -0,0 +1,70 @@
+import { module, test } from "qunit";
+import { setupRenderingTest } from "discourse/tests/helpers/component-test";
+import { render } from "@ember/test-helpers";
+import { exists } from "discourse/tests/helpers/qunit-helpers";
+import { hbs } from "ember-cli-htmlbars";
+
+module("Integration | Component | bookmark-alert", function (hooks) {
+  setupRenderingTest(hooks);
+
+  hooks.beforeEach(function () {
+    this.setProperties({
+      model: {},
+      closeModal: () => {},
+      afterSave: () => {},
+      afterDelete: () => {},
+      registerOnCloseHandler: () => {},
+      onCloseWithoutSaving: () => {},
+    });
+  });
+
+  test("alert exists for reminder in the future", async function (assert) {
+    let name = "test";
+    let futureDate = new Date();
+    futureDate.setDate(futureDate.getDate() + 10);
+
+    let reminderAt = futureDate.toISOString();
+    this.model = { id: 1, name, reminderAt };
+
+    await render(hbs`
+      <Bookmark
+        @model={{this.model}}
+        @afterSave={{this.afterSave}}
+        @afterDelete={{this.afterDelete}}
+        @onCloseWithoutSaving={{this.onCloseWithoutSaving}}
+        @registerOnCloseHandler={{this.registerOnCloseHandler}}
+        @closeModal={{this.closeModal}}
+      />
+    `);
+
+    assert.ok(
+      exists(".existing-reminder-at-alert"),
+      "alert found for future reminder"
+    );
+  });
+
+  test("alert does not exist for reminder in the past", async function (assert) {
+    let name = "test";
+    let pastDate = new Date();
+    pastDate.setDate(pastDate.getDate() - 1);
+
+    let reminderAt = pastDate.toISOString();
+    this.model = { id: 1, name, reminderAt };
+
+    await render(hbs`
+      <Bookmark
+        @model={{this.model}}
+        @afterSave={{this.afterSave}}
+        @afterDelete={{this.afterDelete}}
+        @onCloseWithoutSaving={{this.onCloseWithoutSaving}}
+        @registerOnCloseHandler={{this.registerOnCloseHandler}}
+        @closeModal={{this.closeModal}}
+      />
+    `);
+
+    assert.ok(
+      !exists(".existing-reminder-at-alert"),
+      "alert not found for past reminder"
+    );
+  });
+});