From 24ff87c30625432393ffedeada14478ebb625292 Mon Sep 17 00:00:00 2001
From: Mo <mo@standardnotes.com>
Date: Fri, 18 Nov 2022 20:54:03 -0600
Subject: [PATCH] fix: improved error reporting in super; improved draggable
 block icon padding

---
 packages/blocks-editor/src/Editor/BlocksEditor.tsx     | 10 ++++++++--
 .../src/Lexical/Plugins/DraggableBlockPlugin/index.tsx |  5 ++---
 packages/blocks-editor/src/Lexical/Utils/rect.ts       |  2 +-
 .../Components/NoteView/SuperEditor/SuperEditor.tsx    |  4 ++--
 4 files changed, 13 insertions(+), 8 deletions(-)

diff --git a/packages/blocks-editor/src/Editor/BlocksEditor.tsx b/packages/blocks-editor/src/Editor/BlocksEditor.tsx
index 994b4113d..66554ed7d 100644
--- a/packages/blocks-editor/src/Editor/BlocksEditor.tsx
+++ b/packages/blocks-editor/src/Editor/BlocksEditor.tsx
@@ -67,8 +67,14 @@ export const BlocksEditor: FunctionComponent<BlocksEditorProps> = ({
         });
         previewText = truncateString(previewText, previewLength);
 
-        const stringifiedEditorState = JSON.stringify(editorState.toJSON());
-        onChange(stringifiedEditorState, previewText);
+        try {
+          const stringifiedEditorState = JSON.stringify(editorState.toJSON());
+          onChange(stringifiedEditorState, previewText);
+        } catch (error) {
+          window.alert(
+            `An invalid change was made inside the Super editor. Your change was not saved. Please report this error to the team: ${error}`,
+          );
+        }
       });
     },
     [onChange, didIgnoreFirstChange],
diff --git a/packages/blocks-editor/src/Lexical/Plugins/DraggableBlockPlugin/index.tsx b/packages/blocks-editor/src/Lexical/Plugins/DraggableBlockPlugin/index.tsx
index 4ba980e1c..e38526bdf 100644
--- a/packages/blocks-editor/src/Lexical/Plugins/DraggableBlockPlugin/index.tsx
+++ b/packages/blocks-editor/src/Lexical/Plugins/DraggableBlockPlugin/index.tsx
@@ -25,12 +25,11 @@ import {isHTMLElement} from '../../Utils/guard';
 import {Point} from '../../Utils/point';
 import {Rect} from '../../Utils/rect';
 
-const SPACE = -16;
+const SPACE = 4;
 const TARGET_LINE_HALF_HEIGHT = 2;
 const DRAGGABLE_BLOCK_MENU_CLASSNAME = 'draggable-block-menu';
 const DRAG_DATA_FORMAT = 'application/x-lexical-drag-block';
 const TEXT_BOX_HORIZONTAL_PADDING = 28;
-const TARGET_LINE_SPACE_FROM_LEFT = 0;
 
 const Downward = 1;
 const Upward = -1;
@@ -181,7 +180,7 @@ function setTargetLine(
   }
 
   const top = lineTop - anchorTop - TARGET_LINE_HALF_HEIGHT;
-  const left = TARGET_LINE_SPACE_FROM_LEFT;
+  const left = TEXT_BOX_HORIZONTAL_PADDING - SPACE;
 
   targetLineElem.style.transform = `translate(${left}px, ${top}px)`;
   targetLineElem.style.width = `${
diff --git a/packages/blocks-editor/src/Lexical/Utils/rect.ts b/packages/blocks-editor/src/Lexical/Utils/rect.ts
index be118c35e..6b78cc575 100644
--- a/packages/blocks-editor/src/Lexical/Utils/rect.ts
+++ b/packages/blocks-editor/src/Lexical/Utils/rect.ts
@@ -7,7 +7,7 @@
  */
 import {isPoint, Point} from './point';
 
-type ContainsPointReturn = {
+export type ContainsPointReturn = {
   result: boolean;
   reason: {
     isOnTopSide: boolean;
diff --git a/packages/web/src/javascripts/Components/NoteView/SuperEditor/SuperEditor.tsx b/packages/web/src/javascripts/Components/NoteView/SuperEditor/SuperEditor.tsx
index e799f95ea..0f6a6c512 100644
--- a/packages/web/src/javascripts/Components/NoteView/SuperEditor/SuperEditor.tsx
+++ b/packages/web/src/javascripts/Components/NoteView/SuperEditor/SuperEditor.tsx
@@ -90,7 +90,7 @@ export const SuperEditor: FunctionComponent<Props> = ({
   }, [controller, controller.item.uuid])
 
   return (
-    <div className="relative h-full w-full px-5 py-4">
+    <div className="relative h-full w-full">
       <ErrorBoundary>
         <LinkingControllerProvider controller={linkingController}>
           <FilesControllerProvider controller={filesController}>
@@ -102,7 +102,7 @@ export const SuperEditor: FunctionComponent<Props> = ({
               <BlocksEditor
                 onChange={handleChange}
                 ignoreFirstChange={true}
-                className="relative h-full resize-none text-base focus:shadow-none focus:outline-none"
+                className="relative h-full resize-none px-5 py-4 text-base focus:shadow-none focus:outline-none"
                 previewLength={NotePreviewCharLimit}
                 spellcheck={spellcheck}
               >