feat: Add Tasks feature

README.md

@@ -16,6 +16,7 @@ Summon it with a hotkey. Jot. Dismiss. It stays out of your way until you need i
 - **Inline AI** — type `/ai <prompt>`, press enter, get the answer inserted directly into your note. No sidebar, no context switch.
 - **Auto-highlights hex colors, dates, and times** — `#D97757` renders as a color pill. `2024-05-31` gets highlighted. Useful at a glance.
 - **Interactive Checkboxes** — Type `/check` to create an interactive checkbox that strikes through text when clicked.
+- **Tasks & Reminders** — Type `/task` followed by `@ 1d2h` to set a due date. Press `Cmd+T` to open a unified Tasks view that tracks all your pending items and due times.
 - **Tags & folders** — `!tagname` for tags, `/` in note titles for folders. Simple conventions, no UI overhead.
 - **Graph view** — see how your notes connect (`Cmd+G`).
 
@@ -71,6 +72,7 @@ Built with Electron, React, TypeScript, and Vite.
 | `Cmd+Shift+N` | New note (global, configurable)          |
 | `Cmd+Shift+S` | Open settings panel                      |
 | `Cmd+N`       | New note (in-app)                        |
+| `Cmd+T`       | Open Tasks page                          |
 | `Cmd+K`       | Main action menu                         |
 | `Cmd+P`       | Search notes                             |
 | `Cmd+G`       | Graph view                               |

electron/main.ts

@@ -158,6 +158,27 @@
 
 When you open the search menu (\`Cmd+P\`), you'll see all your unique tags at the top. Click any tag to instantly filter your notes!
 
+Next: [Tasks](/file commands/tasks.md)
+
+[Back to Welcome](/file Welcome.md)
+`,
+)
+
+fs.writeFileSync(
+  path.join(COMMANDS_DIR, 'tasks.md'),
+  `# Tasks & Reminders
+
+Stay on top of your work by using tasks!
+
+Type \`/task\` to create a new task.
+If you want to set a deadline, just type \` @ \` followed by a time shorthand after the task.
+*Example use:*
+/task Buy groceries @ 2h
+
+PaperCache understands shorthands like \`2d\`, \`3h45m\`, \`tmrw\`, or even exact dates like \`2024-12-31 15:00\`.
+Once you set a task, press \`Cmd+T\` (or \`Ctrl+T\`) to open the Tasks Page and see everything that's due!
+Overdue tasks will automatically highlight in red.
+
 Next: [Ready](/file commands/ready.md)
 
 [Back to Welcome](/file Welcome.md)
@@ -178,7 +199,7 @@
 let shouldWriteWelcome = true
 if (fs.existsSync(welcomePath)) {
   const content = fs.readFileSync(welcomePath, 'utf-8')
-  if (content.includes('[6. Tags]')) {
+  if (content.includes('[7. Tasks]')) {
     shouldWriteWelcome = false
   }
 }
@@ -202,6 +223,7 @@
 - [4. Markdown & Code](/file commands/markdown.md)
 - [5. Formats & Colors](/file commands/formats.md)
 - [6. Tags](/file commands/tags.md)
+- [7. Tasks](/file commands/tasks.md)
 
 *(Press \`Cmd+K\` at any time to open the main menu!)*
 `,
@@ -233,7 +255,7 @@
       const state = JSON.parse(fs.readFileSync(STATE_FILE, 'utf-8'))
       return { ...state }
     }
   } catch (e) {
     // Ignore error
   }
   return { width: defaultWidth, height: defaultHeight, x: defaultX, y: defaultY }
@@ -247,7 +269,7 @@
         fs.mkdirSync(NOTES_DIR, { recursive: true })
       }
       fs.writeFileSync(STATE_FILE, JSON.stringify(bounds))
     } catch (e) {
       // Ignore error
     }
   }
@@ -312,6 +334,15 @@
   globalShortcut.unregisterAll()
 })
 
+app.on('web-contents-created', (event, contents) => {
+  contents.on('before-input-event', (e, input) => {
+    if ((input.control || input.meta) && input.key.toLowerCase() === 't') {
+      contents.send('trigger-tasks')
+      e.preventDefault()
+    }
+  })
+})
+
 app.whenReady().then(() => {
   createWindow()
 
@@ -365,7 +396,7 @@
           win.webContents.send('trigger-new-note')
         }
       })
     } catch (e) {}
   }
 
   const registerToggleShortcut = (combo: string) => {
@@ -374,7 +405,7 @@
         globalShortcut.unregister(combo)
       }
       globalShortcut.register(combo, toggleWindow)
     } catch (e) {}
   }
 
   ipcMain.on('update-global-shortcut', (event, { action, oldShortcut, newShortcut }) => {
@@ -387,7 +418,7 @@
       } else if (action === 'toggle') {
         registerToggleShortcut(newShortcut)
       }
     } catch (e) {}
   })
 
   app.on('activate', () => {

electron/preload.ts

@@ -1,4 +1,4 @@
 const { contextBridge, ipcRenderer } = require('electron')
 
 contextBridge.exposeInMainWorld('electronAPI', {
   closeWindow: () => ipcRenderer.invoke('close-window'),
@@ -22,4 +22,7 @@
   onTriggerNewNote: (callback: () => void) => {
     ipcRenderer.on('trigger-new-note', () => callback())
   },
+  onTriggerTasks: (callback: () => void) => {
+    ipcRenderer.on('trigger-tasks', () => callback())
+  },
 })

features.md

@@ -10,6 +10,7 @@ This document outlines every feature available in the PaperCache codebase, organ
 - **Color Format Recognition**: Automatically detects hex colors (e.g., `#D97757` or `#fff`) and renders a small inline preview color pill.
 - **Date & Time Formats**: Highlights standard date (`YYYY-MM-DD`) and time (`HH:MM` or `HH:MM:SS`) formats into clean, distinct pills.
 - **Interactive Checkboxes**: Type `/check` to create an interactive checkbox widget. Clicking it changes it to `/checked` and visually strikes through the text on that line!
+- **Tasks & Reminders**: Type `/task` to create a task widget. Add a space followed by `@` and a time (like `1d2h`, `tmrw`, or a specific date `YYYY-MM-DD HH:MM`) to set a due date. Press `Cmd+T` (or `Ctrl+T`) to open the Tasks Page, which tracks all tasks, calculates due times, and highlights overdue tasks in red.
 - **Customizable Theming & Fonts**: Customize fonts, text colors, background colors, background images, and individual highlight colors for variables, AI, and math. Supports full dark mode (`grid-dark`, `blueprint`) and custom zoom scaling.
 
 ## Math, Variables, and Calculations

src/App.css

@@ -657,3 +657,50 @@ body {
   text-decoration-color: #ff6b81;
   color: #ff6b81;
 }
+
+.cm-rem-widget {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 14px;
+  height: 14px;
+  border: 2px solid #7EB8D4; /* pale steel blue */
+  border-radius: 50%;
+  margin-right: 6px;
+  cursor: pointer;
+  vertical-align: middle;
+  color: transparent;
+  background-color: transparent;
+  transition: all 0.2s ease;
+  user-select: none;
+  margin-top: -2px;
+}
+
+.cm-rem-widget.cm-rem-checked {
+  background-color: #7EB8D4; /* fill color */
+  color: white; /* tick color */
+}
+
+.cm-rem-widget svg {
+  width: 12px;
+  height: 12px;
+}
+
+.cm-rem-checked-line-text {
+  text-decoration: line-through;
+  text-decoration-color: #7EB8D4;
+  color: #7EB8D4;
+  opacity: 0.6;
+}
+
+.cm-rem-line-text {
+  font-family: 'JetBrains Mono', 'Courier New', monospace;
+}
+
+.cm-rem-widget.cm-rem-overdue {
+  border-color: #FF3B30; /* Red */
+}
+
+.cm-overdue-line-text {
+  color: #FF3B30 !important;
+}