fix: use callback hook in checkbox editor component to cache function

Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de>

frontend/src/extensions/extra-integrations/task-list/set-checkbox-in-cheatsheet.tsx

@@ -10,22 +10,29 @@ import type { TaskCheckedEventPayload } from './event-emitting-task-list-checkbo
 import { findCheckBox } from './find-check-box'
 import { TaskListCheckboxAppExtension } from './task-list-checkbox-app-extension'
 import type React from 'react'
+import { useCallback } from 'react'
 
 /**
  * Receives task-checkbox-change events and modify the current editor content.
  */
 export const SetCheckboxInCheatsheet: React.FC<CheatsheetExtensionComponentProps> = ({ setContent }) => {
-  useExtensionEventEmitterHandler(TaskListCheckboxAppExtension.EVENT_NAME, (event: TaskCheckedEventPayload) => {
+  useExtensionEventEmitterHandler(
-    setContent((previousContent) => {
+    TaskListCheckboxAppExtension.EVENT_NAME,
-      return findCheckBox(previousContent, event.lineInMarkdown)
+    useCallback(
-        .map(
+      (event: TaskCheckedEventPayload) => {
-          ([startIndex, endIndex]) =>
+        setContent((previousContent) =>
-            previousContent.slice(0, startIndex) +
+          findCheckBox(previousContent, event.lineInMarkdown)
-            createCheckboxContent(event.newCheckedState) +
+            .map(
-            previousContent.slice(endIndex)
+              ([startIndex, endIndex]) =>
+                previousContent.slice(0, startIndex) +
+                createCheckboxContent(event.newCheckedState) +
+                previousContent.slice(endIndex)
+            )
+            .orElse(previousContent)
         )
-        .orElse(previousContent)
+      },
-    })
+      [setContent]
-  })
+    )
+  )
   return null
 }