From a55c8cd52bd7a8efb7ab24f2696bedf2c868aee2 Mon Sep 17 00:00:00 2001
From: Henry <30578846+hjball@users.noreply.github.com>
Date: Fri, 19 Dec 2025 21:40:24 +0000
Subject: [PATCH] fix: update checklist when pressing enter on edit (#292)

* fix: update checklist when pressing enter on edit

* feat: open new checklist item form on enter
---
 .../src/views/card/components/ChecklistItemRow.tsx    | 11 +++++++++--
 apps/web/src/views/card/components/Checklists.tsx     |  3 +++
 2 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/apps/web/src/views/card/components/ChecklistItemRow.tsx b/apps/web/src/views/card/components/ChecklistItemRow.tsx
index 60130be5..c8afa9c2 100644
--- a/apps/web/src/views/card/components/ChecklistItemRow.tsx
+++ b/apps/web/src/views/card/components/ChecklistItemRow.tsx
@@ -17,6 +17,7 @@ interface ChecklistItemRowProps {
     completed: boolean;
   };
   cardPublicId: string;
+  onCreateNewItem?: () => void;
   viewOnly?: boolean;
   dragHandleProps?: DraggableProvided["dragHandleProps"];
   isDragging?: boolean;
@@ -25,6 +26,7 @@ interface ChecklistItemRowProps {
 export default function ChecklistItemRow({
   item,
   cardPublicId,
+  onCreateNewItem,
   viewOnly = false,
   dragHandleProps,
   isDragging = false,
@@ -187,7 +189,10 @@ export default function ChecklistItemRow({
           disabled={viewOnly}
           onChange={(e) => setTitle(e.target.value)}
           // @ts-expect-error - valid event
-          onBlur={(e: Event) => commitTitle(e.target.innerHTML as string)}
+          onBlur={(e: Event) => {
+            const innerHTML = (e.target as HTMLElement).innerHTML;
+            commitTitle(innerHTML);
+          }}
           className={twMerge(
             "m-0 min-h-[20px] w-full p-0 text-sm leading-[20px] text-light-950 outline-none focus-visible:outline-none dark:text-dark-950",
             viewOnly && "cursor-default",
@@ -197,7 +202,9 @@ export default function ChecklistItemRow({
             if (viewOnly) return;
             if (e.key === "Enter") {
               e.preventDefault();
-              commitTitle(title);
+              const innerHTML = (e.currentTarget as HTMLElement).innerHTML;
+              commitTitle(innerHTML);
+              onCreateNewItem?.();
             }
             if (e.key === "Escape") {
               e.preventDefault();
diff --git a/apps/web/src/views/card/components/Checklists.tsx b/apps/web/src/views/card/components/Checklists.tsx
index 30e36d9d..71435f1a 100644
--- a/apps/web/src/views/card/components/Checklists.tsx
+++ b/apps/web/src/views/card/components/Checklists.tsx
@@ -210,6 +210,9 @@ export default function Checklists({
                                   completed: item.completed,
                                 }}
                                 cardPublicId={cardPublicId}
+                                onCreateNewItem={() =>
+                                  setActiveChecklistForm?.(checklist.publicId)
+                                }
                                 viewOnly={viewOnly}
                                 dragHandleProps={provided.dragHandleProps}
                                 isDragging={snapshot.isDragging}