mbeditor 0.2.2

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

@@ -0,0 +1,69 @@
+// EditorStore — central state store for the browser IDE
+// All state lives here; UI subscribes via listeners.
+var EditorStore = (function () {
+  var _state = {
+    panes: [
+      { id: 1, tabs: [], activeTabId: null },
+      { id: 2, tabs: [], activeTabId: null }
+    ],
+    focusedPaneId: 1, // which pane currently has focus
+    activeTabId: null, // alias for backwards compat/easy access to the currently focused tab in the focused pane
+    gitFiles:      [],   // [{ status, path }]
+    gitBranch:     "",
+    gitInfo:       null,
+    gitInfoError:  null,
+    searchResults: [],
+    searchCapped: false,
+    statusMessage: { text: "", kind: "info" },
+  };
+
+  var _listeners = [];
+
+  function getState() { return _state; }
+
+  function subscribe(fn) {
+    _listeners.push(fn);
+    return function unsubscribe() {
+      _listeners = _listeners.filter(function (l) { return l !== fn; });
+    };
+  }
+
+  function emit() {
+    _listeners.forEach(function (fn) { fn(_state); });
+  }
+
+  function setState(patch) {
+    _state = Object.assign({}, _state, patch);
+    emit();
+  }
+
+  // Subscribe to changes in a specific subset of state keys.
+  // The listener is only called when at least one of the watched keys changes
+  // by reference (===), preventing unnecessary re-renders for unrelated updates.
+  function subscribeToSlice(keys, fn) {
+    var prev = {};
+    keys.forEach(function(k) { prev[k] = _state[k]; });
+    return subscribe(function(newState) {
+      var changed = keys.some(function(k) { return newState[k] !== prev[k]; });
+      if (changed) {
+        keys.forEach(function(k) { prev[k] = newState[k]; });
+        fn(newState);
+      }
+    });
+  }
+
+  function setStatus(text, kind) {
+    kind = kind || "info";
+    setState({ statusMessage: { text: text, kind: kind } });
+    // Auto-clear after 4s for non-error messages
+    if (kind !== "error") {
+      setTimeout(function () {
+        if (_state.statusMessage.text === text) {
+          setState({ statusMessage: { text: "", kind: "info" } });
+        }
+      }, 4000);
+    }
+  }
+
+  return { getState: getState, subscribe: subscribe, subscribeToSlice: subscribeToSlice, setState: setState, setStatus: setStatus };
+})();

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

@@ -0,0 +1,30 @@
+var MbeditorFileIcon = (function () {
+  function getFileIcon(name) {
+    var value = String(name || '');
+    var lower = value.toLowerCase();
+    var parts = lower.split('.');
+    var ext = parts.length > 1 ? parts.pop() : '';
+
+    if (lower === 'gemfile' || ext === 'gemspec' || ext === 'lock') return 'fas fa-gem ruby-icon';
+    if (ext === 'rb' || ext === 'rake' || lower === 'rakefile') return 'far fa-gem ruby-icon';
+    if (ext === 'jsx' || lower.endsWith('.js.jsx')) return 'fas fa-atom react-icon';
+    if (ext === 'js' || ext === 'mjs' || ext === 'cjs') return 'fa-brands fa-js js-icon';
+    if (ext === 'ts' || ext === 'tsx') return 'fas fa-code typescript-icon';
+    if (ext === 'html' || ext === 'htm') return 'fa-brands fa-html5 html-icon';
+    if (ext === 'erb') return 'fa-brands fa-html5 erb-icon';
+    if (ext === 'css' || ext === 'scss' || ext === 'sass') return 'fa-brands fa-css3-alt css-icon';
+    if (['png', 'jpg', 'jpeg', 'gif', 'svg', 'ico', 'webp', 'bmp', 'avif'].includes(ext)) return 'far fa-file-image image-icon';
+    if (ext === 'json') return 'fas fa-code json-icon';
+    if (ext === 'md' || ext === 'txt') return 'fas fa-file-alt md-icon';
+    if (ext === 'yml' || ext === 'yaml') return 'fas fa-cogs yml-icon';
+    if (ext === 'sh' || ext === 'bash' || ext === 'zsh') return 'fas fa-terminal shell-icon';
+    if (ext === 'pdf') return 'far fa-file-pdf pdf-icon';
+
+    return 'far fa-file-code';
+  }
+
+  return { getFileIcon: getFileIcon };
+})();
+
+window.MbeditorFileIcon = MbeditorFileIcon;
+window.getFileIcon = window.getFileIcon || MbeditorFileIcon.getFileIcon;

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

@@ -0,0 +1,96 @@
+// Identify all requests as coming from the mbeditor client.
+// The server uses this header to silence editor logs and guard non-GET requests.
+axios.defaults.headers.common['X-Mbeditor-Client'] = '1';
+
+var FileService = (function () {
+  function basePath() {
+    return (window.MBEDITOR_BASE_PATH || '/mbeditor').replace(/\/$/, '');
+  }
+
+  function getWorkspace() {
+    return axios.get(basePath() + '/workspace').then(function(res) { return res.data; });
+  }
+
+  function getTree() {
+    return axios.get(basePath() + '/files').then(function(res) { return res.data; });
+  }
+
+  function getFile(path, options) {
+    var params = { path: path };
+    if (options && options.allowMissing) {
+      params.allow_missing = '1';
+    }
+    return axios.get(basePath() + '/file', { params: params }).then(function(res) { return res.data; });
+  }
+
+  function saveFile(path, code) {
+    return axios.post(basePath() + '/file', { path: path, code: code }).then(function(res) { return res.data; });
+  }
+
+  function createFile(path, code) {
+    return axios.post(basePath() + '/create_file', { path: path, code: code || '' }).then(function(res) { return res.data; });
+  }
+
+  function createDir(path) {
+    return axios.post(basePath() + '/create_dir', { path: path }).then(function(res) { return res.data; });
+  }
+
+  function renamePath(path, newPath) {
+    return axios.patch(basePath() + '/rename', { path: path, new_path: newPath }).then(function(res) { return res.data; });
+  }
+
+  function deletePath(path) {
+    return axios.delete(basePath() + '/delete', { data: { path: path } }).then(function(res) { return res.data; });
+  }
+
+  function lintFile(path, code) {
+    return axios.post(basePath() + '/lint', { path: path, code: code }).then(function(res) { return res.data; });
+  }
+
+  function quickFixOffense(path, code, copName) {
+    return axios.post(basePath() + '/quick_fix', { path: path, code: code, cop_name: copName }).then(function(res) { return res.data; });
+  }
+
+  function formatFile(path, code) {
+    return axios.post(basePath() + '/format', { path: path, code: code }).then(function(res) { return res.data; });
+  }
+
+  function runTests(path) {
+    return axios.post(basePath() + '/test', { path: path }).then(function(res) { return res.data; });
+  }
+
+  function ping() {
+    return axios.get(basePath() + '/ping', { timeout: 4000 }).then(function(res) { return res.data; });
+  }
+
+  function getState() {
+    return axios.get(basePath() + '/state').then(function(res) { return res.data; });
+  }
+
+  function saveState(state) {
+    return axios.post(basePath() + '/state', { state: state }).then(function(res) { return res.data; });
+  }
+
+  function getDefinition(symbol, language) {
+    return axios.get(basePath() + '/definition', { params: { symbol: symbol, language: language } }).then(function(res) { return res.data; });
+  }
+
+  return {
+    getWorkspace: getWorkspace,
+    getTree: getTree,
+    getFile: getFile,
+    saveFile: saveFile,
+    createFile: createFile,
+    createDir: createDir,
+    renamePath: renamePath,
+    deletePath: deletePath,
+    lintFile: lintFile,
+    quickFixOffense: quickFixOffense,
+    formatFile: formatFile,
+    runTests: runTests,
+    ping: ping,
+    getState: getState,
+    saveState: saveState,
+    getDefinition: getDefinition
+  };
+})();

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

@@ -0,0 +1,104 @@
+var GitService = (function () {
+  function basePath() {
+    return (window.MBEDITOR_BASE_PATH || '/mbeditor').replace(/\/$/, '');
+  }
+
+  function applyGitInfo(data) {
+    var files = data.workingTree || data.files || [];
+    EditorStore.setState({
+      gitFiles: files,
+      gitBranch: data.branch || "",
+      gitInfo: data,
+      gitInfoError: null
+    });
+  }
+
+  function fetchInfo() {
+    return axios.get(basePath() + '/git_info')
+      .then(function(res) {
+        if (res.data && res.data.ok) {
+          applyGitInfo(res.data);
+        } else {
+          EditorStore.setState({ gitInfoError: (res.data && res.data.error) || 'Failed to load git info' });
+        }
+        return res.data;
+      })
+      .catch(function(err) {
+        EditorStore.setState({ gitInfoError: err.message || 'Failed to load git info' });
+        EditorStore.setStatus("Failed to fetch git info: " + err.message, "error");
+      });
+  }
+
+  function fetchStatus() {
+    return fetchInfo().then(function(data) {
+      if (data && data.ok) return data;
+
+      return axios.get(basePath() + '/git_status')
+      .then(function(res) {
+        if (res.data.ok) {
+          EditorStore.setState({
+            gitFiles: res.data.files,
+            gitBranch: res.data.branch || "",
+            gitInfo: {
+              ok: true,
+              branch: res.data.branch || "",
+              workingTree: res.data.files || [],
+              unpushedFiles: [],
+              unpushedCommits: [],
+              branchCommits: []
+            },
+            gitInfoError: null
+          });
+        }
+        return res.data;
+      })
+      .catch(function(err) {
+        EditorStore.setStatus("Failed to fetch git status: " + err.message, "error");
+      });
+    });
+  }
+
+  function fetchDiff(path, baseSha, headSha) {
+    var query = '?file=' + encodeURIComponent(path);
+    if (baseSha) query += '&base=' + encodeURIComponent(baseSha);
+    if (headSha) query += '&head=' + encodeURIComponent(headSha);
+    
+    return axios.get(basePath() + '/git/diff' + query).then(function(res) {
+      return res.data;
+    });
+  }
+
+  function fetchBlame(path) {
+    return axios.get(basePath() + '/git/blame?file=' + encodeURIComponent(path)).then(function(res) {
+      return res.data;
+    });
+  }
+
+  function fetchFileHistory(path) {
+    return axios.get(basePath() + '/git/file_history?file=' + encodeURIComponent(path)).then(function(res) {
+      return res.data;
+    });
+  }
+
+  function fetchCommitGraph() {
+    return axios.get(basePath() + '/git/commit_graph').then(function(res) {
+      return res.data;
+    });
+  }
+
+  function fetchCommitDetail(sha) {
+    return axios.get(basePath() + '/git/commit_detail?sha=' + encodeURIComponent(sha)).then(function(res) {
+      return res.data;
+    });
+  }
+
+  return {
+    fetchStatus: fetchStatus,
+    fetchInfo: fetchInfo,
+    fetchDiff: fetchDiff,
+    fetchBlame: fetchBlame,
+    fetchFileHistory: fetchFileHistory,
+    fetchCommitGraph: fetchCommitGraph,
+    fetchCommitDetail: fetchCommitDetail
+  };
+})();

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

@@ -0,0 +1,63 @@
+var SearchService = (function () {
+  function basePath() {
+    return (window.MBEDITOR_BASE_PATH || '/mbeditor').replace(/\/$/, '');
+  }
+
+  var _miniSearch = new MiniSearch({
+    fields: ['path', 'name'], // indexed fields
+    storeFields: ['path', 'name'] // returned fields
+  });
+
+  function buildIndex(treeData) {
+    // Capture the tree data immediately so a subsequent refresh doesn't
+    // clobber us before the idle callback fires.
+    var snapshot = treeData;
+    var schedule = window.requestIdleCallback || function(cb) { setTimeout(cb, 50); };
+    schedule(function() {
+      var docs = [];
+      var idCounter = 1;
+
+      function traverse(nodes) {
+        nodes.forEach(function(n) {
+          if (n.type === 'file') {
+            docs.push({ id: idCounter++, path: n.path, name: n.name });
+          } else if (n.children) {
+            traverse(n.children);
+          }
+        });
+      }
+
+      traverse(snapshot);
+      _miniSearch.removeAll();
+      _miniSearch.addAll(docs);
+    });
+  }
+
+  function searchFiles(query) {
+    if (!query) return [];
+    return _miniSearch.search(query, { prefix: true, fuzzy: 0.2 });
+  }
+
+  function projectSearch(query) {
+    if (!query) return Promise.resolve({ results: [], capped: false });
+    return axios.get(basePath() + '/search', { params: { q: query } })
+      .then(function(res) {
+        var data = res.data;
+        // Handle both old array response and new {results, capped} shape
+        var results = Array.isArray(data) ? data : (data && data.results || []);
+        var capped = !Array.isArray(data) && !!(data && data.capped);
+        EditorStore.setState({ searchResults: results, searchCapped: capped });
+        return { results: results, capped: capped };
+      })
+      .catch(function(err) {
+        EditorStore.setStatus("Search failed: " + err.message, "error");
+        return { results: [], capped: false };
+      });
+  }
+
+  return {
+    buildIndex: buildIndex,
+    searchFiles: searchFiles,
+    projectSearch: projectSearch
+  };
+})();