@mongoosejs/studio 0.0.136 → 0.0.138

package/frontend/src/models/models.js

@@ -38,6 +38,7 @@ const QUERY_SELECTORS = [
 appendCSS(require('./models.css'));
 
 const limit = 20;
+const OUTPUT_TYPE_STORAGE_KEY = 'studio:model-output-type';
 
 module.exports = app => app.component('models', {
   template: template,
@@ -80,6 +81,7 @@ module.exports = app => app.component('models', {
   created() {
     this.currentModel = this.model;
     this.buildAutocompleteTrie();
+    this.loadOutputPreference();
   },
   beforeDestroy() {
     document.removeEventListener('scroll', this.onScroll, true);
@@ -108,6 +110,24 @@ module.exports = app => app.component('models', {
         this.autocompleteTrie.bulkInsert(paths, 10);
       }
     },
+    loadOutputPreference() {
+      if (typeof window === 'undefined' || !window.localStorage) {
+        return;
+      }
+      const storedPreference = window.localStorage.getItem(OUTPUT_TYPE_STORAGE_KEY);
+      if (storedPreference === 'json' || storedPreference === 'table') {
+        this.outputType = storedPreference;
+      }
+    },
+    setOutputType(type) {
+      if (type !== 'json' && type !== 'table') {
+        return;
+      }
+      this.outputType = type;
+      if (typeof window !== 'undefined' && window.localStorage) {
+        window.localStorage.setItem(OUTPUT_TYPE_STORAGE_KEY, type);
+      }
+    },
     buildDocumentFetchParams(options = {}) {
       const params = {
         model: this.currentModel,
@@ -547,41 +567,52 @@ module.exports = app => app.component('models', {
     },
     handleDocumentClick(document, event) {
       if (this.selectMultiple) {
-        const documentIndex = this.documents.findIndex(doc => doc._id.toString() == document._id.toString());
-        if (event?.shiftKey && this.selectedDocuments.length > 0) {
-          const anchorIndex = this.lastSelectedIndex;
-          if (anchorIndex != null && anchorIndex !== -1 && documentIndex !== -1) {
-            const start = Math.min(anchorIndex, documentIndex);
-            const end = Math.max(anchorIndex, documentIndex);
-            const selectedDocumentIds = new Set(this.selectedDocuments.map(doc => doc._id.toString()));
-            for (let i = start; i <= end; i++) {
-              const docInRange = this.documents[i];
-              const existsInRange = selectedDocumentIds.has(docInRange._id.toString());
-              if (!existsInRange) {
-                this.selectedDocuments.push(docInRange);
-              }
+        this.handleDocumentSelection(document, event);
+      } else {
+        this.openDocument(document);
+      }
+    },
+    handleDocumentContainerClick(document, event) {
+      if (this.selectMultiple) {
+        this.handleDocumentSelection(document, event);
+      }
+    },
+    handleDocumentSelection(document, event) {
+      const documentIndex = this.documents.findIndex(doc => doc._id.toString() == document._id.toString());
+      if (event?.shiftKey && this.selectedDocuments.length > 0) {
+        const anchorIndex = this.lastSelectedIndex;
+        if (anchorIndex != null && anchorIndex !== -1 && documentIndex !== -1) {
+          const start = Math.min(anchorIndex, documentIndex);
+          const end = Math.max(anchorIndex, documentIndex);
+          const selectedDocumentIds = new Set(this.selectedDocuments.map(doc => doc._id.toString()));
+          for (let i = start; i <= end; i++) {
+            const docInRange = this.documents[i];
+            const existsInRange = selectedDocumentIds.has(docInRange._id.toString());
+            if (!existsInRange) {
+              this.selectedDocuments.push(docInRange);
             }
-            this.lastSelectedIndex = documentIndex;
-            return;
           }
+          this.lastSelectedIndex = documentIndex;
+          return;
         }
-        const index = this.selectedDocuments.findIndex(x => x._id.toString() == document._id.toString());
-        if (index !== -1) {
-          this.selectedDocuments.splice(index, 1);
-          if (this.selectedDocuments.length === 0) {
-            this.lastSelectedIndex = null;
-          } else {
-            const lastDoc = this.selectedDocuments[this.selectedDocuments.length - 1];
-            this.lastSelectedIndex = this.documents.findIndex(doc => doc._id.toString() == lastDoc._id.toString());
-          }
+      }
+      const index = this.selectedDocuments.findIndex(x => x._id.toString() == document._id.toString());
+      if (index !== -1) {
+        this.selectedDocuments.splice(index, 1);
+        if (this.selectedDocuments.length === 0) {
+          this.lastSelectedIndex = null;
         } else {
-          this.selectedDocuments.push(document);
-          this.lastSelectedIndex = documentIndex;
+          const lastDoc = this.selectedDocuments[this.selectedDocuments.length - 1];
+          this.lastSelectedIndex = this.documents.findIndex(doc => doc._id.toString() == lastDoc._id.toString());
         }
       } else {
-        this.$router.push('/model/' + this.currentModel + '/document/' + document._id);
+        this.selectedDocuments.push(document);
+        this.lastSelectedIndex = documentIndex;
       }
     },
+    openDocument(document) {
+      this.$router.push('/model/' + this.currentModel + '/document/' + document._id);
+    },
     async deleteDocuments() {
       const documentIds = this.selectedDocuments.map(x => x._id);
       await api.Model.deleteDocuments({

package/next.js

@@ -0,0 +1,97 @@
+'use strict';
+
+const fs = require('fs');
+const path = require('path');
+
+module.exports = withMongooseStudio;
+
+/**
+ * Copies Mongoose Studio frontend assets and injects rewrites.
+ *
+ * @param {object} nextConfig - Existing Next.js config
+ * @param {object} [options]
+ * @param {string} [options.studioPath="/studio"] - Public base path for Studio frontend
+ */
+function withMongooseStudio(nextConfig = {}) {
+  const studioPath = normalizeBasePath(nextConfig.studioPath || '/studio');
+
+  return {
+    ...nextConfig,
+
+    async redirects() {
+      const userRedirects =
+      typeof nextConfig.redirects === 'function'
+        ? await nextConfig.redirects()
+        : nextConfig.redirects || [];
+
+      // Permanent redirect ensures browser URL is updated
+      const studioRedirect = {
+        source: studioPath,
+        destination: `${studioPath}/index.html`,
+        permanent: true,
+      };
+
+      return [...userRedirects, studioRedirect];
+    },
+
+    webpack(config, { isServer }) {
+       if (isServer) {
+         try {
+           copyStudioFrontend(studioPath);
+           console.log(`✅ Mongoose Studio: copied frontend to public${studioPath}`);
+         } catch (err) {
+           console.error('❌ Mongoose Studio: failed to copy frontend', err);
+         }
+       }
+
+       // Preserve user’s webpack config
+       if (typeof nextConfig.webpack === 'function') {
+         return nextConfig.webpack(config, { isServer });
+       }
+       return config;
+    },
+  };
+}
+
+/** Ensures path starts with "/" but not ends with "/" */
+function normalizeBasePath(p) {
+  let res = p.startsWith('/') ? p : '/' + p;
+  return res.endsWith('/') ? res.slice(0, -1) : res;
+}
+
+/** Copies all built frontend assets into /public/{studioPath} */
+function copyStudioFrontend(studioPath) {
+  const src = path.join(
+    path.dirname(require.resolve('@mongoosejs/studio/package.json')),
+    'frontend',
+    'public'
+  );
+  const dest = path.join(process.cwd(), 'public', studioPath.replace(/^\//, ''));
+
+  if (!fs.existsSync(src)) {
+    throw new Error(`Frontend build not found at ${src}`);
+  }
+
+  fs.mkdirSync(dest, { recursive: true });
+
+  // Node 16.7+ has fs.cpSync
+  if (fs.cpSync) {
+    fs.cpSync(src, dest, { recursive: true });
+  } else {
+    copyRecursiveSync(src, dest);
+  }
+}
+
+function copyRecursiveSync(src, dest) {
+  const entries = fs.readdirSync(src, { withFileTypes: true });
+  for (const entry of entries) {
+    const srcPath = path.join(src, entry.name);
+    const destPath = path.join(dest, entry.name);
+    if (entry.isDirectory()) {
+      fs.mkdirSync(destPath, { recursive: true });
+      copyRecursiveSync(srcPath, destPath);
+    } else {
+      fs.copyFileSync(srcPath, destPath);
+    }
+  }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mongoosejs/studio",
-  "version": "0.0.136",
+  "version": "0.0.138",
   "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": {

package/frontend/src/list-json/list-json.css

@@ -1,3 +0,0 @@
-.list-json {
-  width: 100%;
-}