@mongoosejs/studio 0.5.5 → 0.5.7

package/README.md

@@ -1,14 +1,14 @@
 # Mongoose Studio
 
-A sleek, powerful MongoDB UI with built-in dashboarding and auth, seamlessly integrated with your Express, Vercel, or Netlify app.
+An AI-Powered Data Workspace for MongoDB: Turn your MongoDB data into dashboards, maps, and interactive workflows - powered by your Mongoose models.
 
 ![NPM Version](https://img.shields.io/npm/v/@mongoosejs/studio)
 
 ## Getting Started
 
 Mongoose Studio is meant to run as a [sidecar](https://learn.microsoft.com/en-us/azure/architecture/patterns/sidecar) to your Node.js application, using the same Mongoose connection config.
-If your app runs on `acme.app`, Studio will be on `acme.app/studio` or whichever path you prefer.
-For local dev, if your app runs on `localhost:3000`, Studio will be on `localhost:3000/studio`.
+If your app runs on `acme.app`, Mongoose Studio will be on `acme.app/studio` or whichever path you prefer.
+For local dev, if your app runs on `localhost:3000`, Mongoose Studio will be on `localhost:3000/studio`.
 
 By default, Mongoose Studio does **not** provide any authentication or authorization.
 You can use Mongoose Studio for free for local development, but we recommend [Mongoose Studio Pro](https://studio.mongoosejs.io/#pricing) for when you want to go into production.
@@ -85,6 +85,38 @@ const handler = studio(
 export default handler;
 ```
 
+### Nest.js
+
+Add `MongooseStudioModule` to your app module as follows.
+Use `getConnectionToken()` so Mongoose Studio uses the same connection that `MongooseModule.forRoot()` creates.
+
+```typescript
+import { Module } from '@nestjs/common';
+import { MongooseModule, getConnectionToken } from '@nestjs/mongoose';
+import { MongooseStudioModule } from '@mongoosejs/studio/nest';
+
+@Module({
+  imports: [
+    MongooseModule.forRoot(process.env.MONGODB_URI),
+    MongooseStudioModule.forRoot({
+      connectionToken: getConnectionToken(),
+      apiKey: process.env.MONGOOSE_STUDIO_API_KEY // optional
+    })
+  ]
+})
+export class AppModule {}
+```
+
+With this setup, Mongoose Studio is available at `/studio`.
+If you mount Mongoose Studio on a different path, update the `path` option as follows.
+
+```typescript
+MongooseStudioModule.forRoot({
+  path: '/__studio', // Serve on `/__studio` rather than `/studio`
+  connectionToken: getConnectionToken()
+})
+```
+
 ### Netlify
 
 [Here is a full example of how to add Mongoose Studio to a Netlify repo](https://github.com/mongoosejs/studio.mongoosejs.io/commit/8b02ea367c8a1b7b4bcab290708f57d58f08210b).

package/backend/actions/Dashboard/createDashboard.js

@@ -2,6 +2,7 @@
 
 const Archetype = require('archetype');
 const authorize = require('../../authorize');
+const mongoose = require('mongoose');
 
 const CreateDashboardParams = new Archetype({
   title: {
@@ -12,18 +13,27 @@ const CreateDashboardParams = new Archetype({
     $type: 'string',
     $required: true
   },
+  initiatedById: {
+    $type: mongoose.Types.ObjectId,
+    $required: false
+  },
   roles: {
     $type: ['string']
   }
 }).compile('CreateDashboardParams');
 
 module.exports = ({ studioConnection }) => async function createDashboard(params) {
-  const { title, code, roles } = new CreateDashboardParams(params);
+  const { title, code, initiatedById, roles } = new CreateDashboardParams(params);
   const Dashboard = studioConnection.model('__Studio_Dashboard');
 
   await authorize('Dashboard.createDashboard', roles);
 
-  const dashboard = await Dashboard.create({ title, code });
+  const dashboard = await Dashboard.create({
+    title,
+    code,
+    createdById: initiatedById,
+    createdBy: params.initiatedBy
+  });
 
   return { dashboard };
 };

package/backend/actions/Dashboard/getDashboard.js

@@ -51,6 +51,7 @@ module.exports = ({ db, studioConnection, options }) => async function getDashbo
           return {};
         }
         return completeDashboardEvaluate(
+          Dashboard,
           DashboardResult,
           dashboardResult._id,
           null,
@@ -73,6 +74,7 @@ module.exports = ({ db, studioConnection, options }) => async function getDashbo
           return {};
         }
         return completeDashboardEvaluate(
+          Dashboard,
           DashboardResult,
           dashboardResult._id,
           result,
@@ -97,13 +99,15 @@ module.exports = ({ db, studioConnection, options }) => async function getDashbo
   }
 };
 
-async function completeDashboardEvaluate(DashboardResult, dashboardResultId, result, error, status) {
+async function completeDashboardEvaluate(Dashboard, DashboardResult, dashboardResultId, result, error, status) {
   const dashboardResult = await DashboardResult.findById(dashboardResultId).orFail();
-  dashboardResult.finishedEvaluatingAt = new Date();
+  const finishedEvaluatingAt = new Date();
+  dashboardResult.finishedEvaluatingAt = finishedEvaluatingAt;
   dashboardResult.result = result;
   dashboardResult.error = error;
   dashboardResult.status = status;
   await dashboardResult.save();
+  await Dashboard.updateOne({ _id: dashboardResult.dashboardId }, { $set: { lastEvaluatedAt: finishedEvaluatingAt } });
   return { dashboardResult };
 }
 

package/backend/actions/Dashboard/getDashboards.js

@@ -15,7 +15,9 @@ module.exports = ({ studioConnection }) => async function getDashboards(params)
 
   await authorize('Dashboard.getDashboards', roles);
 
-  const dashboards = await Dashboard.find();
+  const dashboards = await Dashboard
+    .find()
+    .sort({ isPinned: -1, createdAt: -1, _id: -1 });
 
   return { dashboards };
 };

package/backend/actions/Dashboard/updateDashboard.js

@@ -9,8 +9,7 @@ const UpdateDashboardParams = new Archetype({
     $required: true
   },
   code: {
-    $type: 'string',
-    $required: true
+    $type: 'string'
   },
   title: {
     $type: 'string'
@@ -18,19 +17,26 @@ const UpdateDashboardParams = new Archetype({
   description: {
     $type: 'string'
   },
+  isPinned: {
+    $type: 'boolean'
+  },
   roles: {
     $type: ['string']
   }
 }).compile('UpdateDashboardParams');
 
 module.exports = ({ studioConnection }) => async function updateDashboard(params) {
-  const { dashboardId, code, title, description, roles, evaluate } = new UpdateDashboardParams(params);
+  const { dashboardId, code, title, description, isPinned, roles, evaluate } = new UpdateDashboardParams(params);
 
   const Dashboard = studioConnection.models['__Studio_Dashboard'];
 
   await authorize('Dashboard.updateDashboard', roles);
 
-  const updateObj = { code };
+  const updateObj = {};
+
+  if (code != null) {
+    updateObj.code = code;
+  }
 
   if (title != null) {
     updateObj.title = title;
@@ -40,8 +46,15 @@ module.exports = ({ studioConnection }) => async function updateDashboard(params
     updateObj.description = description;
   }
 
-  const doc = await Dashboard.
-    findByIdAndUpdate(dashboardId, updateObj, { sanitizeFilter: true, returnDocument: 'after', overwriteImmutable: true });
+  if (isPinned != null) {
+    updateObj.isPinned = isPinned;
+  }
+
+  const doc = await Dashboard.findByIdAndUpdate(
+    dashboardId,
+    updateObj,
+    { sanitizeFilter: true, returnDocument: 'after' }
+  );
 
   return { doc };
 };

package/backend/db/dashboardSchema.js

@@ -13,6 +13,37 @@ const dashboardSchema = new mongoose.Schema({
   },
   description: {
     type: String
+  },
+  isPinned: {
+    type: Boolean
+  },
+  createdById: {
+    type: mongoose.Schema.Types.ObjectId
+  },
+  createdBy: {
+    name: String,
+    email: String
+  },
+  lastEvaluatedAt: {
+    type: Date
+  }
+}, { timestamps: true });
+
+dashboardSchema.post(['find', 'findOne'], async function(docs) {
+  const dashboards = Array.isArray(docs) ? docs : [docs];
+  for (const dashboard of dashboards) {
+    if (dashboard != null && dashboard.createdAt == null && dashboard._id?.getTimestamp) {
+      const createdAt = dashboard._id.getTimestamp();
+      if (!createdAt.valueOf()) {
+        continue;
+      }
+      dashboard.set('createdAt', createdAt, { overwriteImmutable: true });
+      await this.model.db.model('__Studio_Dashboard').updateOne(
+        { _id: dashboard._id },
+        { createdAt },
+        { overwriteImmutable: true }
+      );
+    }
   }
 });
 

package/backend/netlify.js

@@ -63,6 +63,7 @@ module.exports = function netlify(conn, options) {
       params.roles = roles;
       params.userId = user._id;
       params.initiatedById = user._id;
+      params.initiatedBy = user;
     }
 
     if (typeof actionName !== 'string') {

package/backend/next.js

@@ -64,6 +64,7 @@ module.exports = function next(conn, options) {
       params.roles = roles;
       params.userId = user._id;
       params.initiatedById = user._id;
+      params.initiatedBy = user;
     }
 
     if (typeof actionName !== 'string') {

package/express.js

@@ -9,6 +9,8 @@ const normalizeBindIPOption = require('./backend/helpers/normalizeBindIPOption')
 const { toRoute, objectRouter } = require('extrovert');
 const { defaultMothershipURL } = require('./constants');
 
+const jsonParser = express.json();
+
 module.exports = async function mongooseStudioExpressApp(apiUrl, conn, options) {
   const router = express.Router();
   options = options ? { changeStream: true, ...options } : { changeStream: true };
@@ -87,6 +89,7 @@ module.exports = async function mongooseStudioExpressApp(apiUrl, conn, options)
           req._internals.initiatedById = user._id;
           req._internals.roles = roles;
           req._internals.$workspaceId = workspace._id;
+          req._internals.initiatedBy = user;
 
           next();
         })
@@ -94,7 +97,12 @@ module.exports = async function mongooseStudioExpressApp(apiUrl, conn, options)
           return res.status(500).json({ message: err.message });
         });
     },
-    express.json(),
+    function parseJson(req, res, next) {
+      if (req.body !== undefined || req.readable === false) {
+        return next();
+      }
+      return jsonParser(req, res, next);
+    },
     objectRouter(backend, toRoute)
   );
 

package/frontend/public/app.js

@@ -3266,11 +3266,73 @@ module.exports = app => app.component('dashboards', {
   data: () => ({
     status: 'loading',
     dashboards: [],
+    searchText: '',
     showCreateDashboardModal: false,
     showDeleteDashboardModal: null,
     openMenuId: null
   }),
+  computed: {
+    filteredDashboards() {
+      const searchWords = getSearchWords(this.searchText);
+      let dashboards = this.dashboards;
+      if (searchWords.length === 0) {
+        return sortPinnedFirst(dashboards);
+      }
+      const searchPatterns = searchWords.map(word => new RegExp(escapeRegExp(word), 'i'));
+
+      dashboards = dashboards.filter(dashboard => {
+        const searchableText = `${dashboard.title || ''} ${dashboard.description || ''}`;
+        return searchPatterns.every(pattern => pattern.test(searchableText));
+      });
+
+      return sortPinnedFirst(dashboards);
+    }
+  },
   methods: {
+    highlightTitle(value) {
+      return this.highlightSearchText(value, 'underline decoration-primary underline-offset-2');
+    },
+    highlightDescription(value) {
+      return this.highlightSearchText(value, 'font-semibold text-content-secondary');
+    },
+    highlightSearchText(value, className) {
+      const text = value || '';
+      const searchWords = getSearchWords(this.searchText);
+      if (searchWords.length === 0) {
+        return escapeHtml(text);
+      }
+      const searchPattern = new RegExp(searchWords.map(escapeRegExp).join('|'), 'ig');
+
+      let html = '';
+      let lastIndex = 0;
+      let match = searchPattern.exec(text);
+      while (match != null) {
+        html += escapeHtml(text.slice(lastIndex, match.index));
+        html += `<span class="${className}">${escapeHtml(match[0])}</span>`;
+        lastIndex = match.index + match[0].length;
+        match = searchPattern.exec(text);
+      }
+      html += escapeHtml(text.slice(lastIndex));
+      return html;
+    },
+    formatDate(value) {
+      if (!value) {
+        return '-';
+      }
+      const date = new Date(value);
+      if (Number.isNaN(date.getTime())) {
+        return '-';
+      }
+      return new Intl.DateTimeFormat(undefined, {
+        dateStyle: 'medium',
+        timeStyle: 'short'
+      }).format(date);
+    },
+    formatUser(dashboard) {
+      return dashboard.createdBy?.name ||
+        dashboard.createdBy?.email ||
+        (dashboard.createdById ? dashboard.createdById.toString() : '-');
+    },
     toggleMenu(id) {
       this.openMenuId = this.openMenuId === id ? null : id;
     },
@@ -3290,8 +3352,19 @@ module.exports = app => app.component('dashboards', {
       this.$toast.success('Dashboard deleted!');
     },
     insertNewDashboard(dashboard) {
-      this.dashboards.push(dashboard);
+      this.dashboards.unshift(dashboard);
       this.showCreateDashboardModal = false;
+    },
+    async togglePin(dashboard) {
+      if (!dashboard) {
+        return;
+      }
+
+      const { doc } = await api.Dashboard.updateDashboard({
+        dashboardId: dashboard._id,
+        isPinned: !dashboard.isPinned
+      });
+      dashboard.isPinned = doc.isPinned;
     }
   },
   directives: {
@@ -3316,6 +3389,28 @@ module.exports = app => app.component('dashboards', {
   }
 });
 
+function escapeHtml(value) {
+  return value.toString().
+    replace(/&/g, '&amp;').
+    replace(/</g, '&lt;').
+    replace(/>/g, '&gt;').
+    replace(/"/g, '&quot;').
+    replace(/'/g, '&#39;');
+}
+
+function escapeRegExp(value) {
+  return value.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+}
+
+function getSearchWords(searchText) {
+  return Array.from(new Set(searchText.trim().split(/\s+/).filter(Boolean))).
+    sort((a, b) => b.length - a.length);
+}
+
+function sortPinnedFirst(dashboards) {
+  return dashboards.slice().sort((a, b) => Number(Boolean(b.isPinned)) - Number(Boolean(a.isPinned)));
+}
+
 
 /***/ },
 
@@ -12604,7 +12699,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ });
 /* harmony import */ var _vue_shared__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @vue/shared */ "./node_modules/@vue/shared/dist/shared.esm-bundler.js");
 /**
-* @vue/reactivity v3.5.35
+* @vue/reactivity v3.5.38
 * (c) 2018-present Yuxi (Evan) You and Vue contributors
 * @license MIT
 **/
@@ -14501,8 +14596,9 @@ function watch(source, cb, options = _vue_shared__WEBPACK_IMPORTED_MODULE_0__.EM
   if (once && cb) {
     const _cb = cb;
     cb = (...args) => {
-      _cb(...args);
+      const res = _cb(...args);
       watchHandle();
+      return res;
     };
   }
   let oldValue = isMultiSource ? new Array(source.length).fill(INITIAL_WATCHER_VALUE) : INITIAL_WATCHER_VALUE;
@@ -14512,7 +14608,7 @@ function watch(source, cb, options = _vue_shared__WEBPACK_IMPORTED_MODULE_0__.EM
     }
     if (cb) {
       const newValue = effect.run();
-      if (deep || forceTrigger || (isMultiSource ? newValue.some((v, i) => (0,_vue_shared__WEBPACK_IMPORTED_MODULE_0__.hasChanged)(v, oldValue[i])) : (0,_vue_shared__WEBPACK_IMPORTED_MODULE_0__.hasChanged)(newValue, oldValue))) {
+      if (immediateFirstRun || deep || forceTrigger || (isMultiSource ? newValue.some((v, i) => (0,_vue_shared__WEBPACK_IMPORTED_MODULE_0__.hasChanged)(v, oldValue[i])) : (0,_vue_shared__WEBPACK_IMPORTED_MODULE_0__.hasChanged)(newValue, oldValue))) {
         if (cleanup) {
           cleanup();
         }
@@ -14772,7 +14868,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _vue_reactivity__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @vue/reactivity */ "./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js");
 /* harmony import */ var _vue_shared__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @vue/shared */ "./node_modules/@vue/shared/dist/shared.esm-bundler.js");
 /**
-* @vue/runtime-core v3.5.35
+* @vue/runtime-core v3.5.38
 * (c) 2018-present Yuxi (Evan) You and Vue contributors
 * @license MIT
 **/
@@ -17504,13 +17600,21 @@ function defineAsyncComponent(source) {
       const loaded = (0,_vue_reactivity__WEBPACK_IMPORTED_MODULE_0__.ref)(false);
       const error = (0,_vue_reactivity__WEBPACK_IMPORTED_MODULE_0__.ref)();
       const delayed = (0,_vue_reactivity__WEBPACK_IMPORTED_MODULE_0__.ref)(!!delay);
+      let timeoutTimer;
+      let delayTimer;
+      onUnmounted(() => {
+        if (timeoutTimer != null) clearTimeout(timeoutTimer);
+        if (delayTimer != null) clearTimeout(delayTimer);
+      });
       if (delay) {
-        setTimeout(() => {
+        delayTimer = setTimeout(() => {
+          if (instance.isUnmounted) return;
           delayed.value = false;
         }, delay);
       }
       if (timeout != null) {
-        setTimeout(() => {
+        timeoutTimer = setTimeout(() => {
+          if (instance.isUnmounted) return;
           if (!loaded.value && !error.value) {
             const err = new Error(
               `Async component timed out after ${timeout}ms.`
@@ -17521,11 +17625,16 @@ function defineAsyncComponent(source) {
         }, timeout);
       }
       load().then(() => {
+        if (instance.isUnmounted) return;
         loaded.value = true;
         if (instance.parent && isKeepAlive(instance.parent.vnode)) {
           instance.parent.update();
         }
       }).catch((err) => {
+        if (instance.isUnmounted) {
+          pendingRequest = null;
+          return;
+        }
         onError(err);
         error.value = err;
       });
@@ -19107,13 +19216,20 @@ function useModel(props, name, options = _vue_shared__WEBPACK_IMPORTED_MODULE_1_
           return;
         }
         const rawProps = i.vnode.props;
-        if (!(rawProps && // check if parent has passed v-model
-        (name in rawProps || camelizedName in rawProps || hyphenatedName in rawProps) && (`onUpdate:${name}` in rawProps || `onUpdate:${camelizedName}` in rawProps || `onUpdate:${hyphenatedName}` in rawProps))) {
+        const hasVModel = !!(rawProps && // check if parent has passed v-model
+        (name in rawProps || camelizedName in rawProps || hyphenatedName in rawProps) && (`onUpdate:${name}` in rawProps || `onUpdate:${camelizedName}` in rawProps || `onUpdate:${hyphenatedName}` in rawProps));
+        if (!hasVModel) {
           localValue = value;
           trigger();
         }
         i.emit(`update:${name}`, emittedValue);
-        if ((0,_vue_shared__WEBPACK_IMPORTED_MODULE_1__.hasChanged)(value, emittedValue) && (0,_vue_shared__WEBPACK_IMPORTED_MODULE_1__.hasChanged)(value, prevSetValue) && !(0,_vue_shared__WEBPACK_IMPORTED_MODULE_1__.hasChanged)(emittedValue, prevEmittedValue)) {
+        if ((0,_vue_shared__WEBPACK_IMPORTED_MODULE_1__.hasChanged)(value, prevSetValue) && ((0,_vue_shared__WEBPACK_IMPORTED_MODULE_1__.hasChanged)(value, emittedValue) && !(0,_vue_shared__WEBPACK_IMPORTED_MODULE_1__.hasChanged)(emittedValue, prevEmittedValue) || // #13524: browsers differ in when they flush microtasks between
+        // event listeners. If a v-model listener emits an intermediate value
+        // and a following listener restores the model to its previous prop
+        // value before parent updates are flushed, the parent render can be
+        // deduped as having no prop change. Force a local update so DOM state
+        // such as an input's value is synchronized back to the current model.
+        hasVModel && prevSetValue !== _vue_shared__WEBPACK_IMPORTED_MODULE_1__.EMPTY_OBJ && !(0,_vue_shared__WEBPACK_IMPORTED_MODULE_1__.hasChanged)(emittedValue, localValue))) {
           trigger();
         }
         prevSetValue = value;
@@ -23375,7 +23491,7 @@ function isMemoSame(cached, memo) {
   return true;
 }
 
-const version = "3.5.35";
+const version = "3.5.38";
 const warn =  true ? warn$1 : 0;
 const ErrorTypeStrings = ErrorTypeStrings$1 ;
 const devtools =  true ? devtools$1 : 0;
@@ -23586,7 +23702,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _vue_runtime_core__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @vue/runtime-core */ "./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js");
 /* harmony import */ var _vue_runtime_core__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @vue/shared */ "./node_modules/@vue/shared/dist/shared.esm-bundler.js");
 /**
-* @vue/runtime-dom v3.5.35
+* @vue/runtime-dom v3.5.38
 * (c) 2018-present Yuxi (Evan) You and Vue contributors
 * @license MIT
 **/
@@ -25048,7 +25164,8 @@ const TransitionGroupImpl = /* @__PURE__ */ decorate({
       if (children) {
         for (let i = 0; i < children.length; i++) {
           const child = children[i];
-          if (child.el && child.el instanceof Element) {
+          if (child.el && child.el instanceof Element && // Hidden v-show nodes have no previous layout box to animate from.
+          !child.el[vShowHidden]) {
             prevChildren.push(child);
             (0,_vue_runtime_core__WEBPACK_IMPORTED_MODULE_0__.setTransitionHooks)(
               child,
@@ -25684,7 +25801,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   toTypeString: () => (/* binding */ toTypeString)
 /* harmony export */ });
 /**
-* @vue/shared v3.5.35
+* @vue/shared v3.5.38
 * (c) 2018-present Yuxi (Evan) You and Vue contributors
 * @license MIT
 **/
@@ -50528,6 +50645,128 @@ module.exports = {
 
 "use strict";
 
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.setUint32LE = exports.readUint8 = exports.readInt32LE = exports.UUID = exports.Timestamp = exports.serialize = exports.ObjectId = exports.NumberUtils = exports.MinKey = exports.MaxKey = exports.Long = exports.Int32 = exports.EJSON = exports.Double = exports.deserialize = exports.Decimal128 = exports.DBRef = exports.Code = exports.calculateObjectSize = exports.ByteUtils = exports.BSONType = exports.BSONSymbol = exports.BSONRegExp = exports.BSONError = exports.BSON = exports.Binary = void 0;
+exports.parseToElementsToArray = parseToElementsToArray;
+exports.pluckBSONSerializeOptions = pluckBSONSerializeOptions;
+exports.resolveBSONOptions = resolveBSONOptions;
+exports.parseUtf8ValidationOption = parseUtf8ValidationOption;
+/* eslint-disable no-restricted-imports */
+const bson_1 = __webpack_require__(/*! bson */ "./node_modules/bson/lib/bson.mjs");
+var bson_2 = __webpack_require__(/*! bson */ "./node_modules/bson/lib/bson.mjs");
+Object.defineProperty(exports, "Binary", ({ enumerable: true, get: function () { return bson_2.Binary; } }));
+Object.defineProperty(exports, "BSON", ({ enumerable: true, get: function () { return bson_2.BSON; } }));
+Object.defineProperty(exports, "BSONError", ({ enumerable: true, get: function () { return bson_2.BSONError; } }));
+Object.defineProperty(exports, "BSONRegExp", ({ enumerable: true, get: function () { return bson_2.BSONRegExp; } }));
+Object.defineProperty(exports, "BSONSymbol", ({ enumerable: true, get: function () { return bson_2.BSONSymbol; } }));
+Object.defineProperty(exports, "BSONType", ({ enumerable: true, get: function () { return bson_2.BSONType; } }));
+Object.defineProperty(exports, "ByteUtils", ({ enumerable: true, get: function () { return bson_2.ByteUtils; } }));
+Object.defineProperty(exports, "calculateObjectSize", ({ enumerable: true, get: function () { return bson_2.calculateObjectSize; } }));
+Object.defineProperty(exports, "Code", ({ enumerable: true, get: function () { return bson_2.Code; } }));
+Object.defineProperty(exports, "DBRef", ({ enumerable: true, get: function () { return bson_2.DBRef; } }));
+Object.defineProperty(exports, "Decimal128", ({ enumerable: true, get: function () { return bson_2.Decimal128; } }));
+Object.defineProperty(exports, "deserialize", ({ enumerable: true, get: function () { return bson_2.deserialize; } }));
+Object.defineProperty(exports, "Double", ({ enumerable: true, get: function () { return bson_2.Double; } }));
+Object.defineProperty(exports, "EJSON", ({ enumerable: true, get: function () { return bson_2.EJSON; } }));
+Object.defineProperty(exports, "Int32", ({ enumerable: true, get: function () { return bson_2.Int32; } }));
+Object.defineProperty(exports, "Long", ({ enumerable: true, get: function () { return bson_2.Long; } }));
+Object.defineProperty(exports, "MaxKey", ({ enumerable: true, get: function () { return bson_2.MaxKey; } }));
+Object.defineProperty(exports, "MinKey", ({ enumerable: true, get: function () { return bson_2.MinKey; } }));
+Object.defineProperty(exports, "NumberUtils", ({ enumerable: true, get: function () { return bson_2.NumberUtils; } }));
+Object.defineProperty(exports, "ObjectId", ({ enumerable: true, get: function () { return bson_2.ObjectId; } }));
+Object.defineProperty(exports, "serialize", ({ enumerable: true, get: function () { return bson_2.serialize; } }));
+Object.defineProperty(exports, "Timestamp", ({ enumerable: true, get: function () { return bson_2.Timestamp; } }));
+Object.defineProperty(exports, "UUID", ({ enumerable: true, get: function () { return bson_2.UUID; } }));
+function parseToElementsToArray(bytes, offset) {
+    const res = bson_1.BSON.onDemand.parseToElements(bytes, offset);
+    return Array.isArray(res) ? res : [...res];
+}
+// validates buffer inputs, used for read operations
+const validateBufferInputs = (buffer, offset, length) => {
+    if (offset < 0 || offset + length > buffer.length) {
+        throw new RangeError(`Attempt to access memory outside buffer bounds: buffer length: ${buffer.length}, offset: ${offset}, length: ${length}`);
+    }
+};
+// readInt32LE, reads a 32-bit integer from buffer at given offset
+// throws if offset is out of bounds
+const readInt32LE = (buffer, offset) => {
+    validateBufferInputs(buffer, offset, 4);
+    return bson_1.NumberUtils.getInt32LE(buffer, offset);
+};
+exports.readInt32LE = readInt32LE;
+// readUint8, reads a single unsigned byte from buffer at given offset
+const readUint8 = (buffer, offset) => {
+    validateBufferInputs(buffer, offset, 1);
+    return buffer[offset];
+};
+exports.readUint8 = readUint8;
+const setUint32LE = (destination, offset, value) => {
+    destination[offset] = value;
+    value >>>= 8;
+    destination[offset + 1] = value;
+    value >>>= 8;
+    destination[offset + 2] = value;
+    value >>>= 8;
+    destination[offset + 3] = value;
+    return 4;
+};
+exports.setUint32LE = setUint32LE;
+function pluckBSONSerializeOptions(options) {
+    const { fieldsAsRaw, useBigInt64, promoteValues, promoteBuffers, promoteLongs, serializeFunctions, ignoreUndefined, bsonRegExp, raw, enableUtf8Validation } = options;
+    return {
+        fieldsAsRaw,
+        useBigInt64,
+        promoteValues,
+        promoteBuffers,
+        promoteLongs,
+        serializeFunctions,
+        ignoreUndefined,
+        bsonRegExp,
+        raw,
+        enableUtf8Validation
+    };
+}
+/**
+ * Merge the given BSONSerializeOptions, preferring options over the parent's options, and
+ * substituting defaults for values not set.
+ *
+ * @internal
+ */
+function resolveBSONOptions(options, parent) {
+    const parentOptions = parent?.bsonOptions;
+    return {
+        raw: options?.raw ?? parentOptions?.raw ?? false,
+        useBigInt64: options?.useBigInt64 ?? parentOptions?.useBigInt64 ?? false,
+        promoteLongs: options?.promoteLongs ?? parentOptions?.promoteLongs ?? true,
+        promoteValues: options?.promoteValues ?? parentOptions?.promoteValues ?? true,
+        promoteBuffers: options?.promoteBuffers ?? parentOptions?.promoteBuffers ?? false,
+        ignoreUndefined: options?.ignoreUndefined ?? parentOptions?.ignoreUndefined ?? false,
+        bsonRegExp: options?.bsonRegExp ?? parentOptions?.bsonRegExp ?? false,
+        serializeFunctions: options?.serializeFunctions ?? parentOptions?.serializeFunctions ?? false,
+        fieldsAsRaw: options?.fieldsAsRaw ?? parentOptions?.fieldsAsRaw ?? {},
+        enableUtf8Validation: options?.enableUtf8Validation ?? parentOptions?.enableUtf8Validation ?? true
+    };
+}
+/** @internal */
+function parseUtf8ValidationOption(options) {
+    const enableUtf8Validation = options?.enableUtf8Validation;
+    if (enableUtf8Validation === false) {
+        return { utf8: false };
+    }
+    return { utf8: { writeErrors: false } };
+}
+//# sourceMappingURL=bson.js.map
+
+/***/ },
+
+/***/ "./node_modules/mongoose/node_modules/mongodb/lib/bson.js"
+/*!****************************************************************!*\
+  !*** ./node_modules/mongoose/node_modules/mongodb/lib/bson.js ***!
+  \****************************************************************/
+(__unused_webpack_module, exports, __webpack_require__) {
+
+"use strict";
+
 Object.defineProperty(exports, "__esModule", ({ value: true }));
 exports.setUint32LE = exports.readInt32LE = exports.UUID = exports.Timestamp = exports.serialize = exports.ObjectId = exports.NumberUtils = exports.MinKey = exports.MaxKey = exports.Long = exports.Int32 = exports.EJSON = exports.Double = exports.deserialize = exports.Decimal128 = exports.DBRef = exports.Code = exports.calculateObjectSize = exports.ByteUtils = exports.BSONType = exports.BSONSymbol = exports.BSONRegExp = exports.BSONError = exports.BSON = exports.Binary = void 0;
 exports.parseToElementsToArray = parseToElementsToArray;
@@ -51393,7 +51632,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _vue_runtime_dom__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @vue/runtime-dom */ "./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js");
 /* harmony import */ var _vue_runtime_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @vue/runtime-dom */ "./node_modules/@vue/runtime-dom/dist/runtime-dom.esm-bundler.js");
 /**
-* vue v3.5.35
+* vue v3.5.38
 * (c) 2018-present Yuxi (Evan) You and Vue contributors
 * @license MIT
 **/
@@ -52745,7 +52984,7 @@ module.exports = "<div class=\"dashboard-editor p-4 bg-muted rounded-lg shadow-l
 (module) {
 
 "use strict";
-module.exports = "<div class=\"dashboards bg-page min-h-[calc(100vh-55px)]\">\n  <div class=\"max-w-5xl mx-auto px-4 sm:px-6 lg:px-8 py-8\">\n    <div class=\"flex items-center justify-between mb-6\">\n      <h1 class=\"text-lg font-semibold text-content\">Dashboards</h1>\n      <button\n        type=\"button\"\n        @click=\"showCreateDashboardModal = true\"\n        class=\"rounded-md bg-primary px-3 py-2 text-sm font-semibold text-primary-text shadow-sm hover:bg-primary-hover focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary\">\n        New Dashboard\n      </button>\n    </div>\n\n    <div v-if=\"status === 'loading'\" class=\"text-center py-12\">\n      <svg\n        class=\"inline w-8 h-8 animate-spin text-gray-400\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        fill=\"none\"\n        viewBox=\"0 0 24 24\"\n      >\n        <circle class=\"opacity-25\" cx=\"12\" cy=\"12\" r=\"10\" stroke=\"currentColor\" stroke-width=\"4\"></circle>\n        <path class=\"opacity-75\" fill=\"currentColor\" d=\"M4 12a8 8 0 018-8v4a4 4 0 00-4 4H4z\"></path>\n      </svg>\n    </div>\n\n    <div v-else-if=\"dashboards.length === 0\" class=\"text-center py-12\">\n      <h3 class=\"text-sm font-semibold text-content\">No dashboards yet</h3>\n      <p class=\"mt-1 text-sm text-content-tertiary\">Get started by creating a new dashboard.</p>\n      <div class=\"mt-4\">\n        <button\n          type=\"button\"\n          @click=\"showCreateDashboardModal = true\"\n          class=\"inline-flex items-center rounded-md bg-primary px-3 py-2 text-sm font-semibold text-primary-text shadow-sm hover:bg-primary-hover\">\n          <svg class=\"-ml-0.5 mr-1.5 h-5 w-5\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\n            <path d=\"M10.75 4.75a.75.75 0 00-1.5 0v4.5h-4.5a.75.75 0 000 1.5h4.5v4.5a.75.75 0 001.5 0v-4.5h4.5a.75.75 0 000-1.5h-4.5v-4.5z\" />\n          </svg>\n          New Dashboard\n        </button>\n      </div>\n    </div>\n\n    <div v-else class=\"space-y-3\">\n      <div\n        v-for=\"dashboard in dashboards\"\n        :key=\"dashboard._id\"\n        class=\"bg-surface rounded-lg border border-edge px-5 py-4 flex items-center justify-between hover:border-edge-strong transition-colors\"\n      >\n        <div class=\"min-w-0 flex-1 mr-4\">\n          <router-link\n            :to=\"'/dashboard/' + dashboard._id\"\n            class=\"text-sm font-semibold text-content hover:text-primary block truncate\">\n            {{ dashboard.title }}\n          </router-link>\n          <p v-if=\"dashboard.description\" class=\"mt-0.5 text-sm text-content-tertiary truncate\">{{ dashboard.description }}</p>\n        </div>\n        <div class=\"flex items-center gap-2 shrink-0\">\n          <router-link\n            :to=\"'/dashboard/' + dashboard._id\"\n            class=\"rounded-md bg-primary px-3 py-1.5 text-sm font-semibold text-primary-text shadow-sm hover:bg-primary-hover\">\n            View\n          </router-link>\n          <div class=\"relative\" v-click-outside=\"() => closeMenu(dashboard._id)\">\n            <button\n              type=\"button\"\n              @click=\"toggleMenu(dashboard._id)\"\n              class=\"rounded-md bg-surface px-2 py-1.5 text-content-tertiary ring-1 ring-inset ring-gray-300 hover:bg-page\">\n              <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\" class=\"w-4 h-4\">\n                <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M6.75 12a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0Zm6 0a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0Zm6 0a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0Z\" />\n              </svg>\n            </button>\n            <div\n              v-if=\"openMenuId === dashboard._id\"\n              class=\"absolute right-0 mt-1 w-36 origin-top-right rounded-md bg-surface shadow-lg ring-1 ring-black/5 z-10\"\n            >\n              <div class=\"py-1\">\n                <router-link\n                  :to=\"'/dashboard/' + dashboard._id + '?edit=true'\"\n                  class=\"block px-4 py-2 text-sm text-content-secondary hover:bg-muted\">\n                  Edit\n                </router-link>\n                <button\n                  @click=\"showDeleteDashboardModal = dashboard; openMenuId = null\"\n                  type=\"button\"\n                  class=\"block w-full text-left px-4 py-2 text-sm text-red-600 hover:bg-muted\">\n                  Delete\n                </button>\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <modal v-if=\"showCreateDashboardModal\">\n    <template v-slot:body>\n      <div class=\"modal-exit\" @click=\"showCreateDashboardModal = false;\">&times;</div>\n      <create-dashboard @close=\"insertNewDashboard\"></create-dashboard>\n    </template>\n  </modal>\n\n  <modal v-if=\"showDeleteDashboardModal\">\n    <template v-slot:body>\n      <div class=\"modal-exit\" @click=\"showDeleteDashboardModal = null;\">&times;</div>\n      <h2>Are you sure you want to delete \"{{showDeleteDashboardModal.title}}\"?</h2>\n      <div class=\"flex space-x-2 mt-4\">\n        <button class=\"px-4 py-2 bg-red-600 text-white rounded-md hover:bg-red-500 text-sm font-semibold\" @click=\"deleteDashboard(showDeleteDashboardModal)\">Yes, delete</button>\n        <button class=\"px-4 py-2 bg-muted text-content-secondary rounded-md hover:bg-muted text-sm font-semibold\" @click=\"showDeleteDashboardModal=null;\">Cancel</button>\n      </div>\n    </template>\n  </modal>\n</div>\n";
+module.exports = "<div class=\"dashboards bg-page min-h-[calc(100vh-55px)]\">\n  <div class=\"max-w-5xl mx-auto px-4 sm:px-6 lg:px-8 py-8\">\n    <div class=\"flex items-center justify-between mb-6\">\n      <h1 class=\"text-lg font-semibold text-content\">Dashboards</h1>\n      <button\n        type=\"button\"\n        @click=\"showCreateDashboardModal = true\"\n        class=\"rounded-md bg-primary px-3 py-2 text-sm font-semibold text-primary-text shadow-sm hover:bg-primary-hover focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary\">\n        New Dashboard\n      </button>\n    </div>\n\n    <div v-if=\"status !== 'loading'\" class=\"mb-5\">\n      <label for=\"dashboard-search\" class=\"sr-only\">Search dashboards</label>\n      <div class=\"relative max-w-lg\">\n        <div class=\"pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3 text-content-tertiary\">\n          <svg class=\"h-4 w-4\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\">\n            <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m21 21-5.197-5.197m0 0A7.5 7.5 0 1 0 5.196 5.196a7.5 7.5 0 0 0 10.607 10.607Z\" />\n          </svg>\n        </div>\n        <input\n          id=\"dashboard-search\"\n          v-model=\"searchText\"\n          type=\"search\"\n          class=\"block w-full rounded-md border-0 bg-surface py-2 pl-9 pr-3 text-sm text-content shadow-sm ring-1 ring-inset ring-edge placeholder:text-content-tertiary focus:ring-2 focus:ring-inset focus:ring-primary\"\n          placeholder=\"Search by title or description\">\n      </div>\n    </div>\n\n    <div v-if=\"status === 'loading'\" class=\"text-center py-12\">\n      <svg\n        class=\"inline w-8 h-8 animate-spin text-gray-400\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        fill=\"none\"\n        viewBox=\"0 0 24 24\"\n      >\n        <circle class=\"opacity-25\" cx=\"12\" cy=\"12\" r=\"10\" stroke=\"currentColor\" stroke-width=\"4\"></circle>\n        <path class=\"opacity-75\" fill=\"currentColor\" d=\"M4 12a8 8 0 018-8v4a4 4 0 00-4 4H4z\"></path>\n      </svg>\n    </div>\n\n    <div v-else-if=\"dashboards.length === 0\" class=\"text-center py-12\">\n      <h3 class=\"text-sm font-semibold text-content\">No dashboards yet</h3>\n      <p class=\"mt-1 text-sm text-content-tertiary\">Get started by creating a new dashboard.</p>\n      <div class=\"mt-4\">\n        <button\n          type=\"button\"\n          @click=\"showCreateDashboardModal = true\"\n          class=\"inline-flex items-center rounded-md bg-primary px-3 py-2 text-sm font-semibold text-primary-text shadow-sm hover:bg-primary-hover\">\n          <svg class=\"-ml-0.5 mr-1.5 h-5 w-5\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\n            <path d=\"M10.75 4.75a.75.75 0 00-1.5 0v4.5h-4.5a.75.75 0 000 1.5h4.5v4.5a.75.75 0 001.5 0v-4.5h4.5a.75.75 0 000-1.5h-4.5v-4.5z\" />\n          </svg>\n          New Dashboard\n        </button>\n      </div>\n    </div>\n\n    <div v-else-if=\"filteredDashboards.length === 0\" class=\"text-center py-12\">\n      <h3 class=\"text-sm font-semibold text-content\">No matching dashboards</h3>\n      <p class=\"mt-1 text-sm text-content-tertiary\">Try a different title or description.</p>\n    </div>\n\n    <div v-else class=\"space-y-3\">\n      <div\n        v-for=\"dashboard in filteredDashboards\"\n        :key=\"dashboard._id\"\n        class=\"bg-surface rounded-lg border border-edge px-5 py-4 flex items-start justify-between hover:border-edge-strong transition-colors\"\n      >\n        <div class=\"min-w-0 flex-1 mr-4\">\n          <router-link\n            :to=\"'/dashboard/' + dashboard._id\"\n            class=\"text-sm font-semibold text-content hover:text-primary block truncate\">\n            <span v-html=\"highlightTitle(dashboard.title)\"></span>\n          </router-link>\n          <p\n            v-if=\"dashboard.description\"\n            class=\"mt-0.5 text-sm text-content-tertiary truncate\"\n            v-html=\"highlightDescription(dashboard.description)\"></p>\n          <dl class=\"mt-3 grid grid-cols-1 gap-x-4 gap-y-1 text-xs text-content-tertiary sm:grid-cols-3\">\n            <div>\n              <dt class=\"font-medium text-content-secondary\">Created At</dt>\n              <dd>{{ formatDate(dashboard.createdAt) }}</dd>\n            </div>\n            <div>\n              <dt class=\"font-medium text-content-secondary\">Last Evaluated At</dt>\n              <dd>{{ formatDate(dashboard.lastEvaluatedAt) }}</dd>\n            </div>\n            <div v-show=\"dashboard.createdBy\">\n              <dt class=\"font-medium text-content-secondary\">Created By</dt>\n              <dd class=\"truncate\">{{ dashboard.createdBy?.name }}</dd>\n            </div>\n          </dl>\n        </div>\n        <div class=\"flex items-center gap-2 shrink-0\">\n          <button\n            type=\"button\"\n            @click=\"togglePin(dashboard)\"\n            :title=\"dashboard.isPinned ? 'Unpin dashboard' : 'Pin dashboard'\"\n            :aria-label=\"dashboard.isPinned ? 'Unpin dashboard' : 'Pin dashboard'\"\n            class=\"rounded-md bg-surface px-2 py-1.5 text-content-tertiary ring-1 ring-inset ring-gray-300 hover:bg-page\"\n            :class=\"dashboard.isPinned ? 'text-primary ring-primary/40' : ''\">\n            <img :src=\"dashboard.isPinned ? 'images/pin-off.svg' : 'images/pin.svg'\" class=\"w-4 h-4\" alt=\"\" />\n          </button>\n          <router-link\n            :to=\"'/dashboard/' + dashboard._id\"\n            class=\"rounded-md bg-primary px-3 py-1.5 text-sm font-semibold text-primary-text shadow-sm hover:bg-primary-hover\">\n            View\n          </router-link>\n          <div class=\"relative\" v-click-outside=\"() => closeMenu(dashboard._id)\">\n            <button\n              type=\"button\"\n              @click=\"toggleMenu(dashboard._id)\"\n              class=\"rounded-md bg-surface px-2 py-1.5 text-content-tertiary ring-1 ring-inset ring-gray-300 hover:bg-page\">\n              <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\" class=\"w-4 h-4\">\n                <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M6.75 12a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0Zm6 0a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0Zm6 0a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0Z\" />\n              </svg>\n            </button>\n            <div\n              v-if=\"openMenuId === dashboard._id\"\n              class=\"absolute right-0 mt-1 w-36 origin-top-right rounded-md bg-surface shadow-lg ring-1 ring-black/5 z-10\"\n            >\n              <div class=\"py-1\">\n                <router-link\n                  :to=\"'/dashboard/' + dashboard._id + '?edit=true'\"\n                  class=\"block px-4 py-2 text-sm text-content-secondary hover:bg-muted\">\n                  Edit\n                </router-link>\n                <button\n                  @click=\"showDeleteDashboardModal = dashboard; openMenuId = null\"\n                  type=\"button\"\n                  class=\"block w-full text-left px-4 py-2 text-sm text-red-600 hover:bg-muted\">\n                  Delete\n                </button>\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <modal v-if=\"showCreateDashboardModal\">\n    <template v-slot:body>\n      <div class=\"modal-exit\" @click=\"showCreateDashboardModal = false;\">&times;</div>\n      <create-dashboard @close=\"insertNewDashboard\"></create-dashboard>\n    </template>\n  </modal>\n\n  <modal v-if=\"showDeleteDashboardModal\">\n    <template v-slot:body>\n      <div class=\"modal-exit\" @click=\"showDeleteDashboardModal = null;\">&times;</div>\n      <h2>Are you sure you want to delete \"{{showDeleteDashboardModal.title}}\"?</h2>\n      <div class=\"flex space-x-2 mt-4\">\n        <button class=\"px-4 py-2 bg-red-600 text-white rounded-md hover:bg-red-500 text-sm font-semibold\" @click=\"deleteDashboard(showDeleteDashboardModal)\">Yes, delete</button>\n        <button class=\"px-4 py-2 bg-muted text-content-secondary rounded-md hover:bg-muted text-sm font-semibold\" @click=\"showDeleteDashboardModal=null;\">Cancel</button>\n      </div>\n    </template>\n  </modal>\n</div>\n";
 
 /***/ },
 
@@ -58836,7 +59075,7 @@ exports.validatorErrorSymbol = Symbol('mongoose#validatorError');
 
 
 
-const ObjectId = (__webpack_require__(/*! mongodb/lib/bson */ "./node_modules/mongodb/lib/bson.js").ObjectId);
+const ObjectId = (__webpack_require__(/*! mongodb/lib/bson */ "./node_modules/mongoose/node_modules/mongodb/lib/bson.js").ObjectId);
 const objectIdSymbol = (__webpack_require__(/*! ../helpers/symbols */ "./node_modules/mongoose/lib/helpers/symbols.js").objectIdSymbol);
 
 /**
@@ -64736,7 +64975,7 @@ var src_default = VueToastificationPlugin;
 (module) {
 
 "use strict";
-module.exports = /*#__PURE__*/JSON.parse('{"name":"@mongoosejs/studio","version":"0.5.5","description":"AI-Powered Data Workspace for MongoDB: Turn your MongoDB data into dashboards, maps, and interactive workflows - powered by your Mongoose models and AI.","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","mpath":"^0.9.0","node-inspect-extracted":"3.x","regexp.escape":"^2.0.1","tailwindcss":"3.4.0","time-commando":"1.0.1","typescript":"^6.0.2","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","eval:agent":"node eval/agent/run.js"}}');
+module.exports = /*#__PURE__*/JSON.parse('{"name":"@mongoosejs/studio","version":"0.5.7","description":"AI-Powered Data Workspace for MongoDB: Turn your MongoDB data into dashboards, maps, and interactive workflows - powered by your Mongoose models and AI.","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","mpath":"^0.9.0","node-inspect-extracted":"3.x","regexp.escape":"^2.0.1","tailwindcss":"3.4.0","time-commando":"1.0.1","typescript":"^6.0.2","vue":"3.x","vue-toastification":"^2.0.0-rc.5","webpack":"5.x","xss":"^1.0.15"},"peerDependencies":{"@nestjs/common":"10.x || 11.x","mongoose":"7.x || 8.x || ^9.0.0"},"peerDependenciesMeta":{"@nestjs/common":{"optional":true}},"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","@nestjs/common":"^11.1.9","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","eval:agent":"node eval/agent/run.js"}}');
 
 /***/ }
 

package/frontend/public/images/pin-off.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="currentColor"><path d="M680-840v80h-40v327l-80-80v-247H400v87l-87-87-33-33v-47h400ZM480-40l-40-40v-240H240v-80l80-80v-46L56-792l56-56 736 736-58 56-264-264h-6v240l-40 40ZM354-400h92l-44-44-2-2-46 46Zm126-193Zm-78 149Z"/></svg>

package/frontend/public/images/pin.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="currentColor"><path d="m640-480 80 80v80H520v240l-40 40-40-40v-240H240v-80l80-80v-280h-40v-80h400v80h-40v280Zm-286 80h252l-46-46v-314H400v314l-46 46Zm126 0Z"/></svg>

package/frontend/public/tw.css

@@ -905,6 +905,10 @@ video {
   margin-bottom: 1rem;
 }
 
+.mb-5 {
+  margin-bottom: 1.25rem;
+}
+
 .mb-6 {
   margin-bottom: 1.5rem;
 }
@@ -1681,6 +1685,10 @@ video {
        column-gap: 1.5rem;
 }
 
+.gap-y-1 {
+  row-gap: 0.25rem;
+}
+
 .space-x-2 > :not([hidden]) ~ :not([hidden]) {
   --tw-space-x-reverse: 0;
   margin-right: calc(0.5rem * var(--tw-space-x-reverse));
@@ -2524,6 +2532,10 @@ video {
   padding-left: 2rem;
 }
 
+.pl-9 {
+  padding-left: 2.25rem;
+}
+
 .pr-12 {
   padding-right: 3rem;
 }
@@ -2927,6 +2939,10 @@ video {
   text-decoration-line: underline;
 }
 
+.decoration-primary {
+  text-decoration-color: var(--color-primary);
+}
+
 .decoration-dotted {
   text-decoration-style: dotted;
 }
@@ -3063,6 +3079,10 @@ video {
   --tw-ring-color: rgb(0 0 0 / 0.05);
 }
 
+.ring-edge {
+  --tw-ring-color: var(--color-edge);
+}
+
 .ring-edge-strong {
   --tw-ring-color: var(--color-edge-strong);
 }
@@ -3650,6 +3670,10 @@ video {
   box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
 }
 
+.focus\:ring-inset:focus {
+  --tw-ring-inset: inset;
+}
+
 .focus\:ring-blue-500:focus {
   --tw-ring-opacity: 1;
   --tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity));
@@ -3896,6 +3920,10 @@ video {
     flex: none;
   }
 
+  .sm\:grid-cols-3 {
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+  }
+
   .sm\:grid-cols-4 {
     grid-template-columns: repeat(4, minmax(0, 1fr));
   }

package/frontend/src/dashboards/dashboards.html

@@ -10,6 +10,23 @@
       </button>
     </div>
 
+    <div v-if="status !== 'loading'" class="mb-5">
+      <label for="dashboard-search" class="sr-only">Search dashboards</label>
+      <div class="relative max-w-lg">
+        <div class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3 text-content-tertiary">
+          <svg class="h-4 w-4" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
+            <path stroke-linecap="round" stroke-linejoin="round" d="m21 21-5.197-5.197m0 0A7.5 7.5 0 1 0 5.196 5.196a7.5 7.5 0 0 0 10.607 10.607Z" />
+          </svg>
+        </div>
+        <input
+          id="dashboard-search"
+          v-model="searchText"
+          type="search"
+          class="block w-full rounded-md border-0 bg-surface py-2 pl-9 pr-3 text-sm text-content shadow-sm ring-1 ring-inset ring-edge placeholder:text-content-tertiary focus:ring-2 focus:ring-inset focus:ring-primary"
+          placeholder="Search by title or description">
+      </div>
+    </div>
+
     <div v-if="status === 'loading'" class="text-center py-12">
       <svg
         class="inline w-8 h-8 animate-spin text-gray-400"
@@ -38,21 +55,52 @@
       </div>
     </div>
 
+    <div v-else-if="filteredDashboards.length === 0" class="text-center py-12">
+      <h3 class="text-sm font-semibold text-content">No matching dashboards</h3>
+      <p class="mt-1 text-sm text-content-tertiary">Try a different title or description.</p>
+    </div>
+
     <div v-else class="space-y-3">
       <div
-        v-for="dashboard in dashboards"
+        v-for="dashboard in filteredDashboards"
         :key="dashboard._id"
-        class="bg-surface rounded-lg border border-edge px-5 py-4 flex items-center justify-between hover:border-edge-strong transition-colors"
+        class="bg-surface rounded-lg border border-edge px-5 py-4 flex items-start justify-between hover:border-edge-strong transition-colors"
       >
         <div class="min-w-0 flex-1 mr-4">
           <router-link
             :to="'/dashboard/' + dashboard._id"
             class="text-sm font-semibold text-content hover:text-primary block truncate">
-            {{ dashboard.title }}
+            <span v-html="highlightTitle(dashboard.title)"></span>
           </router-link>
-          <p v-if="dashboard.description" class="mt-0.5 text-sm text-content-tertiary truncate">{{ dashboard.description }}</p>
+          <p
+            v-if="dashboard.description"
+            class="mt-0.5 text-sm text-content-tertiary truncate"
+            v-html="highlightDescription(dashboard.description)"></p>
+          <dl class="mt-3 grid grid-cols-1 gap-x-4 gap-y-1 text-xs text-content-tertiary sm:grid-cols-3">
+            <div>
+              <dt class="font-medium text-content-secondary">Created At</dt>
+              <dd>{{ formatDate(dashboard.createdAt) }}</dd>
+            </div>
+            <div>
+              <dt class="font-medium text-content-secondary">Last Evaluated At</dt>
+              <dd>{{ formatDate(dashboard.lastEvaluatedAt) }}</dd>
+            </div>
+            <div v-show="dashboard.createdBy">
+              <dt class="font-medium text-content-secondary">Created By</dt>
+              <dd class="truncate">{{ dashboard.createdBy?.name }}</dd>
+            </div>
+          </dl>
         </div>
         <div class="flex items-center gap-2 shrink-0">
+          <button
+            type="button"
+            @click="togglePin(dashboard)"
+            :title="dashboard.isPinned ? 'Unpin dashboard' : 'Pin dashboard'"
+            :aria-label="dashboard.isPinned ? 'Unpin dashboard' : 'Pin dashboard'"
+            class="rounded-md bg-surface px-2 py-1.5 text-content-tertiary ring-1 ring-inset ring-gray-300 hover:bg-page"
+            :class="dashboard.isPinned ? 'text-primary ring-primary/40' : ''">
+            <img :src="dashboard.isPinned ? 'images/pin-off.svg' : 'images/pin.svg'" class="w-4 h-4" alt="" />
+          </button>
           <router-link
             :to="'/dashboard/' + dashboard._id"
             class="rounded-md bg-primary px-3 py-1.5 text-sm font-semibold text-primary-text shadow-sm hover:bg-primary-hover">

package/frontend/src/dashboards/dashboards.js

@@ -9,11 +9,73 @@ module.exports = app => app.component('dashboards', {
   data: () => ({
     status: 'loading',
     dashboards: [],
+    searchText: '',
     showCreateDashboardModal: false,
     showDeleteDashboardModal: null,
     openMenuId: null
   }),
+  computed: {
+    filteredDashboards() {
+      const searchWords = getSearchWords(this.searchText);
+      let dashboards = this.dashboards;
+      if (searchWords.length === 0) {
+        return sortPinnedFirst(dashboards);
+      }
+      const searchPatterns = searchWords.map(word => new RegExp(escapeRegExp(word), 'i'));
+
+      dashboards = dashboards.filter(dashboard => {
+        const searchableText = `${dashboard.title || ''} ${dashboard.description || ''}`;
+        return searchPatterns.every(pattern => pattern.test(searchableText));
+      });
+
+      return sortPinnedFirst(dashboards);
+    }
+  },
   methods: {
+    highlightTitle(value) {
+      return this.highlightSearchText(value, 'underline decoration-primary underline-offset-2');
+    },
+    highlightDescription(value) {
+      return this.highlightSearchText(value, 'font-semibold text-content-secondary');
+    },
+    highlightSearchText(value, className) {
+      const text = value || '';
+      const searchWords = getSearchWords(this.searchText);
+      if (searchWords.length === 0) {
+        return escapeHtml(text);
+      }
+      const searchPattern = new RegExp(searchWords.map(escapeRegExp).join('|'), 'ig');
+
+      let html = '';
+      let lastIndex = 0;
+      let match = searchPattern.exec(text);
+      while (match != null) {
+        html += escapeHtml(text.slice(lastIndex, match.index));
+        html += `<span class="${className}">${escapeHtml(match[0])}</span>`;
+        lastIndex = match.index + match[0].length;
+        match = searchPattern.exec(text);
+      }
+      html += escapeHtml(text.slice(lastIndex));
+      return html;
+    },
+    formatDate(value) {
+      if (!value) {
+        return '-';
+      }
+      const date = new Date(value);
+      if (Number.isNaN(date.getTime())) {
+        return '-';
+      }
+      return new Intl.DateTimeFormat(undefined, {
+        dateStyle: 'medium',
+        timeStyle: 'short'
+      }).format(date);
+    },
+    formatUser(dashboard) {
+      return dashboard.createdBy?.name ||
+        dashboard.createdBy?.email ||
+        (dashboard.createdById ? dashboard.createdById.toString() : '-');
+    },
     toggleMenu(id) {
       this.openMenuId = this.openMenuId === id ? null : id;
     },
@@ -33,8 +95,19 @@ module.exports = app => app.component('dashboards', {
       this.$toast.success('Dashboard deleted!');
     },
     insertNewDashboard(dashboard) {
-      this.dashboards.push(dashboard);
+      this.dashboards.unshift(dashboard);
       this.showCreateDashboardModal = false;
+    },
+    async togglePin(dashboard) {
+      if (!dashboard) {
+        return;
+      }
+
+      const { doc } = await api.Dashboard.updateDashboard({
+        dashboardId: dashboard._id,
+        isPinned: !dashboard.isPinned
+      });
+      dashboard.isPinned = doc.isPinned;
     }
   },
   directives: {
@@ -58,3 +131,25 @@ module.exports = app => app.component('dashboards', {
     this.status = 'loaded';
   }
 });
+
+function escapeHtml(value) {
+  return value.toString().
+    replace(/&/g, '&amp;').
+    replace(/</g, '&lt;').
+    replace(/>/g, '&gt;').
+    replace(/"/g, '&quot;').
+    replace(/'/g, '&#39;');
+}
+
+function escapeRegExp(value) {
+  return value.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+}
+
+function getSearchWords(searchText) {
+  return Array.from(new Set(searchText.trim().split(/\s+/).filter(Boolean))).
+    sort((a, b) => b.length - a.length);
+}
+
+function sortPinnedFirst(dashboards) {
+  return dashboards.slice().sort((a, b) => Number(Boolean(b.isPinned)) - Number(Boolean(a.isPinned)));
+}

package/nest.d.ts

@@ -0,0 +1,27 @@
+declare module '@mongoosejs/studio/nest' {
+  import { DynamicModule, MiddlewareConsumer, NestModule } from '@nestjs/common';
+  import { Connection, Mongoose } from 'mongoose';
+
+  export interface MongooseStudioModuleOptions {
+    path?: string;
+    apiPath?: string;
+    connection?: Connection | Mongoose;
+    connectionToken?: string | symbol | Function;
+    apiKey?: string;
+    bindIp?: string | string[] | null;
+    [key: string]: any;
+  }
+
+  export interface MongooseStudioModuleAsyncOptions {
+    imports?: any[];
+    inject?: any[];
+    connectionToken?: string | symbol | Function;
+    useFactory: (...args: any[]) => Promise<MongooseStudioModuleOptions> | MongooseStudioModuleOptions;
+  }
+
+  export class MongooseStudioModule implements NestModule {
+    configure(consumer: MiddlewareConsumer): void;
+    static forRoot(options?: MongooseStudioModuleOptions): DynamicModule;
+    static forRootAsync(options: MongooseStudioModuleAsyncOptions): DynamicModule;
+  }
+}

package/nest.js

@@ -0,0 +1,134 @@
+'use strict';
+
+const { Inject, Module, RequestMethod } = require('@nestjs/common');
+const mongoose = require('mongoose');
+const createExpressRouter = require('./express');
+
+const MONGOOSE_STUDIO_OPTIONS = Symbol('MONGOOSE_STUDIO_OPTIONS');
+const MONGOOSE_STUDIO_CONNECTION = Symbol('MONGOOSE_STUDIO_CONNECTION');
+const MONGOOSE_STUDIO_EXPRESS_ROUTER = Symbol('MONGOOSE_STUDIO_EXPRESS_ROUTER');
+
+class MongooseStudioModule {
+  constructor(options, expressRouter) {
+    this.options = options || {};
+    this.expressRouter = expressRouter;
+  }
+
+  configure(consumer) {
+    const mountPath = this.options.path || '/studio';
+
+    consumer
+      .apply((req, res, next) => {
+        if (!isMountedStudioRequest(req, mountPath)) {
+          return next();
+        }
+
+        const originalUrl = req.url;
+        req.url = req.url.slice(normalizeExpressMountPath(mountPath).length) || '/';
+        try {
+          return this.expressRouter(req, res, err => {
+            req.url = originalUrl;
+            next(err);
+          });
+        } finally {
+          req.url = originalUrl;
+        }
+      })
+      .forRoutes({
+        path: '*path',
+        method: RequestMethod.ALL
+      });
+  }
+
+  static forRoot(options) {
+    options = options || {};
+    const providers = [
+      { provide: MONGOOSE_STUDIO_OPTIONS, useValue: options },
+      createExpressRouterProvider()
+    ];
+
+    if (options.connectionToken) {
+      providers.push({ provide: MONGOOSE_STUDIO_CONNECTION, useExisting: options.connectionToken });
+    } else if (options.connection) {
+      providers.push({ provide: MONGOOSE_STUDIO_CONNECTION, useValue: options.connection });
+    } else {
+      providers.push({ provide: MONGOOSE_STUDIO_CONNECTION, useValue: mongoose });
+    }
+
+    return {
+      module: MongooseStudioModule,
+      providers,
+      exports: providers
+    };
+  }
+
+  static forRootAsync(options) {
+    options = options || {};
+    const providers = [
+      {
+        provide: MONGOOSE_STUDIO_OPTIONS,
+        useFactory: options.useFactory,
+        inject: options.inject || []
+      },
+      createExpressRouterProvider()
+    ];
+
+    if (options.connectionToken) {
+      providers.push({ provide: MONGOOSE_STUDIO_CONNECTION, useExisting: options.connectionToken });
+    } else if (options.connection) {
+      providers.push({ provide: MONGOOSE_STUDIO_CONNECTION, useValue: options.connection });
+    } else {
+      providers.push({ provide: MONGOOSE_STUDIO_CONNECTION, useValue: mongoose });
+    }
+
+    return {
+      module: MongooseStudioModule,
+      imports: options.imports || [],
+      providers,
+      exports: providers
+    };
+  }
+}
+
+function createExpressRouterProvider() {
+  return {
+    provide: MONGOOSE_STUDIO_EXPRESS_ROUTER,
+    useFactory: async(options, connection) => {
+      options = options || {};
+      const mountPath = options.path || '/studio';
+      const apiPath = options.apiPath || `${mountPath}/api`;
+      const studioOptions = { ...options };
+      delete studioOptions.path;
+      delete studioOptions.apiPath;
+      delete studioOptions.connection;
+      delete studioOptions.connectionToken;
+
+      return createExpressRouter(apiPath, options.connection || connection || mongoose, studioOptions);
+    },
+    inject: [MONGOOSE_STUDIO_OPTIONS, MONGOOSE_STUDIO_CONNECTION]
+  };
+}
+
+function isMountedStudioRequest(req, mountPath) {
+  const normalizedMountPath = normalizeExpressMountPath(mountPath);
+  return req.url === normalizedMountPath ||
+    req.url.startsWith(`${normalizedMountPath}/`) ||
+    req.url.startsWith(`${normalizedMountPath}?`) ||
+    req.url.startsWith(`${normalizedMountPath}#`);
+}
+
+function normalizeExpressMountPath(path) {
+  path = `/${path.replace(/^\/+/, '').replace(/\/+$/, '')}`;
+  return path === '/' ? '' : path;
+}
+
+Inject(MONGOOSE_STUDIO_OPTIONS)(MongooseStudioModule, undefined, 0);
+Inject(MONGOOSE_STUDIO_EXPRESS_ROUTER)(MongooseStudioModule, undefined, 1);
+Module({})(MongooseStudioModule);
+
+module.exports = {
+  MONGOOSE_STUDIO_CONNECTION,
+  MONGOOSE_STUDIO_EXPRESS_ROUTER,
+  MONGOOSE_STUDIO_OPTIONS,
+  MongooseStudioModule
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mongoosejs/studio",
-  "version": "0.5.5",
+  "version": "0.5.7",
   "description": "AI-Powered Data Workspace for MongoDB: Turn your MongoDB data into dashboards, maps, and interactive workflows - powered by your Mongoose models and AI.",
   "homepage": "https://mongoosestudio.app/",
   "repository": {
@@ -31,8 +31,14 @@
     "xss": "^1.0.15"
   },
   "peerDependencies": {
+    "@nestjs/common": "10.x || 11.x",
     "mongoose": "7.x || 8.x || ^9.0.0"
   },
+  "peerDependenciesMeta": {
+    "@nestjs/common": {
+      "optional": true
+    }
+  },
   "optionalPeerDependencies": {
     "@mongoosejs/task": "0.5.x || 0.6.x"
   },
@@ -41,6 +47,7 @@
     "axios": "1.2.2",
     "dedent": "^1.6.0",
     "eslint": "9.30.0",
+    "@nestjs/common": "^11.1.9",
     "express": "4.x",
     "mocha": "10.2.0",
     "mongodb-memory-server": "^11.0.1",