fix(editor): ♿️ Improve code editor readiness

baptisteArno · Feb 16, 2022 · daaa8a0 · daaa8a0 · vercel · Feb 16, 2022
1 parent d2ac13b
commit daaa8a0
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 3 deletions.
diff --git a/apps/builder/assets/styles/codeMirror.css b/apps/builder/assets/styles/codeMirror.css
@@ -1,6 +1,6 @@
 .cm-editor {
-  height: 100%;
   outline: 0px solid transparent !important;
+  height: 100%;
 }
 
 .cm-scroller {

diff --git a/apps/builder/components/shared/CodeEditor.tsx b/apps/builder/components/shared/CodeEditor.tsx
@@ -53,7 +53,7 @@ export const CodeEditor = ({
     if (!editorContainer.current) return
     const updateListenerExtension = EditorView.updateListener.of((update) => {
       if (update.docChanged && onChange)
-        setPlainTextValue(update.state.doc.toJSON().join(' '))
+        setPlainTextValue(update.state.doc.toJSON().join('\n'))
     })
     const extensions = [
       updateListenerExtension,
@@ -77,5 +77,12 @@ export const CodeEditor = ({
     return editor
   }
 
-  return <Box ref={editorContainer} data-testid="code-editor" {...props} />
+  return (
+    <Box
+      ref={editorContainer}
+      data-testid="code-editor"
+      h={isReadOnly ? 'auto' : '250px'}
+      {...props}
+    />
+  )
 }