From dc1d67fc5b3f9619f3de278e3ceac9429e57a968 Mon Sep 17 00:00:00 2001
From: Patrik Oldsberg <poldsberg@gmail.com>
Date: Sun, 24 Apr 2022 18:18:43 +0200
Subject: [PATCH] scaffolder: tweak TemplateEditor error panel

Signed-off-by: Patrik Oldsberg <poldsberg@gmail.com>
---
 .../TemplateEditorPage/TemplateEditor.tsx     | 20 ++++++++-----------
 1 file changed, 8 insertions(+), 12 deletions(-)

diff --git a/plugins/scaffolder/src/components/TemplateEditorPage/TemplateEditor.tsx b/plugins/scaffolder/src/components/TemplateEditorPage/TemplateEditor.tsx
index 169a245af9..fa5de7f7ea 100644
--- a/plugins/scaffolder/src/components/TemplateEditorPage/TemplateEditor.tsx
+++ b/plugins/scaffolder/src/components/TemplateEditorPage/TemplateEditor.tsx
@@ -222,14 +222,15 @@ function TemplateEditorTextArea(props: { errorText?: string }) {
   const classes = useStyles();
   const directoryEditor = useDirectoryEditor();
 
-  const errorPanel = useMemo(() => {
+  const panelExtension = useMemo(() => {
     if (!errorText) {
-      return undefined;
+      return showPanel.of(null);
     }
-    const div = document.createElement('div');
-    div.classList.add(classes.editorErrorPanel);
-    div.textContent = errorText;
-    return div;
+
+    const dom = document.createElement('div');
+    dom.classList.add(classes.editorErrorPanel);
+    dom.textContent = errorText;
+    return showPanel.of(() => ({ dom, bottom: true }));
   }, [classes, errorText]);
 
   useKeyboardEvent(
@@ -246,12 +247,7 @@ function TemplateEditorTextArea(props: { errorText?: string }) {
         className={classes.editorCodeMirror}
         theme="dark"
         height="100%"
-        extensions={[
-          StreamLanguage.define(yamlSupport),
-          ...(errorPanel
-            ? [showPanel.of(() => ({ dom: errorPanel, bottom: true }))]
-            : []),
-        ]}
+        extensions={[StreamLanguage.define(yamlSupport), panelExtension]}
         value={directoryEditor.selectedFile?.content}
         onChange={content =>
           directoryEditor.selectedFile?.updateContent(content)