@mongoosejs/studio 0.3.1 → 0.3.2

package/DEVGUIDE.md

@@ -0,0 +1,8 @@
+## Running Locally
+
+To run this repo locally:
+
+1. Install dependencies with `npm install`
+2. Seed the database with `npm run seed`. Make sure you have a MongoDB instance running on `localhost:27017`.
+3. Run backend on port 7777. Make sure to seed backend as well.
+4. Start the server with `npm start`

package/backend/actions/Dashboard/getDashboard.js

@@ -23,16 +23,17 @@ const GetDashboardParams = new Archetype({
   }
 }).compile('GetDashboardParams');
 
-module.exports = ({ db }) => async function getDashboard(params) {
+module.exports = ({ db, options }) => async function getDashboard(params) {
   const { $workspaceId, authorization, dashboardId, evaluate, roles } = new GetDashboardParams(params);
   const Dashboard = db.model('__Studio_Dashboard');
+  const mothershipUrl = options?._mothershipUrl ?? 'https://mongoose-js.netlify.app/.netlify/functions';
 
   await authorize('Dashboard.getDashboard', roles);
 
   const dashboard = await Dashboard.findOne({ _id: dashboardId });
   if (evaluate) {
     let result = null;
-    const startExec = startDashboardEvaluate(dashboardId, $workspaceId, authorization);
+    const startExec = startDashboardEvaluate(dashboardId, $workspaceId, authorization, mothershipUrl);
     // Avoid unhandled promise rejection since we handle the promise later.
     startExec.catch(() => {});
     try {
@@ -47,7 +48,8 @@ module.exports = ({ db }) => async function getDashboard(params) {
           $workspaceId,
           authorization,
           null,
-          { message: error.message }
+          { message: error.message },
+          mothershipUrl
         );
       });
       return { dashboard, dashboardResult, error: { message: error.message } };
@@ -62,7 +64,9 @@ module.exports = ({ db }) => async function getDashboard(params) {
           dashboardResult._id,
           $workspaceId,
           authorization,
-          result
+          result,
+          undefined,
+          mothershipUrl
         );
       });
 
@@ -71,12 +75,12 @@ module.exports = ({ db }) => async function getDashboard(params) {
       return { dashboard, error: { message: error.message } };
     }
   } else {
-    const { dashboardResults } = await getDashboardResults(dashboardId, $workspaceId, authorization);
+    const { dashboardResults } = await getDashboardResults(dashboardId, $workspaceId, authorization, mothershipUrl);
     return { dashboard, dashboardResults };
   }
 };
 
-async function completeDashboardEvaluate(dashboardResultId, workspaceId, authorization, result, error) {
+async function completeDashboardEvaluate(dashboardResultId, workspaceId, authorization, result, error, mothershipUrl) {
   if (!workspaceId) {
     return {};
   }
@@ -84,7 +88,7 @@ async function completeDashboardEvaluate(dashboardResultId, workspaceId, authori
   if (authorization) {
     headers.Authorization = authorization;
   }
-  const response = await fetch('https://mongoose-js.netlify.app/.netlify/functions/completeDashboardEvaluate', {
+  const response = await fetch(`${mothershipUrl}/completeDashboardEvaluate`, {
     method: 'POST',
     headers,
     body: JSON.stringify({
@@ -106,7 +110,7 @@ async function completeDashboardEvaluate(dashboardResultId, workspaceId, authori
   return await response.json();
 }
 
-async function startDashboardEvaluate(dashboardId, workspaceId, authorization) {
+async function startDashboardEvaluate(dashboardId, workspaceId, authorization, _mothershipUrl) {
   if (!workspaceId) {
     return {};
   }
@@ -114,7 +118,7 @@ async function startDashboardEvaluate(dashboardId, workspaceId, authorization) {
   if (authorization) {
     headers.Authorization = authorization;
   }
-  const response = await fetch('https://mongoose-js.netlify.app/.netlify/functions/startDashboardEvaluate', {
+  const response = await fetch(`${_mothershipUrl}/startDashboardEvaluate`, {
     method: 'POST',
     headers,
     body: JSON.stringify({
@@ -134,7 +138,7 @@ async function startDashboardEvaluate(dashboardId, workspaceId, authorization) {
   return await response.json();
 }
 
-async function getDashboardResults(dashboardId, workspaceId, authorization) {
+async function getDashboardResults(dashboardId, workspaceId, authorization, mothershipUrl) {
   if (!workspaceId) {
     return {};
   }
@@ -142,7 +146,7 @@ async function getDashboardResults(dashboardId, workspaceId, authorization) {
   if (authorization) {
     headers.Authorization = authorization;
   }
-  const response = await fetch('https://mongoose-js.netlify.app/.netlify/functions/getDashboardResults', {
+  const response = await fetch(`${mothershipUrl}/getDashboardResults`, {
     method: 'POST',
     headers,
     body: JSON.stringify({

package/frontend/public/app.js

@@ -1822,6 +1822,8 @@ module.exports = {
     }
   },
   async mounted() {
+    window.pageState = this;
+
     this.chatThreadId = this.threadId;
     const { chatThreads } = await api.ChatThread.listChatThreads();
     this.chatThreads = chatThreads;
@@ -2730,7 +2732,9 @@ module.exports = {
       return this.dashboardResults.length > 0 ? this.dashboardResults[0] : null;
     }
   },
-  mounted: async function() {
+  mounted: async function () {
+    window.pageState = this;
+
     document.addEventListener('click', this.handleDocumentClick);
     this.showEditor = this.$route.query.edit;
     await this.loadInitial();
@@ -7120,6 +7124,7 @@ module.exports = app => app.component('models', {
     this.destroyMap();
   },
   async mounted() {
+    window.pageState = this;
     this.onScroll = () => this.checkIfScrolledToBottom();
     document.addEventListener('scroll', this.onScroll, true);
     this.onPopState = () => this.initSearchFromUrl();
@@ -8294,7 +8299,8 @@ module.exports = app => app.component('navbar', {
     showFlyout: false,
     darkMode: typeof localStorage !== 'undefined' && localStorage.getItem('studio-theme') === 'dark'
   }),
-  mounted: function() {
+  mounted: function () {
+    window.navbar = this;
     const mobileMenuMask = document.querySelector('#mobile-menu-mask');
     const mobileMenu = document.querySelector('#mobile-menu');
     const openBtn = document.querySelector('#open-mobile-menu');
@@ -8348,7 +8354,7 @@ module.exports = app => app.component('navbar', {
       } else {
         return 'https://www.npmjs.com/package/@mongoosejs/task';
       }
-     
+
     }
   },
   methods: {
@@ -61661,7 +61667,7 @@ var src_default = VueToastificationPlugin;
 (module) {
 
 "use strict";
-module.exports = /*#__PURE__*/JSON.parse('{"name":"@mongoosejs/studio","version":"0.3.1","description":"A Mongoose-native MongoDB UI with schema-aware autocomplete, AI-assisted queries, and dashboards that understand your models - not just your data.","homepage":"https://mongoosestudio.app/","repository":{"type":"git","url":"https://github.com/mongoosejs/studio"},"license":"Apache-2.0","dependencies":{"@ai-sdk/anthropic":"2.x","@ai-sdk/google":"2.x","@ai-sdk/openai":"2.x","ace-builds":"^1.43.6","ai":"5.x","archetype":"0.13.1","csv-stringify":"6.3.0","ejson":"^2.2.3","extrovert":"^0.2.0","marked":"15.0.12","node-inspect-extracted":"3.x","regexp.escape":"^2.0.1","tailwindcss":"3.4.0","vue":"3.x","vue-toastification":"^2.0.0-rc.5","webpack":"5.x","xss":"^1.0.15"},"peerDependencies":{"mongoose":"7.x || 8.x || ^9.0.0"},"optionalPeerDependencies":{"@mongoosejs/task":"0.5.x || 0.6.x"},"devDependencies":{"@masteringjs/eslint-config":"0.1.1","axios":"1.2.2","dedent":"^1.6.0","eslint":"9.30.0","express":"4.x","mocha":"10.2.0","mongodb-memory-server":"^11.0.1","mongoose":"9.x","sinon":"^21.0.1"},"scripts":{"lint":"eslint .","tailwind":"tailwindcss -o ./frontend/public/tw.css","tailwind:watch":"tailwindcss -o ./frontend/public/tw.css --watch","test":"mocha test/*.test.js","test:frontend":"mocha test/frontend/*.test.js"}}');
+module.exports = /*#__PURE__*/JSON.parse('{"name":"@mongoosejs/studio","version":"0.3.2","description":"A Mongoose-native MongoDB UI with schema-aware autocomplete, AI-assisted queries, and dashboards that understand your models - not just your data.","homepage":"https://mongoosestudio.app/","repository":{"type":"git","url":"https://github.com/mongoosejs/studio"},"license":"Apache-2.0","dependencies":{"@ai-sdk/anthropic":"2.x","@ai-sdk/google":"2.x","@ai-sdk/openai":"2.x","ace-builds":"^1.43.6","ai":"5.x","archetype":"0.13.1","csv-stringify":"6.3.0","ejson":"^2.2.3","extrovert":"^0.2.0","marked":"15.0.12","node-inspect-extracted":"3.x","regexp.escape":"^2.0.1","tailwindcss":"3.4.0","vue":"3.x","vue-toastification":"^2.0.0-rc.5","webpack":"5.x","xss":"^1.0.15"},"peerDependencies":{"mongoose":"7.x || 8.x || ^9.0.0"},"optionalPeerDependencies":{"@mongoosejs/task":"0.5.x || 0.6.x"},"devDependencies":{"@masteringjs/eslint-config":"0.1.1","axios":"1.2.2","dedent":"^1.6.0","eslint":"9.30.0","express":"4.x","mocha":"10.2.0","mongodb-memory-server":"^11.0.1","mongoose":"9.x","sinon":"^21.0.1"},"scripts":{"lint":"eslint .","seed":"node seed/index.js","start":"node ./local.js","tailwind":"tailwindcss -o ./frontend/public/tw.css","tailwind:watch":"tailwindcss -o ./frontend/public/tw.css --watch","test":"mocha test/*.test.js","test:frontend":"mocha test/frontend/*.test.js"}}');
 
 /***/ }
 

package/frontend/src/chat/chat.js

@@ -192,6 +192,8 @@ module.exports = {
     }
   },
   async mounted() {
+    window.pageState = this;
+
     this.chatThreadId = this.threadId;
     const { chatThreads } = await api.ChatThread.listChatThreads();
     this.chatThreads = chatThreads;

package/frontend/src/dashboard/dashboard.js

@@ -157,7 +157,9 @@ module.exports = {
       return this.dashboardResults.length > 0 ? this.dashboardResults[0] : null;
     }
   },
-  mounted: async function() {
+  mounted: async function () {
+    window.pageState = this;
+
     document.addEventListener('click', this.handleDocumentClick);
     this.showEditor = this.$route.query.edit;
     await this.loadInitial();

package/frontend/src/models/models.js

@@ -79,6 +79,7 @@ module.exports = app => app.component('models', {
     this.destroyMap();
   },
   async mounted() {
+    window.pageState = this;
     this.onScroll = () => this.checkIfScrolledToBottom();
     document.addEventListener('scroll', this.onScroll, true);
     this.onPopState = () => this.initSearchFromUrl();

package/frontend/src/navbar/navbar.js

@@ -17,7 +17,8 @@ module.exports = app => app.component('navbar', {
     showFlyout: false,
     darkMode: typeof localStorage !== 'undefined' && localStorage.getItem('studio-theme') === 'dark'
   }),
-  mounted: function() {
+  mounted: function () {
+    window.navbar = this;
     const mobileMenuMask = document.querySelector('#mobile-menu-mask');
     const mobileMenu = document.querySelector('#mobile-menu');
     const openBtn = document.querySelector('#open-mobile-menu');
@@ -71,7 +72,7 @@ module.exports = app => app.component('navbar', {
       } else {
         return 'https://www.npmjs.com/package/@mongoosejs/task';
       }
-     
+
     }
   },
   methods: {

package/local.js

@@ -0,0 +1,38 @@
+'use strict';
+
+const mongoose = require('mongoose');
+const connect = require('./seed/connect');
+
+const express = require('express');
+const studio = require('./express');
+
+const getModelDescriptions = require('./backend/helpers/getModelDescriptions');
+
+Error.stackTraceLimit = 25;
+
+run().catch(err => {
+  console.error(err);
+  process.exit(-1);
+});
+
+async function run() {
+  const app = express();
+  await connect();
+
+  console.log(getModelDescriptions(mongoose.connection));
+
+  app.use('/studio', await studio(
+    null,
+    null,
+    {
+      __build: true,
+      __watch: process.env.WATCH,
+      _mothershipUrl: 'http://localhost:7777/.netlify/functions',
+      apiKey: 'TACO',
+      openAIAPIKey: process.env.OPENAI_API_KEY
+    })
+  );
+
+  await app.listen(3333);
+  console.log('Listening on port 3333');
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mongoosejs/studio",
-  "version": "0.3.1",
+  "version": "0.3.2",
   "description": "A Mongoose-native MongoDB UI with schema-aware autocomplete, AI-assisted queries, and dashboards that understand your models - not just your data.",
   "homepage": "https://mongoosestudio.app/",
   "repository": {
@@ -46,6 +46,8 @@
   },
   "scripts": {
     "lint": "eslint .",
+    "seed": "node seed/index.js",
+    "start": "node ./local.js",
     "tailwind": "tailwindcss -o ./frontend/public/tw.css",
     "tailwind:watch": "tailwindcss -o ./frontend/public/tw.css --watch",
     "test": "mocha test/*.test.js",

package/seed/connect.js

@@ -0,0 +1,23 @@
+'use strict';
+
+const mongoose = require('mongoose');
+
+const uri = 'mongodb://127.0.0.1:27017/mongoose_studio_test';
+
+module.exports = async function connect() {
+  await mongoose.connect(uri);
+
+  mongoose.model('User', new mongoose.Schema({
+    name: String,
+    email: String,
+    role: String,
+    plan: String,
+    status: String,
+    isDeleted: Boolean,
+    lastLoginAt: Date,
+    createdAt: Date,
+    updatedAt: Date
+  }, { collection: 'User' }));
+
+  return mongoose.connection;
+};

package/seed/index.js

@@ -0,0 +1,101 @@
+'use strict';
+
+const connect = require('./connect');
+const mongoose = require('mongoose');
+
+if (require.main === module) {
+  run().catch(err => {
+    console.error(err);
+    process.exit(1);
+  });
+}
+
+async function run() {
+  await connect();
+  const { User } = mongoose.models;
+  const dashboardCollection = mongoose.connection.collection('studio__dashboards');
+  const now = new Date();
+
+  const users = [
+    {
+      name: 'Ada Lovelace',
+      email: 'ada@example.com',
+      role: 'admin',
+      plan: 'enterprise',
+      status: 'active',
+      isDeleted: false,
+      lastLoginAt: new Date('2026-03-11T14:21:00.000Z'),
+      createdAt: new Date('2025-10-03T09:15:00.000Z'),
+      updatedAt: now
+    },
+    {
+      name: 'Grace Hopper',
+      email: 'grace@example.com',
+      role: 'analyst',
+      plan: 'pro',
+      status: 'active',
+      isDeleted: false,
+      lastLoginAt: new Date('2026-03-10T17:42:00.000Z'),
+      createdAt: new Date('2025-11-16T13:05:00.000Z'),
+      updatedAt: now
+    },
+    {
+      name: 'Linus Torvalds',
+      email: 'linus@example.com',
+      role: 'editor',
+      plan: 'starter',
+      status: 'invited',
+      isDeleted: false,
+      lastLoginAt: null,
+      createdAt: new Date('2026-01-09T11:30:00.000Z'),
+      updatedAt: now
+    },
+    {
+      name: 'Margaret Hamilton',
+      email: 'margaret@example.com',
+      role: 'viewer',
+      plan: 'pro',
+      status: 'inactive',
+      isDeleted: false,
+      lastLoginAt: new Date('2026-02-22T08:00:00.000Z'),
+      createdAt: new Date('2025-12-01T16:20:00.000Z'),
+      updatedAt: now
+    }
+  ];
+
+  const dashboard = {
+    title: 'User directory table',
+    description: 'Sample dashboard for testing the dashboard-table component.',
+    code: `const users = await db.model('User')
+  .find({ isDeleted: false })
+  .sort({ createdAt: -1 })
+  .lean();
+
+return {
+  $table: {
+    columns: ['Name', 'Email', 'Role', 'Plan', 'Status', 'Last Login'],
+    rows: users.map(user => [
+      user.name,
+      user.email,
+      user.role,
+      user.plan,
+      user.status,
+      user.lastLoginAt ? new Date(user.lastLoginAt).toISOString().slice(0, 10) : 'Never'
+    ])
+  }
+};`
+  };
+
+  await User.deleteMany({ email: { $in: users.map(user => user.email) } });
+  await dashboardCollection.deleteMany({ title: dashboard.title });
+
+  const insertedUsers = await User.insertMany(users);
+  const insertedDashboard = await dashboardCollection.insertOne(dashboard);
+
+  console.log(`Inserted ${insertedUsers.length} users`);
+  console.log(`Inserted dashboard ${insertedDashboard.insertedId.toString()}`);
+
+  await mongoose.disconnect();
+}
+
+module.exports = run;