From 393bbd9a64d1b2248ce3e17dbde6f3485140f777 Mon Sep 17 00:00:00 2001
From: Cédric <42071178+BOTkirial@users.noreply.github.com>
Date: Sun, 2 Nov 2025 22:48:38 +0100
Subject: feat: Support inline toggling for todos. fixes #1931 (#1933)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* [1931] Can now chain the creation of todos from the quick add form

* [1931] Can now toggle todos from the masonry view + added a custom renderer for inputs of type checkbox (required to remove the readonly default attribute)

* handle nested lists and case

---------

Co-authored-by: Cédric <cedric.marinot@elosi.com>
Co-authored-by: Mohamed Bassem <me@mbassem.com>
---
 .../bookmarks/BookmarkMarkdownComponent.tsx        |  5 +++-
 .../components/dashboard/bookmarks/EditorCard.tsx  | 35 ++++++++++++++++++++++
 2 files changed, 39 insertions(+), 1 deletion(-)

(limited to 'apps/web/components/dashboard/bookmarks')

diff --git a/apps/web/components/dashboard/bookmarks/BookmarkMarkdownComponent.tsx b/apps/web/components/dashboard/bookmarks/BookmarkMarkdownComponent.tsx
index 82e483a9..e7fea2c3 100644
--- a/apps/web/components/dashboard/bookmarks/BookmarkMarkdownComponent.tsx
+++ b/apps/web/components/dashboard/bookmarks/BookmarkMarkdownComponent.tsx
@@ -33,10 +33,13 @@ export function BookmarkMarkdownComponent({
       text,
     });
   };
+
   return (
     <div className="h-full">
       {readOnly ? (
-        <MarkdownReadonly>{bookmark.content.text}</MarkdownReadonly>
+        <MarkdownReadonly onSave={onSave}>
+          {bookmark.content.text}
+        </MarkdownReadonly>
       ) : (
         <MarkdownEditor onSave={onSave} isSaving={isPending}>
           {bookmark.content.text}
diff --git a/apps/web/components/dashboard/bookmarks/EditorCard.tsx b/apps/web/components/dashboard/bookmarks/EditorCard.tsx
index 7ac1cade..b80cd889 100644
--- a/apps/web/components/dashboard/bookmarks/EditorCard.tsx
+++ b/apps/web/components/dashboard/bookmarks/EditorCard.tsx
@@ -172,6 +172,35 @@ export default function EditorCard({ className }: { className?: string }) {
     }
   };
 
+  /**
+   * Methods that triggers when "enter" is pressed (without ctrl)
+   * It checks if the current line is a todo
+   * if it is it automatically appends a todo a the start of the new line
+   */
+  const handleNewTodo = (e: React.KeyboardEvent<HTMLTextAreaElement>) => {
+    const todoMarkup = "- [ ] ";
+    const textarea = inputRef.current;
+    if (!textarea) return;
+    const start = textarea.selectionStart;
+    const end = textarea.selectionEnd;
+    const textBefore = textarea.value.slice(0, start);
+    const lines = textBefore.split("\n");
+    const currentLine = lines[lines.length - 1];
+    const currentLineIsTodo = currentLine.startsWith(todoMarkup);
+    if (!currentLineIsTodo) return;
+    e.preventDefault();
+    const newValue =
+      textarea.value.slice(0, start) +
+      "\n" +
+      todoMarkup +
+      textarea.value.slice(end);
+    form.setValue("text", newValue, { shouldDirty: true, shouldTouch: true });
+    textarea.value = newValue;
+    textarea.selectionStart = start + todoMarkup.length + 1;
+    textarea.selectionEnd = start + todoMarkup.length + 1;
+    textarea.dispatchEvent(new Event("input", { bubbles: true }));
+  };
+
   const OS = getOS();
 
   return (
@@ -205,6 +234,12 @@ export default function EditorCard({ className }: { className?: string }) {
                 if (demoMode) {
                   return;
                 }
+                if (
+                  e.key === "Enter" &&
+                  !(e.metaKey || e.ctrlKey || e.shiftKey)
+                ) {
+                  handleNewTodo(e);
+                }
                 if (e.key === "Enter" && (e.metaKey || e.ctrlKey)) {
                   form.handleSubmit(onSubmit, onError)();
                 }
-- 
cgit v1.2.3-70-g09d2