mbeditor 0.5.0 → 0.5.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 79b3c0567fff4f540eeca0a01d4f5133192e55b200b920808295c443b67d5f6a
-  data.tar.gz: 54f7fa3e433a9dbd34b17556fa0abfb244b220b4800af1997bea0be700955b22
+  metadata.gz: a6e34c84c4c7e3a0ef9d4382dd49c29ac3bd13fdc42f8b38d50666cdd30439b6
+  data.tar.gz: 07a9658a8d2faa837969d7c8b05556eaba59afeb48af63b9c8482d7693805b64
 SHA512:
-  metadata.gz: 1f2e2cec02b0019326c1e16e3659da31c9d6387fd84c8d38e0ca72be1ea007e22b4e5fc26512caa0a620f30ca589718e149bab210a1eeef17f349ba452289c1d
-  data.tar.gz: bd145f73f0df001904fa139a8365f9dae815c9ad391bc8bc77aaefd0cb64a6317f8c74f0d43bdabcbab6c5878a6cba7b0155219dceb0b57d038814bd96096864
+  metadata.gz: 4506a5f5c0e7d7c5b111f9e6cb665cf5d95b7a2e9be5c140948c49f3fbb3a7ee9c13e78d1924d891522131cb85d512242074202298172a10915ea57e6e48f71a
+  data.tar.gz: c7b06da62965639c18f0531a9459da9ddcfeb14ba29ecceadeb600aeec8eb28197657c3dcca4dec5311978fef1397dc610cc2d9f27ead2513ec2e768daceda62

data/CHANGELOG.md

@@ -5,6 +5,12 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [0.5.1] - 2026-04-30
+
+### Added
+- **Large file pagination** — files over 5 MB now open in read-only paginated mode (500 lines per page) instead of showing an error. A bar below the toolbar shows the current line range, total line count, and file size, with Prev/Next navigation. The backend streams only the requested line slice via `File.foreach` so arbitrarily large files never load fully into memory.
+- **JSON auto pretty-print** — `.json` files are automatically formatted with 2-space indentation when opened. Invalid JSON falls back to raw display with Monaco's built-in error markers. The formatted content is set as the editor baseline so the file does not appear dirty after opening.
+
 ## [0.5.0] - 2026-04-30
 
 ### Added

data/app/assets/javascripts/mbeditor/components/EditorPanel.js

@@ -86,6 +86,27 @@ var EditorPanel = function EditorPanel(_ref) {
 
   var methodsBtnRef = useRef(null);
 
+  // Local pagination state — initialized from tab props; updated on page navigation
+  var _useState17 = useState(tab.startLine || 0);
+  var _useState18 = _slicedToArray(_useState17, 2);
+  var pageStartLine = _useState18[0];
+  var setPageStartLine = _useState18[1];
+
+  var _useState19 = useState(tab.lineCount || 0);
+  var _useState20 = _slicedToArray(_useState19, 2);
+  var pageLineCount = _useState20[0];
+  var setPageLineCount = _useState20[1];
+
+  var _useState21 = useState(tab.totalLines || 0);
+  var _useState22 = _slicedToArray(_useState21, 2);
+  var pageTotalLines = _useState22[0];
+  var setPageTotalLines = _useState22[1];
+
+  var _useState23 = useState(tab.totalBytes || 0);
+  var _useState24 = _slicedToArray(_useState23, 2);
+  var pageTotalBytes = _useState24[0];
+  var setPageTotalBytes = _useState24[1];
+
   var onFormatRef = useRef(onFormat);
   onFormatRef.current = onFormat;
 
@@ -95,6 +116,12 @@ var EditorPanel = function EditorPanel(_ref) {
   var vimStatusRef = useRef(null);
   var vimModeObjRef = useRef(null);
 
+  function humanSize(bytes) {
+    if (bytes < 1024) return bytes + ' B';
+    if (bytes < 1024 * 1024) return (bytes / 1024).toFixed(1) + ' KB';
+    return (bytes / (1024 * 1024)).toFixed(1) + ' MB';
+  }
+
   var clearTestZones = function clearTestZones(editor) {
     if (!editor) return;
     if (testZoneIdsRef.current.length === 0) return;
@@ -488,7 +515,18 @@ var EditorPanel = function EditorPanel(_ref) {
     } else {
       // Evict the LRU model if the cache is at capacity before creating a new one.
       TabManager.evictLruModel();
-      modelObj = window.monaco.editor.createModel(tab.content, language);
+
+      // Pretty-print JSON content before initial load
+      var contentForModel = tab.content;
+      if (language === 'json' && contentForModel) {
+        try {
+          contentForModel = JSON.stringify(JSON.parse(contentForModel), null, 2);
+        } catch (_) {
+          // invalid JSON — use raw content; Monaco will show error markers
+        }
+      }
+
+      modelObj = window.monaco.editor.createModel(contentForModel, language);
       window.__mbeditorModels[tab.path] = { model: modelObj, aviBase: null, aviMax: null, lastAccessed: Date.now(), cleanVersionId: null };
       _modelEntry = window.__mbeditorModels[tab.path];
     }
@@ -578,6 +616,10 @@ var EditorPanel = function EditorPanel(_ref) {
 
     monacoRef.current = editor;
     window.__mbeditorActiveEditor = editor;
+    // Apply read-only for paginated (truncated) files
+    if (tab.truncated) {
+      editor.updateOptions({ readOnly: true });
+    }
     setEditorReady(true);
 
     // Stash the workspace-relative path on the model so code-action providers
@@ -768,7 +810,19 @@ var EditorPanel = function EditorPanel(_ref) {
       // fires during setValue and skips the dirty check (cleanVersionId is null).
       var _initEntry = window.__mbeditorModels && window.__mbeditorModels[tab.path];
       if (_initEntry) _initEntry.cleanVersionId = null;
-      editor.setValue(tab.content);
+
+      // Pretty-print JSON content before initial load
+      var contentToSet = tab.content;
+      var modelLang = model.getLanguageId();
+      if (modelLang === 'json' && contentToSet) {
+        try {
+          contentToSet = JSON.stringify(JSON.parse(contentToSet), null, 2);
+        } catch (_) {
+          // invalid JSON — use raw content; Monaco will show error markers
+        }
+      }
+
+      editor.setValue(contentToSet);
       // Reset the AVI baseline: setValue clears the undo stack so anything before
       // this point is no longer reachable. Also clear the canUndo/canRedo display.
       var newBase = model.getAlternativeVersionId();
@@ -917,6 +971,21 @@ var EditorPanel = function EditorPanel(_ref) {
     }
   }, [markers, tab.id]);
 
+  // Sync pagination state when tab changes (different file or fresh load)
+  useEffect(function () {
+    setPageStartLine(tab.startLine || 0);
+    setPageLineCount(tab.lineCount || 0);
+    setPageTotalLines(tab.totalLines || 0);
+    setPageTotalBytes(tab.totalBytes || 0);
+  }, [tab.id]);
+
+  // Apply read-only mode based on tab.truncated whenever the editor or truncated flag changes
+  useEffect(function () {
+    if (monacoRef.current) {
+      monacoRef.current.updateOptions({ readOnly: !!tab.truncated });
+    }
+  }, [tab.truncated, editorReady]);
+
   // Reset blame + test decorations when file path changes
   useEffect(function () {
     setBlameData(null);
@@ -1456,6 +1525,105 @@ var EditorPanel = function EditorPanel(_ref) {
         !editorPrefs.toolbarIconOnly && !testLoading && React.createElement('span', { className: 'ide-toolbar-label' }, 'Test')
       )
     ),
+    tab.truncated && React.createElement(
+      'div',
+      {
+        className: 'ide-pagination-bar',
+        style: {
+          display: 'flex',
+          alignItems: 'center',
+          gap: '8px',
+          padding: '4px 10px',
+          background: 'var(--ide-toolbar-bg, #252526)',
+          borderBottom: '1px solid var(--ide-border, #3e3e3e)',
+          fontSize: '12px',
+          color: 'var(--ide-toolbar-fg, #ccc)',
+          flexShrink: 0,
+          userSelect: 'none'
+        }
+      },
+      React.createElement(
+        'button',
+        {
+          className: 'ide-icon-btn',
+          style: { padding: '2px 8px', fontSize: '12px' },
+          disabled: pageStartLine === 0,
+          onClick: function() {
+            var newStart = Math.max(0, pageStartLine - 500);
+            FileService.getFileChunk(tab.path, newStart, 500).then(function(data) {
+              var sl = data.start_line || 0;
+              var lc = data.line_count || 0;
+              var tl = data.total_lines || pageTotalLines;
+              var tb = data.total_bytes || pageTotalBytes;
+              setPageStartLine(sl);
+              setPageLineCount(lc);
+              setPageTotalLines(tl);
+              setPageTotalBytes(tb);
+              if (monacoRef.current) {
+                monacoRef.current.setValue(data.content || '');
+                var _paginatedEntry = window.__mbeditorModels && window.__mbeditorModels[tab.path];
+                if (_paginatedEntry) {
+                  var _newBase = monacoRef.current.getModel().getAlternativeVersionId();
+                  aviBaseRef.current = _newBase;
+                  aviMaxRef.current  = _newBase;
+                  _paginatedEntry.cleanVersionId = _newBase;
+                  _paginatedEntry.aviBase = _newBase;
+                  _paginatedEntry.aviMax  = _newBase;
+                }
+                EditorStore.setState({ canUndo: false, canRedo: false });
+                monacoRef.current.updateOptions({ readOnly: true });
+              }
+            }).catch(function(err) {
+              EditorStore.setStatus('Failed to load page: ' + (err && err.message || 'Unknown error'), 'error');
+            });
+          }
+        },
+        '← Prev'
+      ),
+      React.createElement(
+        'span',
+        { style: { flex: 1, textAlign: 'center' } },
+        'Lines ' + (pageStartLine + 1) + '–' + (pageStartLine + pageLineCount) + ' of ' + pageTotalLines + ' (' + humanSize(pageTotalBytes) + ')'
+      ),
+      React.createElement(
+        'button',
+        {
+          className: 'ide-icon-btn',
+          style: { padding: '2px 8px', fontSize: '12px' },
+          disabled: pageStartLine + pageLineCount >= pageTotalLines,
+          onClick: function() {
+            var newStart = pageStartLine + pageLineCount;
+            FileService.getFileChunk(tab.path, newStart, 500).then(function(data) {
+              var sl = data.start_line || 0;
+              var lc = data.line_count || 0;
+              var tl = data.total_lines || pageTotalLines;
+              var tb = data.total_bytes || pageTotalBytes;
+              setPageStartLine(sl);
+              setPageLineCount(lc);
+              setPageTotalLines(tl);
+              setPageTotalBytes(tb);
+              if (monacoRef.current) {
+                monacoRef.current.setValue(data.content || '');
+                var _paginatedEntry = window.__mbeditorModels && window.__mbeditorModels[tab.path];
+                if (_paginatedEntry) {
+                  var _newBase = monacoRef.current.getModel().getAlternativeVersionId();
+                  aviBaseRef.current = _newBase;
+                  aviMaxRef.current  = _newBase;
+                  _paginatedEntry.cleanVersionId = _newBase;
+                  _paginatedEntry.aviBase = _newBase;
+                  _paginatedEntry.aviMax  = _newBase;
+                }
+                EditorStore.setState({ canUndo: false, canRedo: false });
+                monacoRef.current.updateOptions({ readOnly: true });
+              }
+            }).catch(function(err) {
+              EditorStore.setStatus('Failed to load page: ' + (err && err.message || 'Unknown error'), 'error');
+            });
+          }
+        },
+        'Next →'
+      )
+    ),
     React.createElement('div', { ref: editorRef, className: 'monaco-container', style: { flex: 1, minHeight: 0 } }),
     methodsOpen && methodsDropdownPos && React.createElement(
       'div',

data/app/assets/javascripts/mbeditor/editor_plugins.js

@@ -51,6 +51,33 @@
 
   var globalsRegistered = false;
 
+  // Enumerate window for user-defined (non-native) globals and return a TypeScript
+  // declaration string.  Sprockets exposes every top-level var/function as a window
+  // property before Monaco initialises, so scanning window at registration time
+  // captures components, services, and helpers without any manual listing.
+  function buildWindowGlobalsShim() {
+    var alreadyDeclared = { React: 1, ReactDOM: 1, PropTypes: 1, MaterialUI: 1 };
+    var lines = [];
+    try {
+      var keys = Object.keys(window);
+      for (var i = 0; i < keys.length; i++) {
+        var key = keys[i];
+        if (alreadyDeclared[key]) continue;
+        if (!/^[a-zA-Z_$][a-zA-Z0-9_$]*$/.test(key)) continue;
+        var value;
+        try { value = window[key]; } catch (e) { continue; }
+        if (value === null || value === undefined) continue;
+        if (typeof value === 'function') {
+          try {
+            if (/\[native code\]/.test(Function.prototype.toString.call(value))) continue;
+          } catch (e) { continue; }
+        }
+        lines.push('declare var ' + key + ': any;');
+      }
+    } catch (e) {}
+    return lines.join('\n');
+  }
+
   function leadingWhitespace(line) {
     var match = line.match(/^\s*/);
     return match ? match[0] : '';
@@ -455,6 +482,32 @@
       });
     }
 
+    // Declare globals that the sprockets asset pipeline injects at runtime so
+    // checkJs doesn't flag them as undefined.  `interface Window` augmentation
+    // covers `window.myAppGlobal` access patterns.  For app-specific component
+    // names not listed here, add `/* global MyComponent */` at the top of the
+    // file — TypeScript's checkJs mode respects that directive.
+    if (monaco.languages.typescript && monaco.languages.typescript.javascriptDefaults) {
+      monaco.languages.typescript.javascriptDefaults.addExtraLib(
+        [
+          'declare var React: any;',
+          'declare var ReactDOM: any;',
+          'declare var PropTypes: any;',
+          'declare var MaterialUI: any;',
+          'interface Window { [key: string]: any; }'
+        ].join('\n'),
+        'inmemory://mbeditor/sprockets-globals.d.ts'
+      );
+
+      var dynamicShim = buildWindowGlobalsShim();
+      if (dynamicShim) {
+        monaco.languages.typescript.javascriptDefaults.addExtraLib(
+          dynamicShim,
+          'inmemory://mbeditor/window-globals.d.ts'
+        );
+      }
+    }
+
     // TypeScript: enable JSX for .tsx files and catch unused locals.
     if (monaco.languages.typescript && monaco.languages.typescript.typescriptDefaults) {
       monaco.languages.typescript.typescriptDefaults.setCompilerOptions({

data/app/assets/javascripts/mbeditor/file_service.js

@@ -54,6 +54,14 @@ var FileService = (function () {
     return axios.get(window.mbeditorBasePath() + '/file', { params: params }).then(function(res) { return res.data; });
   }
 
+  function getFileChunk(path, startLine, lineCount) {
+    if (lineCount === undefined) {
+      lineCount = 500;
+    }
+    var params = { path: path, start_line: startLine, line_count: lineCount };
+    return axios.get(window.mbeditorBasePath() + '/file', { params: params }).then(function(res) { return res.data; });
+  }
+
   function saveFile(path, code) {
     return axios.post(window.mbeditorBasePath() + '/file', { path: path, code: code }).then(function(res) { return res.data; });
   }
@@ -200,6 +208,7 @@ var FileService = (function () {
     getWorkspace: getWorkspace,
     getTree: getTree,
     getFile: getFile,
+    getFileChunk: getFileChunk,
     saveFile: saveFile,
     createFile: createFile,
     createDir: createDir,

data/app/assets/javascripts/mbeditor/tab_manager.js

@@ -207,6 +207,29 @@ var TabManager = (function () {
       }
     }).catch(function(err) {
       if (path.startsWith('diff://')) return; // diff tabs handle their own loading
+      if (err.response && err.response.status === 413) {
+        FileService.getFileChunk(path, 0, 500).then(function(data) {
+          var loadedContent = typeof data.content === 'string' ? data.content : "";
+          _updateTab(paneId, path, {
+            content: loadedContent,
+            cleanContent: loadedContent,
+            externalContentVersion: 1,
+            isImage: false,
+            fileNotFound: false,
+            dirty: false,
+            loading: false,
+            truncated: true,
+            startLine: data.start_line || 0,
+            lineCount: data.line_count || 0,
+            totalLines: data.total_lines || 0,
+            totalBytes: data.total_bytes || 0
+          });
+        }).catch(function(chunkErr) {
+          EditorStore.setStatus("Failed to load large file: " + ((chunkErr.response && chunkErr.response.data && chunkErr.response.data.error) || chunkErr.message), "error");
+          closeTab(paneId, path);
+        });
+        return;
+      }
       EditorStore.setStatus("Failed to load file: " + ((err.response && err.response.data && err.response.data.error) || err.message), "error");
       closeTab(paneId, path);
     });

data/app/controllers/mbeditor/editors_controller.rb

@@ -170,6 +170,29 @@ module Mbeditor
         return render json: { error: "Not found" }, status: :not_found
       end
 
+      start_line = params[:start_line] ? params[:start_line].to_i : nil
+      line_count  = params.key?(:line_count) ? params[:line_count].to_i : 500
+      line_count  = [line_count, 5000].min
+
+      if start_line
+        total_bytes = File.size(path)
+        chunk = []
+        total_lines = 0
+        File.foreach(path, encoding: "UTF-8", invalid: :replace, undef: :replace) do |line|
+          chunk << line if total_lines >= start_line && chunk.length < line_count
+          total_lines += 1
+        end
+        return render json: {
+          path:        relative_path(path),
+          content:     chunk.join,
+          truncated:   total_lines > start_line + chunk.length,
+          start_line:  start_line,
+          line_count:  chunk.length,
+          total_lines: total_lines,
+          total_bytes: total_bytes
+        }
+      end
+
       size = File.size(path)
       return render_file_too_large(size) if size > MAX_OPEN_FILE_SIZE_BYTES
 

data/lib/mbeditor/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module Mbeditor
-  VERSION = "0.5.0"
+  VERSION = "0.5.1"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: mbeditor
 version: !ruby/object:Gem::Version
-  version: 0.5.0
+  version: 0.5.1
 platform: ruby
 authors:
 - Oliver Noonan