mbeditor 0.13.0 → 0.14.0

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

@@ -7,100 +7,80 @@
 (function() {
   var _React = React;
   var useEffect = _React.useEffect;
+  var useState = _React.useState;
 
-  // ---------------------------------------------------------------------------
-  // Lightweight markdown → React elements renderer, tuned for CHANGELOG format.
-  // Handles: h1/h2/h3, bullet lists, blank lines, horizontal rules, inline **bold**.
-  // ---------------------------------------------------------------------------
-  function parseInline(text) {
-    // Split on **bold** markers and return a mixed array of strings + bold spans.
-    var parts = text.split(/\*\*([^*]+)\*\*/g);
-    return parts.map(function(part, i) {
-      return i % 2 === 1
-        ? React.createElement('strong', { key: i }, part)
-        : part;
-    });
-  }
+  var SECTION_ICONS = { Added: 'fas fa-plus-circle', Fixed: 'fas fa-wrench', Changed: 'fas fa-exchange-alt', Removed: 'fas fa-minus-circle', Performance: 'fas fa-bolt', Tests: 'fas fa-vial', Security: 'fas fa-shield-alt' };
+  // Shared with EditorPanel.js's markdown preview, which renders untrusted
+  // workspace files through the same marked renderer. One definition on
+  // purpose: this is the allow-list that keeps `javascript:` out of an href,
+  // and a second copy is how one of them silently stops matching the other.
+  var SAFE_HREF_SCHEME = /^(https?:|mailto:|#|\/)/i;
 
-  function renderMarkdown(markdown) {
-    var lines = markdown.split('\n');
-    var elements = [];
-    var listBuffer = [];
-    var key = 0;
-
-    function flushList() {
-      if (!listBuffer.length) return;
-      elements.push(React.createElement(
-        'ul', { key: 'ul' + key++, className: 'changelog-list' },
-        listBuffer.slice()
-      ));
-      listBuffer = [];
-    }
+  window.mbeditorEscapeHtml = function escapeHtml(str) {
+    return String(str).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
+  };
 
-    lines.forEach(function(line) {
-      // H1
-      if (/^# /.test(line)) {
-        flushList();
-        elements.push(React.createElement('h1', { key: key++, className: 'changelog-h1' }, line.slice(2).trim()));
-        return;
-      }
-      // H2 — version line, e.g. "## [0.7.0] - 2026-05-21"
-      if (/^## /.test(line)) {
-        flushList();
-        var raw = line.slice(3).trim();
-        // Parse "[X.Y.Z] - DATE" or "[Unreleased]..." patterns
-        var vMatch = raw.match(/^\[([^\]]+)\](?:\s*-\s*(.+))?/);
-        if (vMatch) {
-          elements.push(React.createElement(
-            'div', { key: key++, className: 'changelog-version-row' },
-            React.createElement('span', { className: 'changelog-version-badge' }, vMatch[1]),
-            vMatch[2] && React.createElement('span', { className: 'changelog-version-date' }, vMatch[2].trim())
-          ));
-        } else {
-          elements.push(React.createElement('div', { key: key++, className: 'changelog-version-row' },
-            React.createElement('span', { className: 'changelog-version-badge' }, raw)
-          ));
-        }
-        return;
-      }
-      // H3 — section name, e.g. "### Added"
-      if (/^### /.test(line)) {
-        flushList();
-        var section = line.slice(4).trim();
-        var iconMap = { Added: 'fas fa-plus-circle', Fixed: 'fas fa-wrench', Changed: 'fas fa-exchange-alt', Removed: 'fas fa-minus-circle', Performance: 'fas fa-bolt', Tests: 'fas fa-vial', Security: 'fas fa-shield-alt' };
-        var iconClass = iconMap[section] || 'fas fa-tag';
-        elements.push(React.createElement(
-          'div', { key: key++, className: 'changelog-section changelog-section-' + section.toLowerCase() },
-          React.createElement('i', { className: iconClass }),
-          ' ',
-          section
-        ));
-        return;
-      }
-      // Horizontal rule
-      if (/^---+$/.test(line.trim())) {
-        flushList();
-        elements.push(React.createElement('hr', { key: key++, className: 'changelog-rule' }));
-        return;
-      }
-      // Bullet list item
-      if (/^- /.test(line)) {
-        listBuffer.push(React.createElement('li', { key: key++ }, parseInline(line.slice(2).trim())));
-        return;
+  window.mbeditorSafeHref = function safeHref(href) {
+    if (!href) return href;
+    return SAFE_HREF_SCHEME.test(href.trim()) ? href : '#';
+  };
+
+  var escapeHtml = window.mbeditorEscapeHtml;
+  var safeHref = window.mbeditorSafeHref;
+
+  // Custom marked.Renderer() that layers the changelog's bespoke presentation
+  // (version badges on H2, section icons on H3) over marked's own HTML, plus
+  // the same link/image href scheme allow-list EditorPanel.js uses. marked's
+  // Renderer methods here take positional args (href, title, text) — not the
+  // token objects EditorPanel.js's override checks for — so that override is
+  // effectively a no-op against the vendored marked build; this one uses the
+  // signature marked actually calls.
+  function buildRenderer() {
+    var renderer = new window.marked.Renderer();
+
+    renderer.heading = function(text, level) {
+      if (level === 2) {
+        var vMatch = text.match(/^\[([^\]]+)\](?:\s*-\s*(.+))?/);
+        var badge = vMatch ? vMatch[1] : text;
+        var date = vMatch && vMatch[2] ? vMatch[2].trim() : '';
+        return '<div class="changelog-version-row"><span class="changelog-version-badge">' + badge + '</span>' +
+          (date ? '<span class="changelog-version-date">' + date + '</span>' : '') + '</div>\n';
       }
-      // Blank line
-      if (line.trim() === '') {
-        flushList();
-        return;
+      if (level === 3) {
+        var iconClass = SECTION_ICONS[text] || 'fas fa-tag';
+        return '<div class="changelog-section changelog-section-' + text.toLowerCase() + '"><i class="' + iconClass + '"></i> ' + text + '</div>\n';
       }
-      // Plain paragraph (links, prose)
-      flushList();
-      if (/^\[.+\]: /.test(line)) return; // skip reference-style link defs
-      elements.push(React.createElement('p', { key: key++, className: 'changelog-p' }, parseInline(line.trim())));
-    });
-
-    flushList();
-    return elements;
+      return '<h1 class="changelog-h1">' + text + '</h1>\n';
+    };
+
+    renderer.list = function(body, ordered, start) {
+      var tag = ordered ? 'ol' : 'ul';
+      var cls = ordered ? '' : ' class="changelog-list"';
+      return '<' + tag + cls + '>\n' + body + '</' + tag + '>\n';
+    };
+
+    renderer.paragraph = function(text) {
+      return '<p class="changelog-p">' + text + '</p>\n';
+    };
+
+    renderer.hr = function() {
+      return '<hr class="changelog-rule">\n';
+    };
+
+    renderer.html = function(html) {
+      return '<pre>' + escapeHtml(html) + '</pre>';
+    };
+
+    var _origLink = renderer.link.bind(renderer);
+    var _origImage = renderer.image.bind(renderer);
+    renderer.link = function(href, title, text) {
+      return _origLink(safeHref(href), title, text);
+    };
+    renderer.image = function(href, title, text) {
+      return _origImage(safeHref(href), title, text);
+    };
+
+    return renderer;
   }
 
   // ---------------------------------------------------------------------------
@@ -109,11 +89,24 @@
   var ChangelogView = function ChangelogView(props) {
     var changelogState = props.changelogState;
     var onLoad = props.onLoad;
+    var content = (changelogState && changelogState.content) || '';
+
+    var _markupState = useState('');
+    var markup = _markupState[0];
+    var setMarkup = _markupState[1];
 
     useEffect(function() {
       if (onLoad) onLoad();
     }, []);
 
+    useEffect(function() {
+      if (!window.marked || !content) {
+        setMarkup('');
+        return;
+      }
+      setMarkup(window.marked.parse(content, { renderer: buildRenderer() }));
+    }, [content]);
+
     if (!changelogState || changelogState.loading) {
       return React.createElement(
         'div', { className: 'changelog-loading' },
@@ -130,14 +123,16 @@
       );
     }
 
-    var content = changelogState.content || '';
+    if (!window.marked) {
+      return React.createElement(
+        'div', { className: 'changelog-view' },
+        React.createElement('div', { className: 'changelog-body', style: { whiteSpace: 'pre-wrap' } }, content)
+      );
+    }
 
     return React.createElement(
       'div', { className: 'changelog-view' },
-      React.createElement(
-        'div', { className: 'changelog-body' },
-        renderMarkdown(content)
-      )
+      React.createElement('div', { className: 'changelog-body', dangerouslySetInnerHTML: { __html: markup } })
     );
   };
 

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

@@ -5,19 +5,16 @@ var CodeReviewPanel = function CodeReviewPanel(_ref) {
   var onClose = _ref.onClose;
 
   var _React$useState = React.useState(null),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      redmineIssue = _React$useState2[0],
-      setRedmineIssue = _React$useState2[1];
+      redmineIssue = _React$useState[0],
+      setRedmineIssue = _React$useState[1];
 
   var _React$useState3 = React.useState(null),
-      _React$useState4 = _slicedToArray(_React$useState3, 2),
-      redmineError = _React$useState4[0],
-      setRedmineError = _React$useState4[1];
+      redmineError = _React$useState3[0],
+      setRedmineError = _React$useState3[1];
 
   var _React$useState5 = React.useState(false),
-      _React$useState6 = _slicedToArray(_React$useState5, 2),
-      isRedmineLoading = _React$useState6[0],
-      setIsRedmineLoading = _React$useState6[1];
+      isRedmineLoading = _React$useState5[0],
+      setIsRedmineLoading = _React$useState5[1];
 
   var branchIdMatch = gitInfo && gitInfo.branch && gitInfo.branch.match(/(?:feature|bug|hotfix|task)\/(?:#)?(\d+)/i);
   var issueId = branchIdMatch ? branchIdMatch[1] : null;

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

@@ -1,6 +1,5 @@
 "use strict";
 
-var _slicedToArray = (function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; })();
 
 var _React = React;
 var useState = _React.useState;
@@ -17,13 +16,16 @@ var CollapsibleSection = function CollapsibleSection(_ref) {
   var icon = _ref$icon === undefined ? null : _ref$icon;
   var _ref$actions = _ref.actions;
   var actions = _ref$actions === undefined ? null : _ref$actions;
+  // A section with nowhere to collapse to. The file tree fills the sidebar and
+  // collapsing it leaves an empty panel, so it gets no chevron and no click.
+  var _ref$collapsible = _ref.collapsible;
+  var collapsible = _ref$collapsible === undefined ? true : _ref$collapsible;
 
   var _useState = useState(isCollapsed);
 
-  var _useState2 = _slicedToArray(_useState, 2);
 
-  var localCollapsed = _useState2[0];
-  var setLocalCollapsed = _useState2[1];
+  var localCollapsed = _useState[0];
+  var setLocalCollapsed = _useState[1];
 
   // Sync parent isCollapsed prop to local state when it changes
   useEffect(function () {
@@ -44,8 +46,11 @@ var CollapsibleSection = function CollapsibleSection(_ref) {
     { className: "collapsible-section" },
     React.createElement(
       "div",
-      { className: "collapsible-header", onClick: toggleCollapsed },
-      React.createElement("i", { className: "collapsible-toggle fas fa-chevron-" + (localCollapsed ? 'right' : 'down') }),
+      {
+        className: "collapsible-header" + (collapsible ? "" : " collapsible-header-static"),
+        onClick: collapsible ? toggleCollapsed : undefined
+      },
+      collapsible && React.createElement("i", { className: "collapsible-toggle fas fa-chevron-" + (localCollapsed ? 'right' : 'down') }),
       icon && React.createElement("i", { className: "collapsible-icon " + icon }),
       React.createElement(
         "span",
@@ -62,7 +67,7 @@ var CollapsibleSection = function CollapsibleSection(_ref) {
         actions
       )
     ),
-    !localCollapsed && React.createElement(
+    (!collapsible || !localCollapsed) && React.createElement(
       "div",
       { className: "collapsible-content" },
       children

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

@@ -32,18 +32,38 @@ var CombinedDiffViewer = function CombinedDiffViewer(_ref) {
   }
 
   // Split the raw diff into per-file segments, each starting at "diff --git".
+  // Anything before the first such header is not a file diff — it's the
+  // explanatory "# ..." text tab_manager.js substitutes when there's no base
+  // branch to compare against, or nothing changed — so it must be shown
+  // rather than silently dropped, or the tab reads as a blank diff.
   var segments = [];
   var current = null;
+  var preamble = [];
   diffText.split('\n').forEach(function (line) {
     if (line.startsWith('diff --git ')) {
       if (current) segments.push(current);
       current = { header: line, lines: [line] };
     } else if (current) {
       current.lines.push(line);
+    } else {
+      preamble.push(line);
     }
   });
   if (current) segments.push(current);
 
+  if (segments.length === 0) {
+    var message = preamble.join('\n').trim().replace(/^#\s*/, '');
+    // Info, not the green tick used for a genuinely empty diff above: this
+    // branch also carries "no base branch to compare against", which is a
+    // problem to act on rather than a clean result.
+    return React.createElement(
+      'div',
+      { className: 'combined-diff-viewer combined-diff-empty' },
+      React.createElement('i', { className: 'fas fa-info-circle', style: { marginRight: 8 } }),
+      message || 'No changes.'
+    );
+  }
+
   // Extract a clean display path from the "diff --git a/foo b/foo" header
   function extractPath(headerLine) {
     var m = headerLine.match(/^diff --git a\/(.+) b\/(.+)$/);

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

@@ -110,7 +110,7 @@ var DiffViewer = function DiffViewer(_ref) {
       'js': 'javascript', 'jsx': 'javascript',
       'ts': 'typescript', 'tsx': 'typescript',
       'json': 'json', 'yml': 'yaml', 'yaml': 'yaml',
-      'css': 'css', 'scss': 'css', 'sass': 'css',
+      'css': 'css', 'scss': 'scss', 'less': 'less', 'sass': 'css',
       'html': 'html', 'erb': 'erb', 'haml': 'haml',
       'xml': 'xml', 'md': 'markdown', 'markdown': 'markdown',
       'sh': 'shell', 'bash': 'shell', 'zsh': 'shell'