@mongoosejs/studio 0.0.133 → 0.0.136

package/backend/actions/ChatThread/createChatMessage.js

@@ -55,7 +55,7 @@ module.exports = ({ db, studioConnection, options }) => async function createCha
     });
   }
 
-  if (options.context) {
+  if (options?.context) {
     llmMessages.unshift({
       role: 'system',
       content: options.context

package/frontend/public/app.js

@@ -536,7 +536,7 @@ module.exports = function appendCSS(css) {
 /***/ ((module) => {
 
 "use strict";
-module.exports = "<button v-bind=\"attrsToBind\" :disabled=\"isDisabled\" @click=\"handleClick\">\n  <div v-if=\"status === 'in_progress'\" style=\"text-align: center\">\n    <svg style=\"height: 1em\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n      <g>\n        <circle cx=\"12\" cy=\"12\" r=\"10\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" opacity=\"0.3\" />\n        <path d=\"M12 2a10 10 0 0 1 10 10\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\">\n          <animateTransform attributeName=\"transform\" type=\"rotate\" from=\"0 12 12\" to=\"360 12 12\" dur=\"1s\" repeatCount=\"indefinite\" />\n        </path>\n      </g>\n    </svg>\n  </div>\n  <slot v-if=\"status == 'success' || status == 'init'\"></slot>\n</button>\n";
+module.exports = "<button v-bind=\"attrsToBind\" :disabled=\"isDisabled\" @click=\"handleClick\">\n  <div v-if=\"status === 'in_progress'\" style=\"text-align: center\">\n    <svg style=\"height: 1em\" class=\"mx-auto\" viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n      <g>\n        <circle cx=\"12\" cy=\"12\" r=\"10\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" opacity=\"0.3\" />\n        <path d=\"M12 2a10 10 0 0 1 10 10\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\">\n          <animateTransform attributeName=\"transform\" type=\"rotate\" from=\"0 12 12\" to=\"360 12 12\" dur=\"1s\" repeatCount=\"indefinite\" />\n        </path>\n      </g>\n    </svg>\n  </div>\n  <slot v-if=\"status == 'success' || status == 'init'\"></slot>\n</button>\n";
 
 /***/ }),
 
@@ -558,19 +558,28 @@ module.exports = app => app.component('async-button', {
   inheritAttrs: false,
   methods: {
     async handleClick(ev) {
-      if (this.status === 'in_progress') {
-        return;
-      }
+      if (this.status === 'in_progress') return;
+
+      const btn = this.$el;
+      const prevWidth = btn.offsetWidth;
+      const prevHeight = btn.offsetHeight;
+      btn.style.width = `${prevWidth}px`;
+      btn.style.height = `${prevHeight}px`;
+
       this.status = 'in_progress';
 
       try {
-        await this.$attrs.onClick(ev);
+        if (typeof this.$attrs.onClick === 'function') {
+          await this.$attrs.onClick(ev);
+        }
+        this.status = 'success';
       } catch (err) {
-        this.status = 'error';
+        this.status = 'init';
         throw err;
+      } finally {
+        btn.style.width = null;
+        btn.style.height = null;
       }
-
-      this.status = 'success';
     }
   },
   computed: {
@@ -587,6 +596,7 @@ module.exports = app => app.component('async-button', {
   template: template
 });
 
+
 /***/ }),
 
 /***/ "./frontend/src/chat/chat-message-script/chat-message-script.html":
@@ -4175,6 +4185,7 @@ module.exports = app => app.component('models', {
       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;
       }
@@ -4189,6 +4200,10 @@ module.exports = app => app.component('models', {
       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;
@@ -4969,7 +4984,7 @@ module.exports = {
 /***/ ((module) => {
 
 "use strict";
-module.exports = "<div class=\"w-full h-full flex items-center justify-center\">\n  <div class=\"text-center\">\n    <div class=\"rounded-full bg-gray-100 p-6 inline-block\">\n      <img src=\"images/logo.svg\" class=\"w-48 h-48\">\n    </div>\n    <div class=\"text-lg mt-2 font-bold\">\n      Mongoose Studio\n    </div>\n    <div v-if=\"loading\" class=\"mt-2\">\n      <img src=\"images/loader.gif\" class=\"inline w-16 h-16\">\n    </div>\n    <div class=\"mt-2 text-gray-700\" v-if=\"!loading\">\n      {{workspaceName}}\n    </div>\n    <div class=\"mt-4 flex gap-4 justify-center\" v-if=\"!loading\">\n      <div>\n        <async-button\n          type=\"button\"\n          @click=\"loginWithGithub\"\n          class=\"rounded bg-ultramarine-600 px-2 py-2 text-sm font-semibold text-white shadow-sm hover:bg-ultramarine-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ultramarine-600\">\n          <svg viewBox=\"0 0 98 98\" class=\"inline mr-1\" height=\"1.5em\" xmlns=\"http://www.w3.org/2000/svg\"><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M48.854 0C21.839 0 0 22 0 49.217c0 21.756 13.993 40.172 33.405 46.69 2.427.49 3.316-1.059 3.316-2.362 0-1.141-.08-5.052-.08-9.127-13.59 2.934-16.42-5.867-16.42-5.867-2.184-5.704-5.42-7.17-5.42-7.17-4.448-3.015.324-3.015.324-3.015 4.934.326 7.523 5.052 7.523 5.052 4.367 7.496 11.404 5.378 14.235 4.074.404-3.178 1.699-5.378 3.074-6.6-10.839-1.141-22.243-5.378-22.243-24.283 0-5.378 1.94-9.778 5.014-13.2-.485-1.222-2.184-6.275.486-13.038 0 0 4.125-1.304 13.426 5.052a46.97 46.97 0 0 1 12.214-1.63c4.125 0 8.33.571 12.213 1.63 9.302-6.356 13.427-5.052 13.427-5.052 2.67 6.763.97 11.816.485 13.038 3.155 3.422 5.015 7.822 5.015 13.2 0 18.905-11.404 23.06-22.324 24.283 1.78 1.548 3.316 4.481 3.316 9.126 0 6.6-.08 11.897-.08 13.526 0 1.304.89 2.853 3.316 2.364 19.412-6.52 33.405-24.935 33.405-46.691C97.707 22 75.788 0 48.854 0z\" fill=\"#fff\"/></svg>\n          Login With GitHub\n        </async-button>\n      </div>\n      <div>\n        <async-button\n          type=\"button\"\n          @click=\"loginWithGoogle\"\n          class=\"rounded bg-ultramarine-600 px-2 py-2 text-sm font-semibold text-white shadow-sm hover:bg-ultramarine-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ultramarine-600\">\n          <svg class=\"inline\" xmlns=\"http://www.w3.org/2000/svg\" height=\"1.5em\" viewBox=\"0 0 512 512\"><path fill=\"#fff\" d=\"M386 400c45-42 65-112 53-179H260v74h102c-4 24-18 44-38 57z\"/><path fill=\"#fff\" d=\"M90 341a192 192 0 0 0 296 59l-62-48c-53 35-141 22-171-60z\"/><path fill=\"#fff\" d=\"M153 292c-8-25-8-48 0-73l-63-49c-23 46-30 111 0 171z\"/><path fill=\"#fff\" d=\"M153 219c22-69 116-109 179-50l55-54c-78-75-230-72-297 55z\"/></svg>\n          Login With Google\n        </async-button>\n      </div>\n    </div>\n    <div class=\"mt-4\" v-if=\"state.authError\">\n      <div class=\"rounded-md bg-red-50 p-4\">\n        <div class=\"flex\">\n          <div class=\"shrink-0\">\n            <svg class=\"size-5 text-red-400\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\" data-slot=\"icon\">\n              <path fill-rule=\"evenodd\" d=\"M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16ZM8.28 7.22a.75.75 0 0 0-1.06 1.06L8.94 10l-1.72 1.72a.75.75 0 1 0 1.06 1.06L10 11.06l1.72 1.72a.75.75 0 1 0 1.06-1.06L11.06 10l1.72-1.72a.75.75 0 0 0-1.06-1.06L10 8.94 8.28 7.22Z\" clip-rule=\"evenodd\" />\n            </svg>\n          </div>\n          <div class=\"ml-3\">\n            <h3 class=\"text-sm font-medium text-red-800\">{{state.authError}}</h3>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n</div>\n";
+module.exports = "<div class=\"w-full h-full flex items-center justify-center\">\n  <div class=\"text-center\">\n    <div class=\"rounded-full bg-gray-100 p-6 inline-block\">\n      <img src=\"images/logo.svg\" class=\"w-48 h-48\">\n    </div>\n    <div class=\"text-lg mt-2 font-bold\">\n      Mongoose Studio\n    </div>\n    <div v-if=\"loading\" class=\"mt-2\">\n      <img src=\"images/loader.gif\" class=\"inline w-16 h-16\">\n    </div>\n    <div class=\"mt-2 text-gray-700\" v-if=\"!loading\">\n      {{workspaceName}}\n    </div>\n    <div class=\"mt-4 flex gap-4 justify-center\" v-if=\"!loading\">\n      <div>\n        <async-button\n          type=\"button\"\n          @click=\"loginWithGithub\"\n          class=\"rounded bg-ultramarine-600 px-2 py-2 text-sm font-semibold text-white shadow-sm hover:bg-ultramarine-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ultramarine-600 disabled:bg-gray-500\">\n          <svg viewBox=\"0 0 98 98\" class=\"inline mr-1\" height=\"1.5em\" xmlns=\"http://www.w3.org/2000/svg\"><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M48.854 0C21.839 0 0 22 0 49.217c0 21.756 13.993 40.172 33.405 46.69 2.427.49 3.316-1.059 3.316-2.362 0-1.141-.08-5.052-.08-9.127-13.59 2.934-16.42-5.867-16.42-5.867-2.184-5.704-5.42-7.17-5.42-7.17-4.448-3.015.324-3.015.324-3.015 4.934.326 7.523 5.052 7.523 5.052 4.367 7.496 11.404 5.378 14.235 4.074.404-3.178 1.699-5.378 3.074-6.6-10.839-1.141-22.243-5.378-22.243-24.283 0-5.378 1.94-9.778 5.014-13.2-.485-1.222-2.184-6.275.486-13.038 0 0 4.125-1.304 13.426 5.052a46.97 46.97 0 0 1 12.214-1.63c4.125 0 8.33.571 12.213 1.63 9.302-6.356 13.427-5.052 13.427-5.052 2.67 6.763.97 11.816.485 13.038 3.155 3.422 5.015 7.822 5.015 13.2 0 18.905-11.404 23.06-22.324 24.283 1.78 1.548 3.316 4.481 3.316 9.126 0 6.6-.08 11.897-.08 13.526 0 1.304.89 2.853 3.316 2.364 19.412-6.52 33.405-24.935 33.405-46.691C97.707 22 75.788 0 48.854 0z\" fill=\"#fff\"/></svg>\n          Login With GitHub\n        </async-button>\n      </div>\n      <div>\n        <async-button\n          type=\"button\"\n          @click=\"loginWithGoogle\"\n          class=\"rounded bg-ultramarine-600 px-2 py-2 text-sm font-semibold text-white shadow-sm hover:bg-ultramarine-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ultramarine-600 disabled:bg-gray-500\">\n          <svg class=\"inline\" xmlns=\"http://www.w3.org/2000/svg\" height=\"1.5em\" viewBox=\"0 0 512 512\"><path fill=\"#fff\" d=\"M386 400c45-42 65-112 53-179H260v74h102c-4 24-18 44-38 57z\"/><path fill=\"#fff\" d=\"M90 341a192 192 0 0 0 296 59l-62-48c-53 35-141 22-171-60z\"/><path fill=\"#fff\" d=\"M153 292c-8-25-8-48 0-73l-63-49c-23 46-30 111 0 171z\"/><path fill=\"#fff\" d=\"M153 219c22-69 116-109 179-50l55-54c-78-75-230-72-297 55z\"/></svg>\n          Login With Google\n        </async-button>\n      </div>\n    </div>\n    <div class=\"mt-4\" v-if=\"state.authError\">\n      <div class=\"rounded-md bg-red-50 p-4\">\n        <div class=\"flex\">\n          <div class=\"shrink-0\">\n            <svg class=\"size-5 text-red-400\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\" data-slot=\"icon\">\n              <path fill-rule=\"evenodd\" d=\"M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16ZM8.28 7.22a.75.75 0 0 0-1.06 1.06L8.94 10l-1.72 1.72a.75.75 0 1 0 1.06 1.06L10 11.06l1.72 1.72a.75.75 0 1 0 1.06-1.06L11.06 10l1.72-1.72a.75.75 0 0 0-1.06-1.06L10 8.94 8.28 7.22Z\" clip-rule=\"evenodd\" />\n            </svg>\n          </div>\n          <div class=\"ml-3\">\n            <h3 class=\"text-sm font-medium text-red-800\">{{state.authError}}</h3>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n</div>\n";
 
 /***/ }),
 
@@ -15917,7 +15932,7 @@ module.exports = function stringToParts(str) {
 /***/ ((module) => {
 
 "use strict";
-module.exports = /*#__PURE__*/JSON.parse('{"name":"@mongoosejs/studio","version":"0.0.133","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":{"type":"git","url":"https://github.com/mongoosejs/studio"},"dependencies":{"archetype":"0.13.1","csv-stringify":"6.3.0","ejson":"^2.2.3","extrovert":"^0.1.0","marked":"15.0.12","node-inspect-extracted":"3.x","tailwindcss":"3.4.0","vanillatoasts":"^1.6.0","vue":"3.x","webpack":"5.x"},"peerDependencies":{"bson":"^5.5.1 || 6.x","express":"4.x","mongoose":"7.x || 8.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","mongoose":"8.x"},"scripts":{"lint":"eslint .","tailwind":"tailwindcss -o ./frontend/public/tw.css","tailwind:watch":"tailwindcss -o ./frontend/public/tw.css --watch","test":"mocha test/*.test.js"}}');
+module.exports = /*#__PURE__*/JSON.parse('{"name":"@mongoosejs/studio","version":"0.0.136","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":{"type":"git","url":"https://github.com/mongoosejs/studio"},"license":"Apache-2.0","dependencies":{"archetype":"0.13.1","csv-stringify":"6.3.0","ejson":"^2.2.3","extrovert":"^0.1.0","marked":"15.0.12","node-inspect-extracted":"3.x","tailwindcss":"3.4.0","vanillatoasts":"^1.6.0","vue":"3.x","webpack":"5.x"},"peerDependencies":{"bson":"^5.5.1 || 6.x","express":"4.x","mongoose":"7.x || 8.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","mongoose":"8.x"},"scripts":{"lint":"eslint .","tailwind":"tailwindcss -o ./frontend/public/tw.css","tailwind:watch":"tailwindcss -o ./frontend/public/tw.css --watch","test":"mocha test/*.test.js"}}');
 
 /***/ })
 

package/frontend/src/async-button/async-button.html

@@ -1,6 +1,6 @@
 <button v-bind="attrsToBind" :disabled="isDisabled" @click="handleClick">
   <div v-if="status === 'in_progress'" style="text-align: center">
-    <svg style="height: 1em" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+    <svg style="height: 1em" class="mx-auto" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
       <g>
         <circle cx="12" cy="12" r="10" fill="none" stroke="currentColor" stroke-width="2" opacity="0.3" />
         <path d="M12 2a10 10 0 0 1 10 10" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round">

package/frontend/src/async-button/async-button.js

@@ -9,19 +9,28 @@ module.exports = app => app.component('async-button', {
   inheritAttrs: false,
   methods: {
     async handleClick(ev) {
-      if (this.status === 'in_progress') {
-        return;
-      }
+      if (this.status === 'in_progress') return;
+
+      const btn = this.$el;
+      const prevWidth = btn.offsetWidth;
+      const prevHeight = btn.offsetHeight;
+      btn.style.width = `${prevWidth}px`;
+      btn.style.height = `${prevHeight}px`;
+
       this.status = 'in_progress';
 
       try {
-        await this.$attrs.onClick(ev);
+        if (typeof this.$attrs.onClick === 'function') {
+          await this.$attrs.onClick(ev);
+        }
+        this.status = 'success';
       } catch (err) {
-        this.status = 'error';
+        this.status = 'init';
         throw err;
+      } finally {
+        btn.style.width = null;
+        btn.style.height = null;
       }
-
-      this.status = 'success';
     }
   },
   computed: {
@@ -36,4 +45,4 @@ module.exports = app => app.component('async-button', {
     }
   },
   template: template
-});
+});

package/frontend/src/models/models.js

@@ -252,6 +252,7 @@ module.exports = app => app.component('models', {
       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;
       }
@@ -266,6 +267,10 @@ module.exports = app => app.component('models', {
       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;

package/frontend/src/splash/splash.html

@@ -17,7 +17,7 @@
         <async-button
           type="button"
           @click="loginWithGithub"
-          class="rounded bg-ultramarine-600 px-2 py-2 text-sm font-semibold text-white shadow-sm hover:bg-ultramarine-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ultramarine-600">
+          class="rounded bg-ultramarine-600 px-2 py-2 text-sm font-semibold text-white shadow-sm hover:bg-ultramarine-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ultramarine-600 disabled:bg-gray-500">
           <svg viewBox="0 0 98 98" class="inline mr-1" height="1.5em" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M48.854 0C21.839 0 0 22 0 49.217c0 21.756 13.993 40.172 33.405 46.69 2.427.49 3.316-1.059 3.316-2.362 0-1.141-.08-5.052-.08-9.127-13.59 2.934-16.42-5.867-16.42-5.867-2.184-5.704-5.42-7.17-5.42-7.17-4.448-3.015.324-3.015.324-3.015 4.934.326 7.523 5.052 7.523 5.052 4.367 7.496 11.404 5.378 14.235 4.074.404-3.178 1.699-5.378 3.074-6.6-10.839-1.141-22.243-5.378-22.243-24.283 0-5.378 1.94-9.778 5.014-13.2-.485-1.222-2.184-6.275.486-13.038 0 0 4.125-1.304 13.426 5.052a46.97 46.97 0 0 1 12.214-1.63c4.125 0 8.33.571 12.213 1.63 9.302-6.356 13.427-5.052 13.427-5.052 2.67 6.763.97 11.816.485 13.038 3.155 3.422 5.015 7.822 5.015 13.2 0 18.905-11.404 23.06-22.324 24.283 1.78 1.548 3.316 4.481 3.316 9.126 0 6.6-.08 11.897-.08 13.526 0 1.304.89 2.853 3.316 2.364 19.412-6.52 33.405-24.935 33.405-46.691C97.707 22 75.788 0 48.854 0z" fill="#fff"/></svg>
           Login With GitHub
         </async-button>
@@ -26,7 +26,7 @@
         <async-button
           type="button"
           @click="loginWithGoogle"
-          class="rounded bg-ultramarine-600 px-2 py-2 text-sm font-semibold text-white shadow-sm hover:bg-ultramarine-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ultramarine-600">
+          class="rounded bg-ultramarine-600 px-2 py-2 text-sm font-semibold text-white shadow-sm hover:bg-ultramarine-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ultramarine-600 disabled:bg-gray-500">
           <svg class="inline" xmlns="http://www.w3.org/2000/svg" height="1.5em" viewBox="0 0 512 512"><path fill="#fff" d="M386 400c45-42 65-112 53-179H260v74h102c-4 24-18 44-38 57z"/><path fill="#fff" d="M90 341a192 192 0 0 0 296 59l-62-48c-53 35-141 22-171-60z"/><path fill="#fff" d="M153 292c-8-25-8-48 0-73l-63-49c-23 46-30 111 0 171z"/><path fill="#fff" d="M153 219c22-69 116-109 179-50l55-54c-78-75-230-72-297 55z"/></svg>
           Login With Google
         </async-button>

package/package.json

@@ -1,12 +1,13 @@
 {
   "name": "@mongoosejs/studio",
-  "version": "0.0.133",
+  "version": "0.0.136",
   "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": {
     "type": "git",
     "url": "https://github.com/mongoosejs/studio"
   },
+  "license": "Apache-2.0",
   "dependencies": {
     "archetype": "0.13.1",
     "csv-stringify": "6.3.0",