Revert "Fix/error message readability 291" (#316)

* Revert "Fix/error message readability 291 (#311)"

This reverts commit b73a3aa.

* revert #311 and keep only required changes

Signed-off-by: Agnivesh Chaubey <agniveshvapi@gmail.com>

---------

Signed-off-by: Agnivesh Chaubey <agniveshvapi@gmail.com>

Author: AgniveshChaubey

.changeset/fix-dagre-singleton.md

@@ -259,7 +259,7 @@ const MonacoEditor = () => {
         };
 
         const browser = createBrowser(schemaId, schemaDocument);
-        // @ts-expect-error browser type not fully compatible with getSchema signature
+        // @ts-expect-error
         const schema = await getSchema(schemaDocument.baseUri, browser);
 
         setCompiledSchema(await compile(schema));
@@ -316,45 +316,26 @@ const MonacoEditor = () => {
               <option value="yaml">YAML</option>
             </select>
           </div>
-
-          <PanelGroup direction="vertical">
-            <Panel defaultSize={90} minSize={50}>
-              <Editor
-                height="100%"
-                width="100%"
-                language={schemaFormat}
-                value={schemaText}
-                theme={theme === "light" ? "vs-light" : "vs-dark"}
-                options={{
-                  minimap: { enabled: false },
-                  occurrencesHighlight: "off",
-                }}
-                onChange={(value) => setSchemaText(value ?? "")}
-                onMount={handleEditorDidMount}
-              />
-            </Panel>
-
-            <PanelResizeHandle className="h-[1px] bg-[var(--resize-handle-color)]" />
-
-            <Panel
-              defaultSize={10}
-              minSize={10}
-              maxSize={50}
-              className="bg-[var(--validation-bg-color)]"
-            >
-              <div className="flex-1 p-3 overflow-y-auto scrollbar-thin scrollbar-thumb-gray-500 scrollbar-track-transparent hover:scrollbar-thumb-gray-400">
-                <div
-                  className={`${
-                    VALIDATION_UI[schemaValidation.status].className
-                  } leading-relaxed whitespace-pre-wrap text-xs`}
-                >
-                  {schemaValidation.message}
-                </div>
-              </div>
-            </Panel>
-          </PanelGroup>
+          <Editor
+            height="87%"
+            width="100%"
+            language={schemaFormat}
+            value={schemaText}
+            theme={theme === "light" ? "vs-light" : "vs-dark"}
+            options={{
+              minimap: { enabled: false },
+              occurrencesHighlight: "off",
+            }}
+            onChange={(value) => setSchemaText(value ?? "")}
+            onMount={handleEditorDidMount}
+          />
+          <div className="flex-1 p-2 bg-[var(--validation-bg-color)] text-sm overflow-y-auto">
+            <div className={VALIDATION_UI[schemaValidation.status].className}>
+              {schemaValidation.message}
+            </div>
+          </div>
         </Panel>
-        <PanelResizeHandle className="w-[1px] bg-[var(--resize-handle-color)] relative">
+        <PanelResizeHandle className="w-[1px] bg-gray-400 relative">
           <div>
             <EditorToggleButton
               className={"absolute top-2 left-2 z-1"}

.changeset/fix-error-readability.md

@@ -36,9 +36,6 @@
   --popup-header-text-color: #374151;
   --popup-close-btn-hover-color: #717479;
   --popup-backdrop-color: rgba(255, 255, 255, 0.1);
-
-  /* Resize Handle */
-  --resize-handle-color: #9ca3af80;
 }
 
 [data-theme="dark"] {
@@ -80,9 +77,6 @@
   --popup-header-text-color: #e0e0e0;
   --popup-close-btn-hover-color: #777575;
   --popup-backdrop-color: rgba(0, 0, 0, 0.5);
-
-  /* Resize Handle */
-  --resize-handle-color: #9ca3af80;
 }
 
 .monaco-highlight-line {