Add tooltip for reminders circle icons

Author: jgclark

jgclark.Dashboard/CHANGELOG.md

@@ -12,6 +12,7 @@ For more details see the [plugin's documentation](https://github.com/NotePlan/pl
 - Can now click reminder item to open it in the Apple Reminders app (requires NP 3.21.2+ / build 1524).
 - fix: Adding a Reminder with blank date/time fields uses Unix epoch as the API stand-in for "no date" (matched by the Reminders mapper), instead of assigning today/now.
 - fix: Show the add-Reminder heading button in demo mode (was missing because demo data had no list options for the dialog).
+- fix: ⌘-hover on a reminder status icon now shows "Delete reminder" (and ⌘-click deletes), matching ctrl.
 
 ## [2.4.0.b49] 2026-07-13
 - New **Reminders** section (Apple Reminders), gated by feature flag **FFlag_Reminders**. Shows open reminders from the Apple Reminders lists that the user has selected in NotePlan's settings.

jgclark.Dashboard/src/react/components/ReminderItem.jsx

@@ -26,7 +26,7 @@ type Props = {
 
 /**
  * Reminder row. Content click opens in Apple Reminders when NP supports x-apple-reminderkit via openURL.
- * Status icon: click completes, ctrl deletes (Calendar API).
+ * Status icon: click completes; ⌘-click or ctrl-click deletes (Calendar API).
  * TODO(later): task-like dialog (edit title/details, reschedule, change list)
  */
 function ReminderItem({ item /*, thisSection */ }: Props): Node {

jgclark.Dashboard/src/react/components/StatusIcon.jsx

@@ -2,7 +2,7 @@
 //--------------------------------------------------------------------------
 // Dashboard React component to show the Icon before an item
 // Called by TaskItem component.
-// Last updated 2026-07-13 for v2.4.0.b49, @jgclark
+// Last updated 2026-07-14 for v2.4.0.b50, @jgclark
 //--------------------------------------------------------------------------
 import React, { useState, useEffect } from 'react'
 import type { Node } from 'react'
@@ -108,13 +108,9 @@ const StatusIcon = ({ item, respondToClicks, onIconClick, location, iconColor }:
         return metaKey ? 'cancelChecklist' : ctrlKey ? 'deleteItem' : 'completeChecklist'
       }
       case 'reminder': {
-        // Apple Reminders have no cancel state; click completes, ctrl deletes. Meta is ignored.
-        if (metaKey && !ctrlKey) {
-          logInfo(`StatusIcon`, `Clicked on reminder with metaKey -> no cancel action for reminders`)
-          return
-        }
-        setIconClassName(getClassNameFromType(ctrlKey ? 'deleted' : 'done'))
-        return ctrlKey ? 'deleteReminder' : 'completeReminder'
+        // ⌘ or ctrl deletes; plain click completes (no cancel for reminders)
+        setIconClassName(getClassNameFromType(metaKey || ctrlKey ? 'deleted' : 'done'))
+        return metaKey || ctrlKey ? 'deleteReminder' : 'completeReminder'
       }
       case 'project': {
         return 'showNoteInEditorFromFilename'
@@ -135,12 +131,11 @@ const StatusIcon = ({ item, respondToClicks, onIconClick, location, iconColor }:
     </div>
   )
 
-  // Note: trying TooltipOnKeyPress as a span item, and an equivalent empty one if there's no tooltip
-  // Reminders: no Cancel (meta); only Delete (ctrl)
+  // TEST: trying TooltipOnKeyPress as a span item, and an equivalent empty one if there's no tooltip
   return shouldShowTooltips ? (
     <TooltipOnKeyPress
-      ctrlKey={{ text: isReminder ? 'Delete Reminder' : 'Delete Item' }}
-      metaKey={isReminder ? undefined : { text: 'Cancel Item' }}
+      ctrlKey={{ text: isReminder ? 'Delete reminder' : 'Delete Item' }}
+      metaKey={{ text: isReminder ? 'Delete reminder' : 'Cancel Item' }}
       label={`${item.itemType}_${item.ID}_Icon`}
     >
       {renderedIcon}

jgclark.Dashboard/src/react/css/Dashboard.css

@@ -13,7 +13,7 @@ html {
 	/* Others that I have added */
 	--fg-HashtagColor: var(--hashtag-color);
 	--fg-MentionColor: var(--attag-color);
-	--fg-TimeBlockColor: #efba13;
+	--fg-TimeBlockColor: #DDA731;
 	--fg-RemindersColor: #8d9598;
 	--fg-WinsColor: var(--fg-ok-color);
 }