mbeditor 0.9.0 → 0.10.1

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

@@ -714,21 +714,11 @@
       monaco.languages.typescript.javascriptDefaults.setDiagnosticsOptions({
         noSemanticValidation: false,
         noSyntaxValidation: false,
-        noSuggestionDiagnostics: false,
-        // JSX/JS here is untyped and frequently reads data whose shape is only
-        // known at runtime (server props, state seeded with `{}`). TypeScript
-        // infers those as type `{}` and flags every property/element access as
-        // an error (2339 "Property X does not exist on type '{}'", 2551 its
-        // "did you mean" variant, 7053 dynamic index access). Suppress that
-        // false-positive family while keeping genuinely useful checks such as
-        // 2304 "Cannot find name" (undefined variables/typos).
-        //
-        // A plain-JS component that reads `props.foo` gives TS no way to know
-        // `foo` is optional, so it infers every referenced prop as REQUIRED and
-        // flags call sites that omit it (2741 "Property X is missing … but
-        // required", 2739 its multi-property form). Since optional props can't
-        // be expressed without JSDoc/TS, suppress that family too.
-        diagnosticCodesToIgnore: [2339, 2551, 7053, 2739, 2741]
+        noSuggestionDiagnostics: false
+        // No diagnosticCodesToIgnore here on purpose: JS/JSX markers are
+        // filtered by category in the marker patcher below (see JS_KEEP_CODES),
+        // which is a closed rule rather than a list that grows by one code
+        // every time a new false positive turns up.
       });
       monaco.languages.typescript.javascriptDefaults.setCompilerOptions({
         target: monaco.languages.typescript.ScriptTarget.ES2020,
@@ -875,28 +865,49 @@
         loadWorkspaceGlobals(monaco);
       });
 
-      // Downgrade certain TypeScript diagnostic codes from Error to Warning.
-      // TypeScript has no built-in way to emit these as warnings, so we intercept
-      // the marker set after the worker fires and re-apply with lower severity.
+      // Patch the TypeScript worker's markers after it fires.
       //
-      // Patch markers after the TypeScript worker fires:
-      // - JS files: downgrade TS2304 ("Cannot find name") to Warning — host-app
-      //   globals injected at runtime are invisible to the language service, so
-      //   hard errors are almost always false positives. Downgrading keeps the
-      //   signal without blocking genuine undefined-variable detection.
-      // - Both: downgrade TS6133 ("declared but never read") from Error to Warning.
-      // - JS/JSX: suppress TS2300 ("Duplicate identifier") — in Sprockets apps all
-      //   open files share a global script context in Monaco's TS worker, so a
-      //   component defined in file_a.jsx looks like a redeclaration when file_b.jsx
-      //   is also open. This is a structural false positive, not a real error.
-      // TS2403 ("Subsequent variable declarations must have the same type")
-      // joins the suppress list because the ambient `declare var Foo: any`
-      // from workspace-globals.d.ts coexists with the real `function Foo()`
-      // when its defining file is open — inherently a false positive in the
-      // shared-global-scope model.
-      var JS_SUPPRESS_CODES = { '2300': true, '2451': true, '2403': true };
-      var JS_WARN_CODES    = { '2304': true, '6133': true };
-      var TS_WARN_CODES    = { '6133': true };
+      // ── JS/JSX: keep only the diagnostics that are sound without types ──────
+      // Plain JS/JSX is untyped, so every *type* diagnostic TypeScript emits is
+      // an inference guess, and which way it guesses is arbitrary: state seeded
+      // with `useState({})` infers `{}` and errors on every key, while the same
+      // object from `JSON.parse` infers `any` and stays silent. Identical code,
+      // opposite verdicts. Denylisting each false-positive code as it turned up
+      // never converged — it reached eight codes and still leaked (2322 on a
+      // spread with an extra prop), because the tail is every code TypeScript
+      // has. So invert it: keep the categories below and drop the rest.
+      //
+      //   • syntax errors — always real. Their codes are 1xxx (and 17xxx for
+      //     the JSX-specific ones, e.g. 17008 "no corresponding closing tag"),
+      //     which is why the ranges rather than a code list are matched.
+      //   • 2304 "Cannot find name" — scope resolution, not type checking.
+      //     Downgraded to Warning below and auto-resolved against the workspace,
+      //     since host-app globals are invisible to the language service.
+      //   • 6133 "declared but never read" — a lint. Downgraded to Warning.
+      //   • anything below Error severity — hints and suggestions render faint
+      //     and cost nothing, so they pass through untouched.
+      //
+      // Deliberately dropped along with the type errors: 2300 "Duplicate
+      // identifier" and 2403 "Subsequent variable declarations…", which are
+      // structural false positives in the Sprockets model — every open file
+      // shares one global script context, so a component in file_a.jsx looks
+      // like a redeclaration once file_b.jsx is open, and the ambient
+      // `declare var Foo: any` from workspace-globals.d.ts collides with the
+      // real `function Foo()` when its defining file is open.
+      //
+      // .ts/.tsx keeps full checking: there the types are hand-written, so a
+      // type error is a statement about code the author actually wrote.
+      var JS_KEEP_CODES  = { '2304': true, '6133': true };
+      var JS_SYNTAX_CODE = /^(?:1\d{3}|17\d{3})$/;
+      var JS_WARN_CODES  = { '2304': true, '6133': true };
+      var TS_WARN_CODES  = { '6133': true };
+
+      function keepJsMarker(marker) {
+        if (marker.severity !== monaco.MarkerSeverity.Error) return true;
+        var code = String(marker.code == null ? '' : marker.code);
+        return JS_KEEP_CODES[code] === true || JS_SYNTAX_CODE.test(code);
+      }
+
       var _severityPatchActive = false;
       monaco.editor.onDidChangeMarkers(function(uris) {
         if (_severityPatchActive) return;
@@ -906,22 +917,23 @@
             var model = monaco.editor.getModel(uri);
             if (!model) return;
             [
-              { owner: 'javascript', suppress: JS_SUPPRESS_CODES, warn: JS_WARN_CODES },
-              { owner: 'typescript', suppress: {},                 warn: TS_WARN_CODES }
+              { owner: 'javascript', keep: keepJsMarker, warn: JS_WARN_CODES },
+              { owner: 'typescript', keep: null,         warn: TS_WARN_CODES }
             ].forEach(function(entry) {
               var markers = monaco.editor.getModelMarkers({ resource: uri, owner: entry.owner });
-              var needsPatch = markers.some(function(m) {
-                var code = String(m.code);
-                return (m.severity === monaco.MarkerSeverity.Error && (entry.suppress[code] || entry.warn[code]));
-              });
-              if (!needsPatch) return;
-              monaco.editor.setModelMarkers(model, entry.owner, markers.filter(function(m) {
-                return !entry.suppress[String(m.code)];
+              var patched = markers.filter(function(m) {
+                return entry.keep ? entry.keep(m) : true;
               }).map(function(m) {
                 return (m.severity === monaco.MarkerSeverity.Error && entry.warn[String(m.code)])
                   ? Object.assign({}, m, { severity: monaco.MarkerSeverity.Warning })
                   : m;
-              }));
+              });
+              // Re-applying an unchanged set would re-enter this handler
+              // forever, so only write when the patch actually changed something.
+              var changed = patched.length !== markers.length || patched.some(function(m, i) {
+                return m.severity !== markers[i].severity;
+              });
+              if (changed) monaco.editor.setModelMarkers(model, entry.owner, patched);
             });
           });
         } finally {
@@ -1370,12 +1382,51 @@
       }).catch(function() {});
     });
 
+    // Target of the command links the backend rewrites ruby-lsp's file://
+    // "Definitions" links into (see EditorsController#rewrite_lsp_hover_links).
+    monaco.editor.registerCommand('mbeditor.openDefinition', function(_accessor, path, line) {
+      if (!path) return;
+      if (typeof TabManager === 'undefined' || !TabManager.openTab) return;
+      TabManager.openTab(path, String(path).split('/').pop(), line || 1);
+    });
+
     // Ruby method definition hover provider.
     // Calls the backend /definition endpoint (Ripper-based) and renders
     // the method signature and any preceding # comments as hover markdown.
     // Results are cached client-side for 60 s to make re-hovers instantaneous.
     var hoverCache = {};
     var HOVER_CACHE_TTL_MS = 60000;
+    var HOVER_MEMBER_LIMIT = 20;
+
+    // ruby-lsp's hover for a constant is a title, a Definitions link and any
+    // doc comments — it never lists what the class/module defines. Keep the
+    // /module_members breakdown that the legacy hover showed, appended below.
+    // Resolves to '' (never rejects) for anything that isn't a constant.
+    function moduleMembersMarkdown(word) {
+      if (!/^[A-Z]/.test(word)) return Promise.resolve('');
+      if (typeof FileService === 'undefined' || !FileService.getModuleMembers) return Promise.resolve('');
+
+      var key = '__members__' + word;
+      var cached = hoverCache[key];
+      if (cached && (Date.now() - cached.ts) < HOVER_CACHE_TTL_MS) return Promise.resolve(cached.markdown);
+
+      return FileService.getModuleMembers(word, {}).then(function(data) {
+        var methods = (data && data.methods) || [];
+        var markdown = '';
+        if (methods.length > 0) {
+          var lines = ['', '---', '**Methods**', ''];
+          methods.slice(0, HOVER_MEMBER_LIMIT).forEach(function(m) {
+            lines.push('- `' + (m.signature || m.name) + '`');
+          });
+          if (methods.length > HOVER_MEMBER_LIMIT) {
+            lines.push('- _' + (methods.length - HOVER_MEMBER_LIMIT) + ' more_');
+          }
+          markdown = '\n\n' + lines.join('\n');
+        }
+        hoverCache[key] = { ts: Date.now(), markdown: markdown };
+        return markdown;
+      }).catch(function() { return ''; });
+    }
 
     // Registered for 'erb' as well as 'ruby'. In ERB the provider only fires
     // inside <% %> and always uses the workspace (grep/Ripper) services:
@@ -1409,12 +1460,15 @@
             return tryRubyLsp('hover', model, position).then(function (lsp) {
               if (token && token.isCancellationRequested) return null;
               if (lsp && lsp.markdown) {
-                var lspResult = {
-                  range: new monaco.Range(position.lineNumber, wordInfo.startColumn, position.lineNumber, wordInfo.endColumn),
-                  contents: [{ value: lsp.markdown, isTrusted: true }]
-                };
-                hoverCache[lspKey] = { ts: Date.now(), result: lspResult };
-                return lspResult;
+                return moduleMembersMarkdown(word).then(function (members) {
+                  if (token && token.isCancellationRequested) return null;
+                  var lspResult = {
+                    range: new monaco.Range(position.lineNumber, wordInfo.startColumn, position.lineNumber, wordInfo.endColumn),
+                    contents: [{ value: lsp.markdown + members, isTrusted: true }]
+                  };
+                  hoverCache[lspKey] = { ts: Date.now(), result: lspResult };
+                  return lspResult;
+                });
               }
               hoverCache[lspKey] = { ts: Date.now(), result: null };
               return legacyRubyHover(model, position, token, wordInfo);

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

@@ -114,6 +114,13 @@ var GitService = (function () {
     });
   }
 
+  // Per-line add/modify/delete ranges for one file, used to tint line numbers.
+  function fetchLineDiff(path) {
+    return axios.get(window.mbeditorBasePath() + '/git/line_diff?file=' + encodeURIComponent(path)).then(function(res) {
+      return res.data;
+    });
+  }
+
   function fetchFileHistory(path) {
     return axios.get(window.mbeditorBasePath() + '/git/file_history?file=' + encodeURIComponent(path)).then(function(res) {
       return res.data;
@@ -138,6 +145,7 @@ var GitService = (function () {
     fetchInfo: fetchInfo,
     fetchDiff: fetchDiff,
     fetchBlame: fetchBlame,
+    fetchLineDiff: fetchLineDiff,
     fetchFileHistory: fetchFileHistory,
     fetchCommitGraph: fetchCommitGraph,
     fetchCommitDetail: fetchCommitDetail

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

@@ -0,0 +1,110 @@
+'use strict';
+
+// Outline entries for JS/JSX/TS from TypeScript's own navigation tree.
+//
+// Monaco's TypeScript worker already parses these files for diagnostics and
+// completion, and `getNavigationTree` hands back the symbol tree it built —
+// so unlike the Ruby outline there is no lexer here, only a translation of
+// that tree into the entry shape the dropdown renders.
+//
+// The raw tree needs three fixes before it is useful as an outline:
+//   • children arrive alphabetised, not in source order
+//   • it includes every local, object-literal key and anonymous callback
+//   • an arrow function assigned to a variable is labelled 'const', exactly
+//     like `const total = 5`
+var JsOutline = (function () {
+  var MAX_ENTRIES = 5000;
+
+  var CONTAINER_KINDS = {
+    'class': true, 'local class': true, 'interface': true,
+    'enum': true, 'module': true, 'type': true
+  };
+  var CALLABLE_KINDS = {
+    'function': true, 'local function': true, 'method': true,
+    'constructor': true, 'getter': true, 'setter': true
+  };
+  var VARIABLE_KINDS = { 'const': true, 'let': true, 'var': true };
+
+  // `= function`, `= async () =>`, `= x =>`, `= async function*`. Anchored on
+  // the assignment so a call like `const rows = build(() => 1)` stays out.
+  var FUNCTION_INITIALIZER =
+    /=\s*(?:async\s+)?(?:function\b|\(\s*[^)]*\)\s*=>|[A-Za-z_$][\w$]*\s*=>)/;
+
+  // TypeScript names anonymous callbacks after their caller: "then() callback",
+  // "React.useEffect() callback". They have no nameSpan, and neither does
+  // `export default Foo`. A constructor has no nameSpan either but is worth
+  // listing, so it is admitted by kind rather than by name.
+  function isAnonymous(item) {
+    return !item.nameSpan && item.kind !== 'constructor';
+  }
+
+  // 'constructor' is a TypeScript kind and also an Object.prototype key, so a
+  // bare `MAP[kind]` lookup answers truthy for it against every map.
+  function listed(map, kind) {
+    return Object.prototype.hasOwnProperty.call(map, kind);
+  }
+
+  function entryKind(item, declarationText) {
+    if (listed(CONTAINER_KINDS, item.kind)) return 'suite';
+    if (listed(CALLABLE_KINDS, item.kind)) return 'method';
+    if (listed(VARIABLE_KINDS, item.kind) && FUNCTION_INITIALIZER.test(declarationText)) return 'method';
+    return null;
+  }
+
+  function spanStart(item) {
+    var span = item && item.spans && item.spans[0];
+    return span ? span.start : 0;
+  }
+
+  function inSourceOrder(items) {
+    return items.slice().sort(function (a, b) { return spanStart(a) - spanStart(b); });
+  }
+
+  // ctx.lineAt(offset) -> 1-based line number
+  // ctx.textAt(offset, length) -> source text for a span
+  function collect(items, depth, ctx, entries) {
+    var ordered = inSourceOrder(items || []);
+
+    for (var i = 0; i < ordered.length; i++) {
+      var item = ordered[i];
+      var span = item.spans && item.spans[0];
+      if (!span) continue;
+
+      // Only the declaration's own head is needed to spot an initializer, and
+      // a multi-line arrow body can be arbitrarily long.
+      var kind = isAnonymous(item) ? null : entryKind(item, ctx.textAt(span.start, Math.min(span.length, 200)));
+
+      // A skipped node still contributes its children — a component assigned
+      // to an unrecognised wrapper shouldn't take its methods down with it.
+      if (!kind) {
+        if (!collect(item.childItems, depth, ctx, entries)) return false;
+        continue;
+      }
+
+      if (entries.length >= MAX_ENTRIES) return false;
+      entries.push({
+        line: ctx.lineAt(span.start),
+        name: item.text,
+        kind: kind,
+        depth: depth,
+        visibility: null
+      });
+
+      if (!collect(item.childItems, depth + 1, ctx, entries)) return false;
+    }
+
+    return true;
+  }
+
+  // The root is the file itself ('<global>' for a script, the module name for
+  // a module), so only its children are outlined.
+  function fromNavigationTree(root, ctx) {
+    var entries = [];
+    var completed = root ? collect(root.childItems, 0, ctx, entries) : true;
+    return { entries: entries, truncated: !completed };
+  }
+
+  return { fromNavigationTree: fromNavigationTree, MAX_ENTRIES: MAX_ENTRIES };
+})();
+
+window.JsOutline = JsOutline;

data/app/assets/stylesheets/mbeditor/editor.css

@@ -63,12 +63,26 @@ html, body, #mbeditor-root {
   font-weight: 500;
 }
 
+/* Fills the gap between the title and the button cluster. min-width: 0 lets it
+   collapse on a narrow window instead of shoving the buttons off the edge. */
+.ide-titlebar-search-slot {
+  display: flex;
+  flex: 1 1 auto;
+  justify-content: center;
+  min-width: 0;
+  margin: 0 12px;
+}
+
 .ide-titlebar-search {
   display: flex;
   align-items: center;
-  margin: 0 auto;
-  min-width: 220px;
-  max-width: 340px;
+  justify-content: center;
+  /* 75% of the slot, i.e. of the space between the title and the buttons.
+     The floor keeps the placeholder readable once 75% of a shrinking gap
+     stops being enough, and caps at 100% so it can never outgrow its slot
+     and shove the buttons off the edge. */
+  width: 75%;
+  min-width: min(220px, 100%);
   padding: 3px 12px;
   background: rgba(255, 255, 255, 0.06);
   border: 1px solid rgba(255, 255, 255, 0.12);
@@ -78,7 +92,12 @@ html, body, #mbeditor-root {
   cursor: pointer;
 }
 .ide-titlebar-search:hover { background: rgba(255, 255, 255, 0.10); }
-.ide-titlebar-search-text { opacity: 0.8; }
+.ide-titlebar-search-text {
+  opacity: 0.8;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
 
 .ide-body {
   display: flex;
@@ -2061,6 +2080,19 @@ html, body, #mbeditor-root {
 .ide-outline-entry-test .ide-outline-entry-icon { color: #8ab4f8; }
 .ide-outline-entry-name { overflow: hidden; text-overflow: ellipsis; }
 
+/* Line numbers tinted by git status (see the line_diff effect in EditorPanel).
+   Monaco themes style `.monaco-editor .line-numbers`, so these need the same
+   two-class prefix to win on specificity rather than reaching for !important.
+   The colours are theme variables so they track the active editor theme. */
+.monaco-editor .line-numbers.mbeditor-gitline-added    { color: var(--ide-success); font-weight: 600; }
+.monaco-editor .line-numbers.mbeditor-gitline-modified { color: var(--ide-warning); font-weight: 600; }
+.monaco-editor .line-numbers.mbeditor-gitline-deleted  { color: var(--ide-danger);  font-weight: 600; }
+
+/* A line that is both modified and sits above a deletion should read as
+   deleted — the rarer, more surprising state wins. */
+.monaco-editor .line-numbers.mbeditor-gitline-deleted.mbeditor-gitline-added,
+.monaco-editor .line-numbers.mbeditor-gitline-deleted.mbeditor-gitline-modified { color: var(--ide-danger); }
+
 .ide-methods-dropdown-message {
   padding: 8px 12px;
   color: #858585;
@@ -2808,3 +2840,143 @@ button:not(.pico-btn) { margin-bottom: 0; }
   word-break: break-word;
 }
 .ide-log-line { color: var(--ide-fg, #d4d4d4); }
+
+/* Rails log colouring — see classifyLogLine in LogPanel.js for what matches
+   what, and the --ide-log-* block in themes.css for the palette. Deliberately
+   restrained: the point is to let the eye find request boundaries and failures
+   while scrolling, not to paint every line. */
+.ide-log-line-request    { color: var(--ide-log-request); font-weight: 600; }
+.ide-log-line-controller { color: var(--ide-log-controller); }
+.ide-log-line-success    { color: var(--ide-log-success); }
+.ide-log-line-error      { color: var(--ide-log-error); font-weight: 600; }
+.ide-log-line-warn       { color: var(--ide-log-warn); }
+.ide-log-line-sql        { color: var(--ide-log-sql); }
+.ide-log-line-render     { color: var(--ide-log-render); }
+.ide-log-line-mbeditor   { color: var(--ide-log-controller); font-style: italic; }
+.ide-log-line-muted,
+.ide-log-line-trace      { color: var(--ide-log-muted); }
+
+/* ── Problems drawer ──────────────────────────────────────────────────────
+   Same geometry as the log drawer so the two read as one family; only the
+   body differs, being a list of clickable diagnostics rather than raw text. */
+.ide-problems-drawer {
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 22px; /* sit above the status bar */
+  height: 240px; /* default; overridden by the drag-resized inline height */
+  display: flex;
+  flex-direction: column;
+  background: var(--ide-panel-bg, #1e1e1e);
+  border-top: 1px solid var(--ide-border, #333);
+  z-index: 41; /* above the log drawer when both are open */
+}
+.ide-problems-resize {
+  flex: 0 0 auto;
+  height: 6px;
+  cursor: ns-resize;
+  background: transparent;
+}
+.ide-problems-resize:hover { background: var(--ide-accent, #569cd6); }
+.ide-problems-header {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 4px 10px;
+  border-bottom: 1px solid var(--ide-border, #333);
+  font-size: 12px;
+  color: var(--ide-fg-muted, #ccc);
+}
+.ide-problems-title { font-weight: 600; }
+.ide-problems-summary { color: var(--ide-text-muted, #858585); font-size: 11px; }
+.ide-problems-filter {
+  margin-left: auto;
+  background: var(--ide-input-bg, #2d2d2d);
+  color: var(--ide-fg, #eee);
+  border: 1px solid var(--ide-border, #333);
+  border-radius: 3px;
+  padding: 2px 6px;
+  font-size: 12px;
+  width: 180px;
+}
+.ide-problems-btn {
+  background: transparent;
+  border: none;
+  color: var(--ide-fg-muted, #ccc);
+  cursor: pointer;
+  padding: 2px 6px;
+}
+.ide-problems-btn:hover { color: var(--ide-fg, #fff); }
+.ide-problems-body { flex: 1; overflow: auto; padding: 4px 0; font-size: 12px; }
+.ide-problems-empty {
+  padding: 10px 14px;
+  color: var(--ide-text-muted, #858585);
+  font-style: italic;
+}
+.ide-problems-file-name {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  padding: 5px 12px 3px;
+  color: var(--ide-fg-muted, #ccc);
+  font-weight: 600;
+}
+.ide-problems-file-count {
+  background: var(--ide-hover-bg, #2a2a2a);
+  border-radius: 8px;
+  padding: 0 6px;
+  font-size: 10px;
+  font-weight: 600;
+  color: var(--ide-text-muted, #858585);
+}
+.ide-problems-item {
+  display: flex;
+  align-items: baseline;
+  gap: 8px;
+  width: 100%;
+  padding: 3px 12px 3px 28px;
+  background: transparent;
+  border: none;
+  color: var(--ide-fg, #d4d4d4);
+  font-size: 12px;
+  font-family: inherit;
+  text-align: left;
+  cursor: pointer;
+}
+.ide-problems-item:hover,
+.ide-problems-item:focus-visible { background: var(--ide-hover-bg, #2a2a2a); }
+.ide-problems-icon { flex-shrink: 0; }
+.ide-problems-item-error .ide-problems-icon { color: var(--ide-danger); }
+.ide-problems-item-warning .ide-problems-icon { color: var(--ide-warning); }
+.ide-problems-msg { flex-shrink: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+/* The offending source line, dimmed so it reads as context rather than as part
+   of the message. It is the one part of the row allowed to shrink, so a long
+   line gives way to the message and location instead of pushing them out. */
+.ide-problems-code {
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  color: var(--ide-text-muted, #858585);
+  opacity: 0.8;
+  font-family: var(--ide-mono, monospace);
+  font-size: 11px;
+}
+.ide-problems-source {
+  flex-shrink: 0;
+  color: var(--ide-text-muted, #858585);
+  font-size: 10px;
+  text-transform: lowercase;
+}
+.ide-problems-loc {
+  flex-shrink: 0;
+  margin-left: auto;
+  color: var(--ide-text-muted, #858585);
+  font-size: 11px;
+}
+
+/* Status-bar problems indicator: bug count then warning count, VS Code style. */
+.statusbar-problems { display: inline-flex; align-items: center; gap: 4px; }
+.statusbar-problems-error-icon { color: var(--ide-danger); }
+.statusbar-problems-warning-icon { color: var(--ide-warning); }
+.statusbar-problems-count { font-variant-numeric: tabular-nums; }

data/app/assets/stylesheets/mbeditor/themes.css

@@ -355,6 +355,41 @@
  * or exceed that specificity to win the cascade. :root[data-theme] equals
  * (0,2,0) and loads AFTER pico.classless.css, so it wins on cascade order.
  * ─────────────────────────────────────────────────────────────────────────── */
+/* Rails log drawer palette.
+ *
+ * Deliberately its own set rather than the --ide-* semantic vars: those only
+ * carry four hues, and several themes alias them (Dracula's --ide-accent-fg
+ * and --ide-success are the same green), which would render "Started GET" and
+ * "Completed 200" identically. A log needs its categories to separate from
+ * each other more than it needs to match the editor chrome — the same reason
+ * terminals keep a fixed palette. Light themes get darkened variants so the
+ * text stays legible on white. */
+:root[data-theme],
+:root,
+[data-theme] {
+  --ide-log-request:    #d7dae0;
+  --ide-log-controller: #c792ea;
+  --ide-log-sql:        #56b6c2;
+  --ide-log-render:     #82aaff;
+  --ide-log-success:    #7ec699;
+  --ide-log-warn:       #e5c07b;
+  --ide-log-error:      #ef6b73;
+  --ide-log-muted:      #7f8596;
+}
+
+:root[data-theme="vs"],
+:root[data-theme="hc-light"],
+:root[data-theme="github-light"] {
+  --ide-log-request:    #1f2328;
+  --ide-log-controller: #6f42c1;
+  --ide-log-sql:        #0b7285;
+  --ide-log-render:     #0550ae;
+  --ide-log-success:    #116329;
+  --ide-log-warn:       #8a6100;
+  --ide-log-error:      #b42318;
+  --ide-log-muted:      #656d76;
+}
+
 :root[data-theme],
 :root,
 [data-theme] {

data/app/controllers/mbeditor/editors_controller.rb

@@ -1144,10 +1144,39 @@ module Mbeditor
       contents = result.is_a?(Hash) ? result["contents"] : nil
       return nil if contents.nil?
 
-      case contents
-      when Hash  then contents["value"].to_s
-      when Array then contents.map { |c| c.is_a?(Hash) ? c["value"].to_s : c.to_s }.join("\n\n")
-      else contents.to_s
+      markdown =
+        case contents
+        when Hash  then contents["value"].to_s
+        when Array then contents.map { |c| c.is_a?(Hash) ? c["value"].to_s : c.to_s }.join("\n\n")
+        else contents.to_s
+        end
+
+      rewrite_lsp_hover_links(markdown)
+    end
+
+    # ruby-lsp renders its "Definitions" line as VS Code file links, e.g.
+    # `[user.rb](file:///abs/path/user.rb#L3,1-9,4)`. Monaco renders those as
+    # links but clicking one does nothing, since nothing can open a file:// URI
+    # here. Point in-workspace links at the `mbeditor.openDefinition` Monaco
+    # command (registered in editor_plugins.js) and demote gem/stdlib links —
+    # which the editor cannot open at all — to plain code spans.
+    LSP_HOVER_FILE_LINK = %r{\[([^\]\n]+)\]\(file://([^)\s#]+)(?:\#L(\d+),\d+(?:-\d+,\d+)?)?\)}
+
+    def rewrite_lsp_hover_links(markdown)
+      prefix = "#{workspace_root}/"
+      markdown.gsub(LSP_HOVER_FILE_LINK) do
+        label, raw_path, line = Regexp.last_match(1), Regexp.last_match(2), Regexp.last_match(3).to_i
+        # Percent-decode by hand: URI's unescape helpers are deprecated on new
+        # Rubies and their replacements are missing on the old ones we support.
+        # (Must come after reading the other captures — gsub resets last_match.)
+        path = raw_path.gsub(/%\h\h/) { |esc| esc[1..].hex.chr }.force_encoding(Encoding::UTF_8)
+
+        if path.start_with?(prefix)
+          args = [path.delete_prefix(prefix), line.positive? ? line : 1]
+          "[#{label}](command:mbeditor.openDefinition?#{ERB::Util.url_encode(args.to_json)})"
+        else
+          "`#{label}`"
+        end
       end
     end
 

data/app/controllers/mbeditor/git_controller.rb

@@ -8,6 +8,7 @@ module Mbeditor
   # ---------
   # GET  /mbeditor/git/diff          ?file=<path>[&base=<sha>&head=<sha>]
   # GET  /mbeditor/git/blame         ?file=<path>
+  # GET  /mbeditor/git/line_diff     ?file=<path>
   # GET  /mbeditor/git/file_history  ?file=<path>
   # GET  /mbeditor/git/commit_graph
   # GET  /mbeditor/redmine/issue/:id
@@ -55,6 +56,16 @@ module Mbeditor
       render json: { error: e.message }, status: :unprocessable_content
     end
 
+    # GET /mbeditor/git/line_diff?file=<path>
+    def line_diff
+      file = require_file_param
+      return unless file
+
+      render json: GitLineDiffService.new(repo_path: workspace_root, file_path: file).call
+    rescue StandardError => e
+      render json: { error: e.message }, status: :unprocessable_content
+    end
+
     # GET /mbeditor/git/file_history?file=<path>
     def file_history
       file = require_file_param