autoscroll wip

web/src/components/editors/StandardEditor.jsx

@@ -9,28 +9,54 @@ export const StandardEditor = ({
   readOnly = false,
   language = 'xml',
   validationError = null,
-}) => (
-  <Card className="h-[calc(100vh-8rem)]">
-    <CardContent className="p-0 h-full">
-      {validationError && (
-        <Alert variant="destructive" className="m-4">
-          <AlertDescription>{validationError}</AlertDescription>
-        </Alert>
-      )}
-      <Editor
-        height="100%"
-        language={language}
-        value={content}
-        onChange={onChange}
-        options={{
-          minimap: { enabled: false },
-          lineNumbers: 'on',
-          readOnly,
-          fontSize: 14,
-          automaticLayout: true,
-          wordWrap: 'on',
-        }}
-      />
-    </CardContent>
-  </Card>
-);
+  autoScroll = false,
+}) => {
+  const editorRef = React.useRef(null);
+
+  const scrollToBottom = () => {
+    if (editorRef.current && autoScroll) {
+      const model = editorRef.current.getModel();
+      const lineCount = model.getLineCount();
+      editorRef.current.revealPositionInCenter({
+        lineNumber: lineCount,
+        column: 1
+      });
+    }
+  };
+
+  const handleEditorDidMount = (editor) => {
+    editorRef.current = editor;
+    scrollToBottom();
+  };
+
+  React.useEffect(() => {
+    scrollToBottom();
+  }, [content, autoScroll]);
+
+  return (
+    <Card className="h-[calc(100vh-8rem)]">
+      <CardContent className="p-0 h-full">
+        {validationError && (
+          <Alert variant="destructive" className="m-4">
+            <AlertDescription>{validationError}</AlertDescription>
+          </Alert>
+        )}
+        <Editor
+          height="100%"
+          language={language}
+          value={content}
+          onChange={onChange}
+          onMount={handleEditorDidMount}
+          options={{
+            minimap: { enabled: false },
+            lineNumbers: 'on',
+            readOnly,
+            fontSize: 14,
+            automaticLayout: true,
+            wordWrap: 'on',
+          }}
+        />
+      </CardContent>
+    </Card>
+  );
+};