@mongoosejs/studio 0.1.5 → 0.1.7

package/frontend/src/models/models.js

@@ -5,36 +5,6 @@ const template = require('./models.html');
 const mpath = require('mpath');
 
 const appendCSS = require('../appendCSS');
-const { Trie } = require('./trie');
-
-const QUERY_SELECTORS = [
-  '$eq',
-  '$ne',
-  '$gt',
-  '$gte',
-  '$lt',
-  '$lte',
-  '$in',
-  '$nin',
-  '$exists',
-  '$regex',
-  '$options',
-  '$text',
-  '$search',
-  '$and',
-  '$or',
-  '$nor',
-  '$not',
-  '$elemMatch',
-  '$size',
-  '$all',
-  '$type',
-  '$expr',
-  '$jsonSchema',
-  '$mod'
-];
-
-
 appendCSS(require('./models.css'));
 
 const limit = 20;
@@ -60,9 +30,6 @@ module.exports = app => app.component('models', {
     selectMultiple: false,
     selectedDocuments: [],
     searchText: '',
-    autocompleteSuggestions: [],
-    autocompleteIndex: 0,
-    autocompleteTrie: null,
     shouldShowExportModal: false,
     shouldShowCreateModal: false,
     shouldShowFieldModal: false,
@@ -81,7 +48,6 @@ module.exports = app => app.component('models', {
   }),
   created() {
     this.currentModel = this.model;
-    this.buildAutocompleteTrie();
     this.loadOutputPreference();
   },
   beforeDestroy() {
@@ -108,17 +74,18 @@ module.exports = app => app.component('models', {
 
     await this.initSearchFromUrl();
   },
-  methods: {
-    buildAutocompleteTrie() {
-      this.autocompleteTrie = new Trie();
-      this.autocompleteTrie.bulkInsert(QUERY_SELECTORS, 5);
-      if (Array.isArray(this.schemaPaths) && this.schemaPaths.length > 0) {
-        const paths = this.schemaPaths
-          .map(path => path?.path)
-          .filter(path => typeof path === 'string' && path.length > 0);
-        this.autocompleteTrie.bulkInsert(paths, 10);
+  computed: {
+    referenceMap() {
+      const map = {};
+      for (const path of this.filteredPaths) {
+        if (path?.ref) {
+          map[path.path] = path.ref;
+        }
       }
-    },
+      return map;
+    }
+  },
+  methods: {
     loadOutputPreference() {
       if (typeof window === 'undefined' || !window.localStorage) {
         return;
@@ -194,141 +161,6 @@ module.exports = app => app.component('models', {
       const { mongoDBIndexes } = await api.Model.dropIndex({ model: this.currentModel, name });
       this.mongoDBIndexes = mongoDBIndexes;
     },
-    initFilter(ev) {
-      if (!this.searchText) {
-        this.searchText = '{}';
-        this.$nextTick(() => {
-          ev.target.setSelectionRange(1, 1);
-        });
-      }
-    },
-    updateAutocomplete() {
-      const input = this.$refs.searchInput;
-      const cursorPos = input ? input.selectionStart : 0;
-      const before = this.searchText.slice(0, cursorPos);
-      const match = before.match(/(?:\{|,)\s*([^:\s]*)$/);
-      if (match && match[1]) {
-        const token = match[1];
-        const leadingQuoteMatch = token.match(/^["']/);
-        const trailingQuoteMatch = token.length > 1 && /["']$/.test(token)
-          ? token[token.length - 1]
-          : '';
-        const term = token
-          .replace(/^["']/, '')
-          .replace(trailingQuoteMatch ? new RegExp(`[${trailingQuoteMatch}]$`) : '', '')
-          .trim();
-        if (!term) {
-          this.autocompleteSuggestions = [];
-          return;
-        }
-        if (this.autocompleteTrie) {
-          const primarySuggestions = this.autocompleteTrie.getSuggestions(term, 10);
-          const suggestionsSet = new Set(primarySuggestions);
-          if (Array.isArray(this.schemaPaths) && this.schemaPaths.length > 0) {
-            for (const schemaPath of this.schemaPaths) {
-              const path = schemaPath?.path;
-              if (
-                typeof path === 'string' &&
-                path.startsWith(`${term}.`) &&
-                !suggestionsSet.has(path)
-              ) {
-                suggestionsSet.add(path);
-                if (suggestionsSet.size >= 10) {
-                  break;
-                }
-              }
-            }
-          }
-          let suggestions = Array.from(suggestionsSet);
-          if (leadingQuoteMatch) {
-            const leadingQuote = leadingQuoteMatch[0];
-            suggestions = suggestions.map(suggestion => `${leadingQuote}${suggestion}`);
-          }
-          if (trailingQuoteMatch) {
-            suggestions = suggestions.map(suggestion =>
-              suggestion.endsWith(trailingQuoteMatch) ? suggestion : `${suggestion}${trailingQuoteMatch}`
-            );
-          }
-          this.autocompleteSuggestions = suggestions;
-          this.autocompleteIndex = 0;
-          return;
-        }
-      }
-      this.autocompleteSuggestions = [];
-    },
-    handleKeyDown(ev) {
-      if (this.autocompleteSuggestions.length === 0) {
-        return;
-      }
-      if (ev.key === 'Tab' || ev.key === 'Enter') {
-        ev.preventDefault();
-        this.applySuggestion(this.autocompleteIndex);
-      } else if (ev.key === 'ArrowDown') {
-        ev.preventDefault();
-        this.autocompleteIndex = (this.autocompleteIndex + 1) % this.autocompleteSuggestions.length;
-      } else if (ev.key === 'ArrowUp') {
-        ev.preventDefault();
-        this.autocompleteIndex = (this.autocompleteIndex + this.autocompleteSuggestions.length - 1) % this.autocompleteSuggestions.length;
-      }
-    },
-    applySuggestion(index) {
-      const suggestion = this.autocompleteSuggestions[index];
-      if (!suggestion) {
-        return;
-      }
-      const input = this.$refs.searchInput;
-      const cursorPos = input.selectionStart;
-      const before = this.searchText.slice(0, cursorPos);
-      const after = this.searchText.slice(cursorPos);
-      const match = before.match(/(?:\{|,)\s*([^:\s]*)$/);
-      const colonNeeded = !/^\s*:/.test(after);
-      if (!match) {
-        return;
-      }
-      const token = match[1];
-      const start = cursorPos - token.length;
-      let replacement = suggestion;
-      const leadingQuote = token.startsWith('"') || token.startsWith('\'') ? token[0] : '';
-      const trailingQuote = token.length > 1 && (token.endsWith('"') || token.endsWith('\'')) ? token[token.length - 1] : '';
-      if (leadingQuote && !replacement.startsWith(leadingQuote)) {
-        replacement = `${leadingQuote}${replacement}`;
-      }
-      if (trailingQuote && !replacement.endsWith(trailingQuote)) {
-        replacement = `${replacement}${trailingQuote}`;
-      }
-      // Only insert : if we know the user isn't entering in a nested path
-      if (colonNeeded && (!leadingQuote || trailingQuote)) {
-        replacement = `${replacement}:`;
-      }
-      this.searchText = this.searchText.slice(0, start) + replacement + after;
-      this.$nextTick(() => {
-        const pos = start + replacement.length;
-        input.setSelectionRange(pos, pos);
-      });
-      this.autocompleteSuggestions = [];
-    },
-    clickFilter(path) {
-      if (this.searchText) {
-        if (this.searchText.endsWith('}')) {
-          this.searchText = this.searchText.slice(0, -1) + `, ${path}:  }`;
-        } else {
-          this.searchText += `, ${path}:  }`;
-        }
-
-      } else {
-        // If this.searchText is empty or undefined, initialize it with a new object
-        this.searchText = `{ ${path}:  }`;
-      }
-
-
-      this.$nextTick(() => {
-        const input = this.$refs.searchInput;
-        const cursorIndex = this.searchText.lastIndexOf(':') + 2; // Move cursor after ": "
-
-        input.focus();
-        input.setSelectionRange(cursorIndex, cursorIndex);
-      });
-    },
     async closeCreationModal() {
       this.shouldShowCreateModal = false;
       await this.getDocuments();
@@ -338,9 +170,10 @@ module.exports = app => app.component('models', {
     },
     filterDocument(doc) {
       const filteredDoc = {};
-      console.log(doc, this.filteredPaths);
       for (let i = 0; i < this.filteredPaths.length; i++) {
-        filteredDoc[this.filteredPaths[i].path] = doc[this.filteredPaths[i].path];
+        const path = this.filteredPaths[i].path;
+        const value = mpath.get(path, doc);
+        mpath.set(path, value, filteredDoc);
       }
       return filteredDoc;
     },
@@ -377,7 +210,8 @@ module.exports = app => app.component('models', {
       }
       await this.loadMoreDocuments();
     },
-    async search() {
+    async search(searchText) {
+      this.searchText = searchText;
       const hasSearch = typeof this.searchText === 'string' && this.searchText.trim().length > 0;
       if (hasSearch) {
         this.query.search = this.searchText;
@@ -392,6 +226,11 @@ module.exports = app => app.component('models', {
       await this.loadMoreDocuments();
       this.status = 'loaded';
     },
+    addPathFilter(path) {
+      if (this.$refs.documentSearch?.addPathFilter) {
+        this.$refs.documentSearch.addPathFilter(path);
+      }
+    },
     async openIndexModal() {
       this.shouldShowIndexModal = true;
       const { mongoDBIndexes, schemaIndexes } = await api.Model.getIndexes({ model: this.currentModel });
@@ -411,7 +250,6 @@ module.exports = app => app.component('models', {
       // Clear previous data
       this.documents = [];
       this.schemaPaths = [];
-      this.buildAutocompleteTrie();
       this.numDocuments = null;
       this.loadedAllDocs = false;
       this.lastSelectedIndex = null;
@@ -439,7 +277,6 @@ module.exports = app => app.component('models', {
           }
           this.filteredPaths = [...this.schemaPaths];
           this.selectedPaths = [...this.schemaPaths];
-          this.buildAutocompleteTrie();
           schemaPathsReceived = true;
         }
         if (event.numDocs !== undefined) {

package/frontend/src/models/trie.js

@@ -5,6 +5,7 @@ class TrieNode {
     this.children = Object.create(null);
     this.isEnd = false;
     this.freq = 0;
+    this.roles = new Set(); // semantic roles like 'fieldName', 'operator'
   }
 }
 
@@ -13,7 +14,7 @@ class Trie {
     this.root = new TrieNode();
   }
 
-  insert(word, freq = 1) {
+  insert(word, freq = 1, role = null) {
     if (!word) {
       return;
     }
@@ -26,27 +27,25 @@ class Trie {
     }
     node.isEnd = true;
     node.freq += freq;
+    if (role) {
+      node.roles.add(role);
+    }
   }
 
-  bulkInsert(words, freq = 1) {
-    if (!Array.isArray(words)) {
-      return;
-    }
-    for (const word of words) {
-      this.insert(word, freq);
-    }
+  bulkInsert(words, freq = 1, role = null) {
+    for (const word of words) this.insert(word, freq, role);
   }
 
-  collect(node, prefix, out) {
-    if (node.isEnd) {
+  collect(node, prefix, out, role) {
+    if (node.isEnd && (role == null || node.roles.has(role))) {
       out.push([prefix, node.freq]);
     }
     for (const [ch, child] of Object.entries(node.children)) {
-      this.collect(child, prefix + ch, out);
+      this.collect(child, prefix + ch, out, role);
     }
   }
 
-  suggest(prefix, limit = 10) {
+  suggest(prefix, limit = 10, role = null) {
     let node = this.root;
     for (const ch of prefix) {
       if (!node.children[ch]) {
@@ -55,19 +54,19 @@ class Trie {
       node = node.children[ch];
     }
     const results = [];
-    this.collect(node, prefix, results);
+    this.collect(node, prefix, results, role);
     results.sort((a, b) => b[1] - a[1]);
     return results.slice(0, limit).map(([word]) => word);
   }
 
-  fuzzySuggest(prefix, limit = 10) {
+  fuzzySuggest(prefix, limit = 10, role = null) {
     const results = new Set();
 
     const dfs = (node, path, edits) => {
       if (edits > 1) {
         return;
       }
-      if (node.isEnd && Math.abs(path.length - prefix.length) <= 1) {
+      if (node.isEnd && Math.abs(path.length - prefix.length) <= 1 && (role == null || node.roles.has(role))) {
         const dist = levenshtein(prefix, path);
         if (dist <= 1) {
           results.add(path);
@@ -83,17 +82,44 @@ class Trie {
     return Array.from(results).slice(0, limit);
   }
 
-  getSuggestions(prefix, limit = 10) {
+  getSuggestions(prefix, limit = 10, role = null) {
     if (!prefix) {
       return [];
     }
-    const exact = this.suggest(prefix, limit);
+    const exact = this.suggest(prefix, limit, role);
     if (exact.length >= limit) {
       return exact;
     }
-    const fuzzy = this.fuzzySuggest(prefix, limit - exact.length);
+    const fuzzy = this.fuzzySuggest(prefix, limit - exact.length, role);
     return [...exact, ...fuzzy];
   }
+
+  toString() {
+    const lines = [];
+    function dfs(node, prefix, depth) {
+      let line = '  '.repeat(depth);
+      if (prefix.length > 0) {
+        line += prefix[prefix.length - 1];
+      } else {
+        line += '(root)';
+      }
+      if (node.isEnd) {
+        line += ' *';
+      }
+      if (node.roles.size > 0) {
+        line += ' [' + Array.from(node.roles).join(',') + ']';
+      }
+      if (node.freq > 0) {
+        line += ` {freq:${node.freq}}`;
+      }
+      lines.push(line);
+      for (const ch of Object.keys(node.children).sort()) {
+        dfs(node.children[ch], prefix + ch, depth + 1);
+      }
+    }
+    dfs(this.root, '', 0);
+    return lines.join('\n');
+  }
 }
 
 function levenshtein(a, b) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mongoosejs/studio",
-  "version": "0.1.5",
+  "version": "0.1.7",
   "description": "A sleek, powerful MongoDB UI with built-in dashboarding and auth, seamlessly integrated with your Express, Vercel, or Netlify app.",
   "homepage": "https://studio.mongoosejs.io/",
   "repository": {
@@ -12,7 +12,7 @@
     "archetype": "0.13.1",
     "csv-stringify": "6.3.0",
     "ejson": "^2.2.3",
-    "extrovert": "^0.1.0",
+    "extrovert": "^0.2.0",
     "marked": "15.0.12",
     "node-inspect-extracted": "3.x",
     "tailwindcss": "3.4.0",
@@ -32,7 +32,7 @@
     "eslint": "9.30.0",
     "express": "4.x",
     "mocha": "10.2.0",
-    "mongoose": "8.x"
+    "mongoose": "9.x"
   },
   "scripts": {
     "lint": "eslint .",