From 8f4a79c3a1e45dbfa012b7bc6c37309163e9f70a Mon Sep 17 00:00:00 2001
From: Ben Follington <5009316+bfollington@users.noreply.github.com>
Date: Thu, 18 Sep 2025 18:41:38 +1000
Subject: [PATCH] Re-enable `lineNumbers` in `chatbot-note.tsx` (#1798)

Also add mentions to `note.tsx`
---
 packages/patterns/chatbot-note.tsx | 20 +---------------
 packages/patterns/default-app.tsx  |  9 +++++--
 packages/patterns/note.tsx         | 38 +++++++++++++++++++++++++++---
 3 files changed, 43 insertions(+), 24 deletions(-)

diff --git a/packages/patterns/chatbot-note.tsx b/packages/patterns/chatbot-note.tsx
index 127bc2fed2..328007eafb 100644
--- a/packages/patterns/chatbot-note.tsx
+++ b/packages/patterns/chatbot-note.tsx
@@ -53,25 +53,6 @@ const handleCharmLinkClick = handler<
   return navigateTo(detail.charm);
 });
 
-export const Note = recipe<NoteInput>(
-  "Note",
-  ({ content, allCharms }) => {
-    return {
-      [NAME]: "Note",
-      [UI]: (
-        <ct-code-editor
-          $value={content}
-          $mentionable={allCharms}
-          onbacklink-click={handleCharmLinkClick({})}
-          language="text/markdown"
-          style="min-height: 400px;"
-        />
-      ),
-      content,
-    };
-  },
-);
-
 const handleCharmLinkClicked = handler(
   (_: any, { charm }: { charm: Cell<MentionableCharm> }) => {
     return navigateTo(charm);
@@ -222,6 +203,7 @@ export default recipe<LLMTestInput, LLMTestResult>(
                 language="text/markdown"
                 wordWrap
                 tabIndent
+                lineNumbers
               />
               <details>
                 <summary>Mentioned Charms</summary>
diff --git a/packages/patterns/default-app.tsx b/packages/patterns/default-app.tsx
index 0b11573ba4..49d460c3e8 100644
--- a/packages/patterns/default-app.tsx
+++ b/packages/patterns/default-app.tsx
@@ -116,11 +116,12 @@ const spawnChatbotNote = handler<
 
 const spawnNote = handler<
   Record<string, never>,
-  Record<string, never>
+  { allCharms: Cell<MentionableCharm[]> }
 >((_, state) => {
   return navigateTo(Note({
     title: "New Note",
     content: "",
+    allCharms: state.allCharms,
   }));
 });
 
@@ -161,7 +162,11 @@ export default recipe<CharmsListInput, CharmsListOutput>(
                 🤖 Chatbot Note
               </ct-button>
               <ct-button
-                onClick={spawnNote({})}
+                onClick={spawnNote({ // slight disagreement between Charm types but they are compatible
+                  allCharms: allCharms as unknown as OpaqueRef<
+                    MentionableCharm[]
+                  >,
+                })}
               >
                 📄 Note
               </ct-button>
diff --git a/packages/patterns/note.tsx b/packages/patterns/note.tsx
index 4796589211..cb604ff510 100644
--- a/packages/patterns/note.tsx
+++ b/packages/patterns/note.tsx
@@ -1,21 +1,33 @@
 /// <cts-enable />
 import {
   Cell,
+  cell,
   Default,
   h,
   handler,
   NAME,
+  navigateTo,
   recipe,
   toSchema,
   UI,
 } from "commontools";
 
+export type MentionableCharm = {
+  [NAME]: string;
+  content?: string;
+  mentioned?: MentionableCharm[];
+};
+
 type Input = {
   title: Default<string, "Untitled Note">;
   content: Default<string, "">;
+  allCharms: Cell<MentionableCharm[]>;
 };
 
-type Output = Input;
+type Output = {
+  mentioned: Default<Array<MentionableCharm>, []>;
+  content: Default<string, "">;
+};
 
 const updateTitle = handler<
   { detail: { value: string } },
@@ -35,9 +47,22 @@ const updateContent = handler<
   },
 );
 
+const handleCharmLinkClick = handler<
+  {
+    detail: {
+      charm: Cell<MentionableCharm>;
+    };
+  },
+  Record<string, never>
+>(({ detail }, _) => {
+  return navigateTo(detail.charm);
+});
+
 export default recipe<Input, Output>(
   "Note",
-  ({ title, content }) => {
+  ({ title, content, allCharms }) => {
+    const mentioned = cell<MentionableCharm[]>([]);
+
     return {
       [NAME]: title,
       [UI]: (
@@ -48,15 +73,22 @@ export default recipe<Input, Output>(
               placeholder="Enter title..."
             />
           </div>
+
           <ct-code-editor
             $value={content}
+            $mentionable={allCharms}
+            $mentioned={mentioned}
+            onbacklink-click={handleCharmLinkClick({})}
             language="text/markdown"
-            style="min-height: 400px;"
+            wordWrap
+            tabIndent
+            lineNumbers
           />
         </ct-screen>
       ),
       title,
       content,
+      mentioned,
     };
   },
 );