mito-ai 0.1.38__py3-none-any.whl → 0.1.40__py3-none-any.whl

mito_ai-0.1.38.data/data/share/jupyter/labextensions/mito_ai/static/lib_index_js.5d1d7c234e2dc7c9d97b.js → mito_ai-0.1.40.data/data/share/jupyter/labextensions/mito_ai/static/lib_index_js.55d9f8ca386d87856d2d.js

@@ -278,8 +278,8 @@ class ChatHistoryManager {
         });
     }
     deduplicateAssumptions(agentResponse) {
-        var _a;
-        if (!((_a = agentResponse.analysis_assumptions) === null || _a === void 0 ? void 0 : _a.length)) {
+        // If there are no assumptions, return the original response
+        if ((agentResponse === null || agentResponse === void 0 ? void 0 : agentResponse.analysis_assumptions) === undefined || (agentResponse === null || agentResponse === void 0 ? void 0 : agentResponse.analysis_assumptions) === null) {
             return agentResponse;
         }
         const newAssumptions = agentResponse.analysis_assumptions.filter(assumption => !this._allAssumptions.has(assumption));
@@ -523,9 +523,10 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ });
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "webpack/sharing/consume/default/react");
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _components_TextButton__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../components/TextButton */ "./lib/components/TextButton.js");
-/* harmony import */ var _utils_errors__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../utils/errors */ "./lib/utils/errors.js");
-/* harmony import */ var _utils_stripe__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../utils/stripe */ "./lib/utils/stripe.js");
+/* harmony import */ var _components_TextButton__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../components/TextButton */ "./lib/components/TextButton.js");
+/* harmony import */ var _utils_errors__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../utils/errors */ "./lib/utils/errors.js");
+/* harmony import */ var _utils_stripe__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../utils/stripe */ "./lib/utils/stripe.js");
+/* harmony import */ var _restAPI_RestAPI__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../restAPI/RestAPI */ "./lib/restAPI/RestAPI.js");
 /*
  * Copyright (c) Saga Inc.
  * Distributed under the terms of the GNU Affero General Public License v3.0 License.
@@ -534,8 +535,14 @@ __webpack_require__.r(__webpack_exports__);
 
 
 
+
 const AlertBlock = ({ content, mitoAIConnectionErrorType }) => {
-    if (mitoAIConnectionErrorType === _utils_errors__WEBPACK_IMPORTED_MODULE_1__.FREE_TIER_LIMIT_REACHED_ERROR_TITLE) {
+    const [showEmailDetails, setShowEmailDetails] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
+    // The first time this AlertBlock is rendered, log the error type
+    (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
+        void (0,_restAPI_RestAPI__WEBPACK_IMPORTED_MODULE_1__.logEvent)('alert_block_displayed', { 'type': mitoAIConnectionErrorType, 'error': content });
+    }, []);
+    if (mitoAIConnectionErrorType === _utils_errors__WEBPACK_IMPORTED_MODULE_2__.FREE_TIER_LIMIT_REACHED_ERROR_TITLE) {
         return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "chat-message-alert" },
             react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", null,
                 "You've used up your free trial of Mito AI for this month. To continue using Mito AI now, upgrade to ",
@@ -546,9 +553,28 @@ const AlertBlock = ({ content, mitoAIConnectionErrorType }) => {
                 react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, "Unlimited AI Autocompletes"),
                 react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, "All Mito Spreadsheet Pro features")),
             react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", null, "Or supply your own Open AI Key to continue using the basic version of Mito AI."),
-            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_components_TextButton__WEBPACK_IMPORTED_MODULE_2__["default"], { title: "Upgrade to Pro", text: "Upgrade to Pro", action: _utils_stripe__WEBPACK_IMPORTED_MODULE_3__.STRIPE_PAYMENT_LINK, variant: "purple", width: "block" })));
-    }
-    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "chat-message-alert" }, content));
+            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_components_TextButton__WEBPACK_IMPORTED_MODULE_3__["default"], { title: "Upgrade to Pro", text: "Upgrade to Pro", action: _utils_stripe__WEBPACK_IMPORTED_MODULE_4__.STRIPE_PAYMENT_LINK, variant: "purple", width: "block" })));
+    }
+    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "chat-message-alert-container" },
+        react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "chat-message-alert" },
+            react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "alert-error-message" },
+                "\u26A0 ",
+                content)),
+        react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", null,
+            react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", { className: "alert-actions-title" }, "If this issue persists, we recommend:"),
+            react__WEBPACK_IMPORTED_MODULE_0___default().createElement("ul", { className: "alert-actions-list" },
+                react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, "Restarting JupyterLab completely"),
+                react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, "Upgrading to the latest version of Mito AI"),
+                react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null,
+                    "Sending us an email to founders@sagacollab.com \u00A0",
+                    react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "details-toggle" },
+                        react__WEBPACK_IMPORTED_MODULE_0___default().createElement("button", { type: "button", onClick: () => setShowEmailDetails(!showEmailDetails), className: "toggle-button" },
+                            react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { className: "toggle-text" }, " Info to send us"),
+                            react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { className: `toggle-caret ${showEmailDetails ? 'open' : ''}` }, "\u25BC"))),
+                    showEmailDetails && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "details-content" },
+                        react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, "A screenshot of your entire Jupyter window"),
+                        react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, "A screenshot of your browser's console. You can access this by right clicking on this error message, clicking \"Inspect\", and then clicking the \"Console\" tab. Then find the red error message at the bottom of the console and screenshot it."),
+                        react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", null, "Your `pip list` output"))))))));
 };
 /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (AlertBlock);
 
@@ -906,14 +932,13 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "webpack/sharing/consume/default/react");
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
 /* harmony import */ var _utils_classNames__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../utils/classNames */ "./lib/utils/classNames.js");
-/* harmony import */ var _ChatDropdown__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./ChatDropdown */ "./lib/Extensions/AiChat/ChatMessage/ChatDropdown.js");
+/* harmony import */ var _ChatDropdown__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./ChatDropdown */ "./lib/Extensions/AiChat/ChatMessage/ChatDropdown.js");
 /* harmony import */ var _utils_notebook__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../utils/notebook */ "./lib/utils/notebook.js");
-/* harmony import */ var _PythonCode__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./PythonCode */ "./lib/Extensions/AiChat/ChatMessage/PythonCode.js");
 /* harmony import */ var _style_ChatInput_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../style/ChatInput.css */ "./style/ChatInput.css");
 /* harmony import */ var _style_ChatDropdown_css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../style/ChatDropdown.css */ "./style/ChatDropdown.css");
 /* harmony import */ var _hooks_useDebouncedFunction__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../hooks/useDebouncedFunction */ "./lib/hooks/useDebouncedFunction.js");
-/* harmony import */ var _components_SelectedContextContainer__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../../components/SelectedContextContainer */ "./lib/components/SelectedContextContainer.js");
-/* harmony import */ var _components_DatabaseButton__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../../components/DatabaseButton */ "./lib/components/DatabaseButton.js");
+/* harmony import */ var _components_SelectedContextContainer__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../../components/SelectedContextContainer */ "./lib/components/SelectedContextContainer.js");
+/* harmony import */ var _components_DatabaseButton__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../components/DatabaseButton */ "./lib/components/DatabaseButton.js");
 /*
  * Copyright (c) Saga Inc.
  * Distributed under the terms of the GNU Affero General Public License v3.0 License.
@@ -927,14 +952,13 @@ __webpack_require__.r(__webpack_exports__);
 
 
 
-
-const ChatInput = ({ app, initialContent, placeholder, onSave, onCancel, isEditing, contextManager, notebookTracker, renderMimeRegistry, displayActiveCellCode = true, agentModeEnabled = false, agentExecutionStatus = 'idle', }) => {
+const ChatInput = ({ app, initialContent, placeholder, onSave, onCancel, isEditing, contextManager, notebookTracker, agentModeEnabled = false, agentExecutionStatus = 'idle', }) => {
     var _a;
     const [input, setInput] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(initialContent);
     const [expandedVariables, setExpandedVariables] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)([]);
     const textAreaRef = react__WEBPACK_IMPORTED_MODULE_0___default().useRef(null);
-    const [isFocused, setIsFocused] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
     const [activeCellID, setActiveCellID] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)((0,_utils_notebook__WEBPACK_IMPORTED_MODULE_3__.getActiveCellID)(notebookTracker));
+    const activeCellCode = (0,_utils_notebook__WEBPACK_IMPORTED_MODULE_3__.getActiveCellCode)(notebookTracker) || '';
     const [isDropdownVisible, setDropdownVisible] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
     const [dropdownFilter, setDropdownFilter] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)('');
     const [additionalContext, setAdditionalContext] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)([]);
@@ -1119,19 +1143,30 @@ const ChatInput = ({ app, initialContent, placeholder, onSave, onCancel, isEditi
         ];
         setExpandedVariables(expandedVariables);
     }, [contextManager === null || contextManager === void 0 ? void 0 : contextManager.variables, contextManager === null || contextManager === void 0 ? void 0 : contextManager.files]);
-    // If there are more than 8 lines, show the first 8 lines and add a "..."
-    const activeCellCode = (0,_utils_notebook__WEBPACK_IMPORTED_MODULE_3__.getCellCodeByID)(notebookTracker, activeCellID) || '';
-    const activeCellCodePreview = activeCellCode.split('\n').slice(0, 8).join('\n') + (activeCellCode.split('\n').length > 8 ? '\n\n# Rest of active cell code...' : '');
-    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: (0,_utils_classNames__WEBPACK_IMPORTED_MODULE_5__.classNames)("chat-input-container"), onFocus: () => setIsFocused(true), onBlur: () => {
-            setIsFocused(false);
-        } },
-        displayActiveCellCode && activeCellCodePreview.length > 0 && !agentModeEnabled
-            && (isFocused || input.length > 0)
-            && react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: 'active-cell-preview-container', "data-testid": 'active-cell-preview-container' },
-                react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: 'code-block-container' },
-                    react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_PythonCode__WEBPACK_IMPORTED_MODULE_6__["default"], { code: activeCellCodePreview, renderMimeRegistry: renderMimeRegistry }))),
+    // Automatically add active cell context when in Chat mode and there's active cell code
+    (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => {
+        if (!agentModeEnabled) {
+            // Check if active cell context is already present
+            const hasActiveCellContext = additionalContext.some(context => context.type === 'active_cell');
+            if (!hasActiveCellContext) {
+                setAdditionalContext(prev => [...prev, {
+                        type: 'active_cell',
+                        value: 'Active Cell',
+                        display: 'Active Cell'
+                    }]);
+            }
+        }
+        else if (agentModeEnabled) {
+            // Remove active cell context when in agent mode
+            const hasActiveCellContext = additionalContext.some(context => context.type === 'active_cell');
+            if (hasActiveCellContext) {
+                setAdditionalContext(prev => prev.filter(context => context.type !== 'active_cell'));
+            }
+        }
+    }, [agentModeEnabled, additionalContext, activeCellCode]);
+    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: (0,_utils_classNames__WEBPACK_IMPORTED_MODULE_5__.classNames)("chat-input-container") },
         react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: 'context-container' },
-            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_components_DatabaseButton__WEBPACK_IMPORTED_MODULE_7__["default"], { app: app }),
+            react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_components_DatabaseButton__WEBPACK_IMPORTED_MODULE_6__["default"], { app: app }),
             react__WEBPACK_IMPORTED_MODULE_0___default().createElement("button", { className: "context-button", onClick: () => {
                     var _a;
                     setDropdownVisible(true);
@@ -1139,7 +1174,7 @@ const ChatInput = ({ app, initialContent, placeholder, onSave, onCancel, isEditi
                     setIsDropdownFromButton(true);
                     (_a = textAreaRef.current) === null || _a === void 0 ? void 0 : _a.focus();
                 } }, "\uFF20 Add Context"),
-            additionalContext.map((context, index) => (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_components_SelectedContextContainer__WEBPACK_IMPORTED_MODULE_8__["default"], { key: `${context.type}-${context.value}-${index}`, title: context.type === 'db' && context.display ? context.display : context.value, type: context.type, onRemove: () => setAdditionalContext(additionalContext.filter((_, i) => i !== index)) })))),
+            additionalContext.map((context, index) => (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_components_SelectedContextContainer__WEBPACK_IMPORTED_MODULE_7__["default"], { key: `${context.type}-${context.value}-${index}`, title: context.type === 'db' && context.display ? context.display : context.value, type: context.type, onRemove: () => setAdditionalContext(additionalContext.filter((_, i) => i !== index)), notebookTracker: notebookTracker, activeCellID: activeCellID })))),
         react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: 'chat-input-text-area-container' },
             react__WEBPACK_IMPORTED_MODULE_0___default().createElement("textarea", { ref: textAreaRef, className: (0,_utils_classNames__WEBPACK_IMPORTED_MODULE_5__.classNames)("message", "message-user", 'chat-input', { "agent-mode": agentModeEnabled }), placeholder: placeholder, value: input, disabled: agentExecutionStatus === 'working' || agentExecutionStatus === 'stopping', onChange: handleInputChange, onKeyDown: (e) => {
                     // If dropdown is visible, only handle escape to close it
@@ -1159,7 +1194,6 @@ const ChatInput = ({ app, initialContent, placeholder, onSave, onCancel, isEditi
                         // Reset
                         setInput('');
                         setAdditionalContext([]);
-                        setIsFocused(false);
                     }
                     // Escape key cancels editing
                     if (e.key === 'Escape') {
@@ -1169,7 +1203,7 @@ const ChatInput = ({ app, initialContent, placeholder, onSave, onCancel, isEditi
                         }
                     }
                 } }),
-            isDropdownVisible && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_ChatDropdown__WEBPACK_IMPORTED_MODULE_9__["default"], { options: expandedVariables, onSelect: handleOptionSelect, filterText: dropdownFilter, isDropdownFromButton: isDropdownFromButton, onFilterChange: setDropdownFilter, onClose: handleDropdownClose }))),
+            isDropdownVisible && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_ChatDropdown__WEBPACK_IMPORTED_MODULE_8__["default"], { options: expandedVariables, onSelect: handleOptionSelect, filterText: dropdownFilter, isDropdownFromButton: isDropdownFromButton, onFilterChange: setDropdownFilter, onClose: handleDropdownClose }))),
         isEditing &&
             react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "message-edit-buttons" },
                 react__WEBPACK_IMPORTED_MODULE_0___default().createElement("button", { onClick: () => onSave(input, undefined, mapAdditionalContext()) }, "Save"),
@@ -1263,7 +1297,7 @@ const ChatMessage = ({ app, message, promptType, agentResponse, messageIndex, mi
         setNextSteps(agentResponse.next_steps);
     }
     if (isEditing) {
-        return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_ChatInput__WEBPACK_IMPORTED_MODULE_4__["default"], { app: app, initialContent: message.content.replace(/```[\s\S]*?```/g, '').trim(), placeholder: "Edit your message", onSave: handleSave, onCancel: handleCancel, isEditing: isEditing, contextManager: contextManager, notebookTracker: notebookTracker, renderMimeRegistry: renderMimeRegistry, displayActiveCellCode: true, agentModeEnabled: false }));
+        return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_ChatInput__WEBPACK_IMPORTED_MODULE_4__["default"], { app: app, initialContent: message.content.replace(/```[\s\S]*?```/g, '').trim(), placeholder: "Edit your message", onSave: handleSave, onCancel: handleCancel, isEditing: isEditing, contextManager: contextManager, notebookTracker: notebookTracker, agentModeEnabled: false }));
     }
     if (mitoAIConnectionError) {
         return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: (0,_utils_classNames__WEBPACK_IMPORTED_MODULE_5__.classNames)("message") },
@@ -1296,7 +1330,9 @@ const ChatMessage = ({ app, message, promptType, agentResponse, messageIndex, mi
                                 react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_components_TextButton__WEBPACK_IMPORTED_MODULE_13__["default"], { onClick: () => { acceptAICode(); }, text: `Accept code ${operatingSystem === 'mac' ? '⌘Y' : 'Ctrl+Y'}`, title: 'Accept the Ai generated code', variant: 'green', width: 'fit-contents' }),
                                 react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_components_TextButton__WEBPACK_IMPORTED_MODULE_13__["default"], { onClick: () => { rejectAICode(); }, text: `Reject code ${operatingSystem === 'mac' ? '⌘U' : 'Ctrl+U'}`, title: 'Reject the Ai generated code and revert to the previous version of the code cell', variant: 'red', width: 'fit-contents' })),
                         message.role === 'user' && additionalContext && additionalContext.length > 0 &&
-                            react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, additionalContext.map((context, index) => (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_components_SelectedContextContainer__WEBPACK_IMPORTED_MODULE_14__["default"], { key: `${context.type}-${context.value}-${index}`, title: `${context.type.charAt(0).toUpperCase() + context.type.slice(1)}: ${context.value}`, type: context.type, onRemove: () => { } }))))));
+                            react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, additionalContext
+                                .filter(context => context.type !== 'active_cell') // Hide active cell context in chat messages
+                                .map((context, index) => (react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_components_SelectedContextContainer__WEBPACK_IMPORTED_MODULE_14__["default"], { key: `${context.type}-${context.value}-${index}`, title: `${context.value}`, type: context.type, onRemove: () => { } }))))));
                 }
                 else {
                     // Return null for empty code blocks
@@ -2601,7 +2637,7 @@ const ChatTaskpane = ({ notebookTracker, renderMimeRegistry, contextManager, app
                     break;
                 }
             }
-            if (agentResponse.type === 'get_cell_output') {
+            if (agentResponse.type === 'get_cell_output' && agentResponse.get_cell_output_cell_id !== null && agentResponse.get_cell_output_cell_id !== undefined) {
                 // Mark that we should send the cell output to the agent 
                 // in the next loop iteration
                 sendCellIDOutput = agentResponse.get_cell_output_cell_id;
@@ -2946,7 +2982,7 @@ const ChatTaskpane = ({ notebookTracker, renderMimeRegistry, contextManager, app
                     agentExecutionStatus === 'stopping' ? 'Agent is stopping...' :
                         agentModeEnabled ? 'Ask agent to do anything' :
                             displayOptimizedChatHistory.length < 2 ? `Ask question (${operatingSystem === 'mac' ? '⌘' : 'Ctrl'}E), @ to mention`
-                                : `Ask followup (${operatingSystem === 'mac' ? '⌘' : 'Ctrl'}E), @ to mention`, onSave: agentModeEnabled ? startAgentExecution : sendChatInputMessage, onCancel: undefined, isEditing: false, contextManager: contextManager, notebookTracker: notebookTracker, renderMimeRegistry: renderMimeRegistry, agentModeEnabled: agentModeEnabled, agentExecutionStatus: agentExecutionStatus })),
+                                : `Ask followup (${operatingSystem === 'mac' ? '⌘' : 'Ctrl'}E), @ to mention`, onSave: agentModeEnabled ? startAgentExecution : sendChatInputMessage, onCancel: undefined, isEditing: false, contextManager: contextManager, notebookTracker: notebookTracker, agentModeEnabled: agentModeEnabled, agentExecutionStatus: agentExecutionStatus })),
         agentExecutionStatus !== 'working' && agentExecutionStatus !== 'stopping' && (react__WEBPACK_IMPORTED_MODULE_1___default().createElement("div", { className: "chat-controls" },
             react__WEBPACK_IMPORTED_MODULE_1___default().createElement("div", { className: "chat-controls-left" },
                 react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_components_ToggleButton__WEBPACK_IMPORTED_MODULE_37__["default"], { leftText: "Chat", leftTooltip: "Chat mode suggests an edit to the active cell and let's you decide to accept or reject it.", rightText: "Agent", rightTooltip: "Agent mode writes and executes code until it's finished your request.", isLeftSelected: !agentModeEnabled, onChange: async (isLeftSelected) => {
@@ -3501,12 +3537,14 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ });
 /* harmony import */ var _jupyterlab_coreutils__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @jupyterlab/coreutils */ "webpack/sharing/consume/default/@jupyterlab/coreutils");
 /* harmony import */ var _jupyterlab_coreutils__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_jupyterlab_coreutils__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _requirementsUtils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./requirementsUtils */ "./lib/Extensions/AppBuilder/requirementsUtils.js");
-/* harmony import */ var _fileUtils__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./fileUtils */ "./lib/Extensions/AppBuilder/fileUtils.js");
-/* harmony import */ var _lumino_coreutils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @lumino/coreutils */ "webpack/sharing/consume/default/@lumino/coreutils");
-/* harmony import */ var _lumino_coreutils__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_lumino_coreutils__WEBPACK_IMPORTED_MODULE_1__);
-/* harmony import */ var _DeployAppNotification__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./DeployAppNotification */ "./lib/Extensions/AppBuilder/DeployAppNotification.js");
-/* harmony import */ var _auth__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./auth */ "./lib/Extensions/AppBuilder/auth.js");
+/* harmony import */ var _jupyterlab_apputils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @jupyterlab/apputils */ "webpack/sharing/consume/default/@jupyterlab/apputils");
+/* harmony import */ var _jupyterlab_apputils__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_jupyterlab_apputils__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _requirementsUtils__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./requirementsUtils */ "./lib/Extensions/AppBuilder/requirementsUtils.js");
+/* harmony import */ var _fileUtils__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./fileUtils */ "./lib/Extensions/AppBuilder/fileUtils.js");
+/* harmony import */ var _lumino_coreutils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @lumino/coreutils */ "webpack/sharing/consume/default/@lumino/coreutils");
+/* harmony import */ var _lumino_coreutils__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_lumino_coreutils__WEBPACK_IMPORTED_MODULE_2__);
+/* harmony import */ var _DeployAppNotification__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./DeployAppNotification */ "./lib/Extensions/AppBuilder/DeployAppNotification.js");
+/* harmony import */ var _auth__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./auth */ "./lib/Extensions/AppBuilder/auth.js");
 /*
  * Copyright (c) Saga Inc.
  * Distributed under the terms of the GNU Affero General Public License v3.0 License.
@@ -3517,12 +3555,13 @@ __webpack_require__.r(__webpack_exports__);
 
 
 
+
 /*
 This function generates a requirements.txt file that lists the dependencies for the streamlit app
 */
 const convertNotebookToStreamlit = async (notebookTracker, appBuilderService) => {
     // Check authentication before proceeding with deployment
-    const isAuthenticated = await (0,_auth__WEBPACK_IMPORTED_MODULE_2__.checkAuthenticationAndRedirect)();
+    const isAuthenticated = await (0,_auth__WEBPACK_IMPORTED_MODULE_3__.checkAuthenticationAndRedirect)();
     if (!isAuthenticated) {
         console.log('User not authenticated, redirected to signup');
         return;
@@ -3539,24 +3578,31 @@ const convertNotebookToStreamlit = async (notebookTracker, appBuilderService) =>
     console.log('Current working directory info:', notebookPanel.context);
     // Build the requirements.txt file
     console.debug("Building requirements.txt file");
-    const requirementsContent = await (0,_requirementsUtils__WEBPACK_IMPORTED_MODULE_3__.generateRequirementsTxt)(notebookTracker);
+    const requirementsContent = await (0,_requirementsUtils__WEBPACK_IMPORTED_MODULE_4__.generateRequirementsTxt)(notebookTracker);
     // Save the files to the current directory
-    await (0,_fileUtils__WEBPACK_IMPORTED_MODULE_4__.saveFileWithKernel)(notebookTracker, './requirements.txt', requirementsContent);
+    await (0,_fileUtils__WEBPACK_IMPORTED_MODULE_5__.saveFileWithKernel)(notebookTracker, './requirements.txt', requirementsContent);
     // After building the files, we need to send a request to the backend to deploy the app
     if (appBuilderService) {
         try {
             console.log("Sending request to deploy the app");
             // Get JWT token for authentication
-            const jwtToken = (0,_auth__WEBPACK_IMPORTED_MODULE_2__.getJWTToken)();
+            const jwtToken = (0,_auth__WEBPACK_IMPORTED_MODULE_3__.getJWTToken)();
             const response = await appBuilderService.client.sendMessage({
                 type: 'build-app',
-                message_id: _lumino_coreutils__WEBPACK_IMPORTED_MODULE_1__.UUID.uuid4(),
+                message_id: _lumino_coreutils__WEBPACK_IMPORTED_MODULE_2__.UUID.uuid4(),
                 notebook_path: notebookPath,
                 jwt_token: jwtToken || appBuilderService.client.serverSettings.token
             });
-            console.log("App deployment response:", response);
-            const url = response.url;
-            (0,_DeployAppNotification__WEBPACK_IMPORTED_MODULE_5__.deployAppNotification)(url);
+            if (response.error) {
+                _jupyterlab_apputils__WEBPACK_IMPORTED_MODULE_1__.Notification.emit(response.error.title, 'error', {
+                    autoClose: false
+                });
+            }
+            else {
+                console.log("App deployment response:", response);
+                const url = response.url;
+                (0,_DeployAppNotification__WEBPACK_IMPORTED_MODULE_6__.deployAppNotification)(url);
+            }
         }
         catch (error) {
             // TODO: Do something with the error
@@ -3600,11 +3646,23 @@ const client_id = '6ara3u3l8sss738hrhbq1qtiqf';
 // Change this to domain_dev for dev deployments
 const active_domain = domain_dev;
 const currentUrl = window.location.href;
+let redirectUrl;
+// As of now we only support localhost:8888 because we have only allowed this redirect url on AWS conito
+// We can modify the redirect to include other ports in the future
+if (currentUrl.includes('localhost')) {
+    redirectUrl = 'http://localhost:8888/lab';
+}
+else if (currentUrl.includes('trymito')) {
+    redirectUrl = 'https://launch.trymito.io';
+}
+else {
+    redirectUrl = currentUrl;
+}
 console.log("currentUrl: ", currentUrl);
 // AWS Cognito configuration
 const COGNITO_CONFIG = {
-    SIGNUP_URL: `${active_domain}/signup?client_id=${client_id}&response_type=code&scope=email+openid+profile&redirect_uri=${currentUrl}`,
-    SIGNIN_URL: `${active_domain}/login?client_id=${client_id}&response_type=code&scope=email+openid+profile&redirect_uri=${currentUrl}`,
+    SIGNUP_URL: `${active_domain}/signup?client_id=${client_id}&response_type=code&scope=email+openid+profile&redirect_uri=${redirectUrl}`,
+    SIGNIN_URL: `${active_domain}/login?client_id=${client_id}&response_type=code&scope=email+openid+profile&redirect_uri=${redirectUrl}`,
     JWT_COOKIE_NAME: 'mito-auth-token',
     JWT_COOKIE_EXPIRY_HOURS: 1
 };
@@ -4147,7 +4205,13 @@ def get_dataframe_structure(df, sample_size=5):
             # Handle None and NaN (convert to None, which maps to null in JSON)
             return None
         elif not isinstance(value, (str, int, float, bool, type(None))):
-            return str(value)            
+            value_str = str(value)
+            if len(value_str) > 50:
+                return value_str[:50] + "..."
+            return value_str
+        elif isinstance(value, str) and len(value) > 50:
+            # Truncate strings longer than 50 characters
+            return value[:50] + "..."
         return value 
         
     structure = {}
@@ -4986,13 +5050,15 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ });
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "webpack/sharing/consume/default/react");
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _model__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./model */ "./lib/Extensions/SettingsManager/database/model.js");
+/* harmony import */ var _model__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./model */ "./lib/Extensions/SettingsManager/database/model.js");
+/* harmony import */ var _GettingStartedVideo__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./GettingStartedVideo */ "./lib/Extensions/SettingsManager/database/GettingStartedVideo.js");
 /*
  * Copyright (c) Saga Inc.
  * Distributed under the terms of the GNU Affero General Public License v3.0 License.
  */
 
 
+
 const ConnectionList = ({ connections, loading, error, onDelete }) => {
     const [clickedDelete, setClickedDelete] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(null);
     if (loading) {
@@ -5004,7 +5070,10 @@ const ConnectionList = ({ connections, loading, error, onDelete }) => {
             error);
     }
     if (Object.keys(connections).length === 0) {
-        return react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", null, "No database connections found.");
+        return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "no-connections-container" },
+            react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", null, "No database connections found."),
+            react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "video-tutorial" },
+                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_GettingStartedVideo__WEBPACK_IMPORTED_MODULE_1__.GettingStartedVideo, { width: "560", height: "315" }))));
     }
     return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "connections-grid" }, Object.entries(connections).map(([id, connection]) => {
         var _a;
@@ -5013,7 +5082,7 @@ const ConnectionList = ({ connections, loading, error, onDelete }) => {
                 react__WEBPACK_IMPORTED_MODULE_0___default().createElement("h3", { className: "connection-alias" }, connection.alias ? connection.alias : connection.database),
                 react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { className: "connection-type" }, connection.type.toUpperCase())),
             react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "connection-divider" }),
-            react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "connection-details" }, (_a = _model__WEBPACK_IMPORTED_MODULE_1__.databaseConfigs[connection.type]) === null || _a === void 0 ? void 0 : _a.fields.map(field => {
+            react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "connection-details" }, (_a = _model__WEBPACK_IMPORTED_MODULE_2__.databaseConfigs[connection.type]) === null || _a === void 0 ? void 0 : _a.fields.map(field => {
                 // Skip specific fields
                 if (field.type === 'password')
                     return null;
@@ -5053,6 +5122,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
 /* harmony import */ var _ConnectionList__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./ConnectionList */ "./lib/Extensions/SettingsManager/database/ConnectionList.js");
 /* harmony import */ var _ConnectionForm__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./ConnectionForm */ "./lib/Extensions/SettingsManager/database/ConnectionForm.js");
+/* harmony import */ var _GettingStartedVideo__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./GettingStartedVideo */ "./lib/Extensions/SettingsManager/database/GettingStartedVideo.js");
 /* harmony import */ var _restAPI_utils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../restAPI/utils */ "./lib/restAPI/utils.js");
 /* harmony import */ var _style_DatabasePage_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../style/DatabasePage.css */ "./style/DatabasePage.css");
 /*
@@ -5064,11 +5134,13 @@ __webpack_require__.r(__webpack_exports__);
 
 
 
+
 const DatabasePage = () => {
     const [connections, setConnections] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)({});
     const [loading, setLoading] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(true);
     const [error, setError] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(null);
     const [showModal, setShowModal] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
+    const [showVideoModal, setShowVideoModal] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
     const [formData, setFormData] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)({
         type: 'snowflake',
         username: '',
@@ -5141,15 +5213,54 @@ const DatabasePage = () => {
     return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "db-connections" },
         react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "settings-header" },
             react__WEBPACK_IMPORTED_MODULE_0___default().createElement("h2", null, "Database Connections"),
-            react__WEBPACK_IMPORTED_MODULE_0___default().createElement("button", { className: "button-base button-purple", onClick: () => setShowModal(true) },
-                react__WEBPACK_IMPORTED_MODULE_0___default().createElement("b", null, "\uFF0B Add Connection"))),
+            react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "header-buttons" },
+                Object.keys(connections).length > 0 && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("button", { className: "button-base button-gray", onClick: () => setShowVideoModal(true) },
+                    react__WEBPACK_IMPORTED_MODULE_0___default().createElement("b", null, "Getting Started"))),
+                react__WEBPACK_IMPORTED_MODULE_0___default().createElement("button", { className: "button-base button-purple", onClick: () => setShowModal(true) },
+                    react__WEBPACK_IMPORTED_MODULE_0___default().createElement("b", null, "\uFF0B Add Connection")))),
         react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_ConnectionList__WEBPACK_IMPORTED_MODULE_3__.ConnectionList, { connections: connections, loading: loading, error: error, onDelete: handleDelete }),
         showModal && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "modal-overlay", onClick: () => setShowModal(false) },
             react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "modal-content", onClick: e => e.stopPropagation() },
                 react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "modal-header" },
                     react__WEBPACK_IMPORTED_MODULE_0___default().createElement("h3", null, "Add New Connection"),
                     react__WEBPACK_IMPORTED_MODULE_0___default().createElement("button", { className: "modal-close-button", onClick: () => setShowModal(false) }, "\u2715")),
-                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_ConnectionForm__WEBPACK_IMPORTED_MODULE_4__.ConnectionForm, { formData: formData, formError: formError, onInputChange: handleInputChange, onSubmit: handleSubmit, onClose: () => setShowModal(false) }))))));
+                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_ConnectionForm__WEBPACK_IMPORTED_MODULE_4__.ConnectionForm, { formData: formData, formError: formError, onInputChange: handleInputChange, onSubmit: handleSubmit, onClose: () => setShowModal(false) })))),
+        showVideoModal && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "modal-overlay", onClick: () => setShowVideoModal(false) },
+            react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "modal-content video-modal", onClick: e => e.stopPropagation() },
+                react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "modal-header" },
+                    react__WEBPACK_IMPORTED_MODULE_0___default().createElement("h3", null, "Getting Started"),
+                    react__WEBPACK_IMPORTED_MODULE_0___default().createElement("button", { className: "modal-close-button", onClick: () => setShowVideoModal(false) }, "\u2715")),
+                react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_GettingStartedVideo__WEBPACK_IMPORTED_MODULE_5__.GettingStartedVideo, null),
+                react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "video-description" },
+                    react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", null,
+                        "Still have questions? Check out our ",
+                        react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", { href: "https://docs.trymito.io/mito-ai/database-connectors", target: "_blank", rel: "noopener noreferrer" }, "documentation"),
+                        " for more information.")))))));
+};
+
+
+/***/ }),
+
+/***/ "./lib/Extensions/SettingsManager/database/GettingStartedVideo.js":
+/*!************************************************************************!*\
+  !*** ./lib/Extensions/SettingsManager/database/GettingStartedVideo.js ***!
+  \************************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   GettingStartedVideo: () => (/* binding */ GettingStartedVideo)
+/* harmony export */ });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "webpack/sharing/consume/default/react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/*
+ * Copyright (c) Saga Inc.
+ * Distributed under the terms of the GNU Affero General Public License v3.0 License.
+ */
+
+const GettingStartedVideo = ({ width = "100%", height = "400", className = "" }) => {
+    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: `video-container ${className}` },
+        react__WEBPACK_IMPORTED_MODULE_0___default().createElement("iframe", { width: width, height: height, src: "https://www.youtube.com/embed/sJgphOrmZb4?rel=0", title: "How to connect to your database with Mito", frameBorder: "0", allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture", allowFullScreen: true })));
 };
 
 
@@ -6873,7 +6984,8 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "webpack/sharing/consume/default/react");
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
 /* harmony import */ var _style_ModelSelector_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../style/ModelSelector.css */ "./style/ModelSelector.css");
-/* harmony import */ var _icons_NucleausIcon__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../icons/NucleausIcon */ "./lib/icons/NucleausIcon.js");
+/* harmony import */ var _icons_NucleausIcon__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../icons/NucleausIcon */ "./lib/icons/NucleausIcon.js");
+/* harmony import */ var _utils_models__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../utils/models */ "./lib/utils/models.js");
 /*
  * Copyright (c) Saga Inc.
  * Distributed under the terms of the GNU Affero General Public License v3.0 License.
@@ -6881,15 +6993,17 @@ __webpack_require__.r(__webpack_exports__);
 
 
 
+
 const MODEL_MAPPINGS = [
+    { displayName: _utils_models__WEBPACK_IMPORTED_MODULE_2__.GPT_DISPLAY_NAME, fullName: _utils_models__WEBPACK_IMPORTED_MODULE_2__.GPT_MODEL_NAME },
     { displayName: 'GPT 4.1', fullName: 'gpt-4.1' },
-    { displayName: 'Claude 4 Opus', fullName: 'claude-opus-4-20250514' },
-    { displayName: 'Claude 4 Sonnet', fullName: 'claude-sonnet-4-20250514' },
+    { displayName: _utils_models__WEBPACK_IMPORTED_MODULE_2__.CLAUDE_OPUS_DISPLAY_NAME, fullName: _utils_models__WEBPACK_IMPORTED_MODULE_2__.CLAUDE_OPUS_MODEL_NAME },
+    { displayName: _utils_models__WEBPACK_IMPORTED_MODULE_2__.CLAUDE_SONNET_DISPLAY_NAME, fullName: _utils_models__WEBPACK_IMPORTED_MODULE_2__.CLAUDE_SONNET_MODEL_NAME },
     { displayName: 'Gemini 2.5 Pro', fullName: 'gemini-2.5-pro-preview-03-25' }
 ];
 const ALL_MODEL_DISPLAY_NAMES = MODEL_MAPPINGS.map(mapping => mapping.displayName);
 // Maximum length for displayed model name before truncating
-const DEFAULT_MODEL = 'Claude 4 Sonnet';
+const DEFAULT_MODEL = _utils_models__WEBPACK_IMPORTED_MODULE_2__.CLAUDE_SONNET_DISPLAY_NAME;
 const ModelSelector = ({ onConfigChange }) => {
     const [selectedModel, setSelectedModel] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(DEFAULT_MODEL);
     const [isOpen, setIsOpen] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
@@ -6949,7 +7063,7 @@ const ModelSelector = ({ onConfigChange }) => {
         react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: `model-selector-dropdown`, onClick: () => setIsOpen(!isOpen), title: selectedModel, "data-testid": "model-selector" },
             react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: "selected-model" },
                 react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { className: "model-icon" },
-                    react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_icons_NucleausIcon__WEBPACK_IMPORTED_MODULE_2__["default"], { height: 10, width: 10 })),
+                    react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_icons_NucleausIcon__WEBPACK_IMPORTED_MODULE_3__["default"], { height: 10, width: 10 })),
                 react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { className: "model-name" }, selectedModel),
                 react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { className: "dropdown-arrow" }, "\u25BC")),
             isOpen && (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: `model-options dropup`, style: { minWidth: '150px' } }, ALL_MODEL_DISPLAY_NAMES.map(model => (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { key: model, className: `model-option ${model === selectedModel ? 'selected' : ''}`, onClick: (e) => {
@@ -7043,6 +7157,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _icons_RuleIcon__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../icons/RuleIcon */ "./lib/icons/RuleIcon.js");
 /* harmony import */ var _icons_CodeIcon__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../icons/CodeIcon */ "./lib/icons/CodeIcon.js");
 /* harmony import */ var _icons_DatabaseIcon__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../icons/DatabaseIcon */ "./lib/icons/DatabaseIcon.js");
+/* harmony import */ var _utils_notebook__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../utils/notebook */ "./lib/utils/notebook.js");
 /*
  * Copyright (c) Saga Inc.
  * Distributed under the terms of the GNU Affero General Public License v3.0 License.
@@ -7052,7 +7167,8 @@ __webpack_require__.r(__webpack_exports__);
 
 
 
-const SelectedContextContainer = ({ title, type, onRemove }) => {
+
+const SelectedContextContainer = ({ title, type, onRemove, onClick, notebookTracker, activeCellID }) => {
     const [isHovered, setIsHovered] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(false);
     let icon = react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_icons_RuleIcon__WEBPACK_IMPORTED_MODULE_2__["default"], null);
     switch (type) {
@@ -7065,9 +7181,38 @@ const SelectedContextContainer = ({ title, type, onRemove }) => {
         case 'db':
             icon = react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_icons_DatabaseIcon__WEBPACK_IMPORTED_MODULE_4__["default"], null);
             break;
+        case 'active_cell':
+            icon = react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_icons_CodeIcon__WEBPACK_IMPORTED_MODULE_3__["default"], null);
+            break;
     }
-    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("button", { className: "selected-context-container", onMouseEnter: () => setIsHovered(true), onMouseLeave: () => setIsHovered(false), "data-testid": "selected-context-container" },
-        react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: `icon`, onClick: () => onRemove(), title: isHovered ? "Remove rule" : "Selected rule" }, isHovered ? (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { className: "remove-icon" }, "X")) : (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { className: "icon" }, icon))),
+    const handleClick = () => {
+        var _a;
+        if (type === 'active_cell') {
+            // Handle active cell context click
+            if (notebookTracker && activeCellID) {
+                // Find the cell 
+                const cell = (0,_utils_notebook__WEBPACK_IMPORTED_MODULE_5__.getCellByID)(notebookTracker, activeCellID);
+                if (cell) {
+                    // Scroll to the cell
+                    void ((_a = notebookTracker.currentWidget) === null || _a === void 0 ? void 0 : _a.content.scrollToCell(cell, 'center'));
+                    // Highlight the cell
+                    setTimeout(() => {
+                        (0,_utils_notebook__WEBPACK_IMPORTED_MODULE_5__.highlightCodeCell)(notebookTracker, activeCellID);
+                    }, 500);
+                }
+            }
+            // If notebookTracker or activeCellID are not available, do nothing
+        }
+        else if (onClick) {
+            // Call the custom onClick handler for other context types
+            onClick();
+        }
+    };
+    return (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("button", { className: "selected-context-container", onMouseEnter: () => setIsHovered(true), onMouseLeave: () => setIsHovered(false), onClick: handleClick, "data-testid": "selected-context-container" },
+        react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { className: `icon`, onClick: (e) => {
+                e.stopPropagation(); // Prevent triggering the button's onClick
+                onRemove();
+            }, title: isHovered ? "Remove rule" : "Selected rule" }, isHovered && type !== 'active_cell' ? (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { className: "remove-icon" }, "X")) : (react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { className: "icon" }, icon))),
         react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { className: "rule-name" }, title)));
 };
 /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (SelectedContextContainer);
@@ -8730,6 +8875,35 @@ const stripFileEnding = (rule) => {
 };
 
 
+/***/ }),
+
+/***/ "./lib/utils/models.js":
+/*!*****************************!*\
+  !*** ./lib/utils/models.js ***!
+  \*****************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   CLAUDE_OPUS_DISPLAY_NAME: () => (/* binding */ CLAUDE_OPUS_DISPLAY_NAME),
+/* harmony export */   CLAUDE_OPUS_MODEL_NAME: () => (/* binding */ CLAUDE_OPUS_MODEL_NAME),
+/* harmony export */   CLAUDE_SONNET_DISPLAY_NAME: () => (/* binding */ CLAUDE_SONNET_DISPLAY_NAME),
+/* harmony export */   CLAUDE_SONNET_MODEL_NAME: () => (/* binding */ CLAUDE_SONNET_MODEL_NAME),
+/* harmony export */   GPT_DISPLAY_NAME: () => (/* binding */ GPT_DISPLAY_NAME),
+/* harmony export */   GPT_MODEL_NAME: () => (/* binding */ GPT_MODEL_NAME)
+/* harmony export */ });
+/*
+ * Copyright (c) Saga Inc.
+ * Distributed under the terms of the GNU Affero General Public License v3.0 License.
+ */
+const CLAUDE_OPUS_DISPLAY_NAME = 'Claude 4.1 Opus';
+const CLAUDE_OPUS_MODEL_NAME = 'claude-opus-4-1-20250805';
+const CLAUDE_SONNET_DISPLAY_NAME = 'Claude 4 Sonnet';
+const CLAUDE_SONNET_MODEL_NAME = 'claude-sonnet-4-20250514';
+const GPT_DISPLAY_NAME = 'GPT 5 (max)';
+const GPT_MODEL_NAME = 'gpt-5';
+
+
 /***/ }),
 
 /***/ "./lib/utils/notebook.js":
@@ -10845,19 +11019,123 @@ ___CSS_LOADER_EXPORT___.push([module.id, `/*
   background-color: var(--jp-layout-color2);
 }
 
-.chat-message-alert {
-  background-color: var(--purple-300);
+.chat-message-alert-container {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+  background-color: var(--red-300);
   border-radius: 5px;
   padding: 10px;
-  border: 1px solid var(--purple-500);
-  color: var(--grey-900);
+  border: 1px solid var(--red-900);
+  color: var(--red-900);
 }
 
 .chat-message-alert a {
   color: var(--purple-700);
   text-decoration: underline;
 }
-`, "",{"version":3,"sources":["webpack://./style/ChatMessage.css"],"names":[],"mappings":"AAAA;;;EAGE;;AAEF;EACE,kBAAkB;EAClB,mBAAmB;EACnB,sBAAsB;EACtB,WAAW;EACX,eAAe;EACf,sDAAsD;EACtD,2CAA2C;AAC7C;;AAEA;EACE,mBAAmB;AACrB;;AAEA;EACE,qBAAqB;AACvB;;AAEA;EACE,2DAA2D;EAC3D,0CAA0C;EAC1C,aAAa;AACf;;AAEA;EACE,+CAA+C;AACjD;;AAEA;EACE,aAAa;EACb,mBAAmB;EACnB,QAAQ;EACR,gBAAgB;EAChB,kBAAkB;EAClB,eAAe;AACjB;;AAEA;EACE,gBAAgB;EAChB,sBAAsB;EACtB,SAAS;EACT,gBAAgB;AAClB;;AAEA;EACE,mBAAmB;AACrB;;AAEA,qCAAqC;AACrC;EACE,kBAAkB;EAClB,WAAW;EACX,UAAU;EACV,aAAa;EACb,kBAAkB;EAClB,gBAAgB,EAAE,0DAA0D;AAC9E;;AAEA,qCAAqC;AACrC;;EAEE,eAAe;EACf,UAAU;EACV;;qCAEmC;EACnC,yCAAyC;EACzC,YAAY;EACZ,aAAa;EACb,mBAAmB;EACnB,uBAAuB;EACvB,oCAAoC;AACtC;;AAEA,gCAAgC;AAChC;EACE,WAAW;EACX,YAAY;EACZ,UAAU;EACV,gBAAgB,EAAE,oCAAoC;AACxD;;AAEA,yCAAyC;AACzC;EACE,+CAA+C;AACjD;;AAEA,8FAA8F;AAC9F;;EAEE,gBAAgB;AAClB;;AAEA,2BAA2B;AAC3B;EACE,kBAAkB;EAClB,YAAY;EACZ,kBAAkB;AACpB;;AAEA,mBAAmB;AACnB;EACE,oCAAoC;AACtC;;AAEA,iBAAiB;AACjB;;EAEE,yCAAyC;AAC3C;;AAEA,kCAAkC;AAClC;;EAEE,UAAU;AACZ;;AAEA;EACE,aAAa;EACb,QAAQ;EACR,YAAY;AACd;;AAEA;EACE,iBAAiB;EACjB,kBAAkB;EAClB,yCAAyC;EACzC,oCAAoC;EACpC,yCAAyC;EACzC,eAAe;AACjB;;AAEA;EACE,yCAAyC;AAC3C;;AAEA;EACE,mCAAmC;EACnC,kBAAkB;EAClB,aAAa;EACb,mCAAmC;EACnC,sBAAsB;AACxB;;AAEA;EACE,wBAAwB;EACxB,0BAA0B;AAC5B","sourcesContent":["/*\n * Copyright (c) Saga Inc.\n * Distributed under the terms of the GNU Affero General Public License v3.0 License.\n */\n\n.message {\n  position: relative;\n  height: min-content;\n  box-sizing: border-box;\n  width: 100%;\n  font-size: 14px;\n  border-radius: var(--chat-taskpane-item-border-radius);\n  padding: 0 var(--chat-taskpane-item-indent);\n}\n\n.message:not(.chat-input) {\n  margin-bottom: 20px;\n}\n\n.message:hover .message-start-editing-button {\n  opacity: 1 !important;\n}\n\n.message-user {\n  background-color: var(--chat-user-message-background-color);\n  color: var(--chat-user-message-font-color);\n  padding: 10px;\n}\n\n.message-assistant-chat {\n  color: var(--chat-assistant-message-font-color);\n}\n\n.chat-message-buttons {\n  display: flex;\n  flex-direction: row;\n  gap: 8px;\n  margin-top: 10px;\n  margin-bottom: 4px;\n  flex-wrap: wrap;\n}\n\n.chat-taskpane-smart-debug-error-message {\n  white-space: pre;\n  font-family: monospace;\n  margin: 0;\n  overflow-x: auto;\n}\n\n.message-text {\n  align-items: center;\n}\n\n/* Message Action Buttons Container */\n.message-action-buttons {\n  position: absolute;\n  bottom: 8px;\n  right: 8px;\n  display: flex;\n  border-radius: 4px;\n  overflow: hidden; /* Ensures inner buttons don't break the rounded corners */\n}\n\n/* Common styles for action buttons */\n.message-action-buttons button,\n.message-start-editing-button {\n  cursor: pointer;\n  opacity: 0;\n  transition:\n    opacity 0.2s ease-in-out,\n    background-color 0.2s ease-in-out;\n  background-color: var(--jp-layout-color3);\n  border: none;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--jp-content-font-color1);\n}\n\n/* Action buttons in the group */\n.message-action-buttons button {\n  width: 28px;\n  height: 28px;\n  padding: 0;\n  border-radius: 0; /* Remove individual button radius */\n}\n\n/* Add subtle separator between buttons */\n.message-action-buttons button:not(:last-child) {\n  border-right: 1px solid var(--jp-border-color1);\n}\n\n/* Remove the individual button radius styles since we're handling it at the container level */\n.message-action-buttons button:first-child,\n.message-action-buttons button:last-child {\n  border-radius: 0;\n}\n\n/* Standalone edit button */\n.message-start-editing-button {\n  position: relative;\n  padding: 4px;\n  border-radius: 4px;\n}\n\n/* SVG icon color */\n.message-action-buttons button svg {\n  color: var(--jp-content-font-color1);\n}\n\n/* Hover states */\n.message-action-buttons button:hover,\n.message-start-editing-button:hover {\n  background-color: var(--jp-layout-color4);\n}\n\n/* Show buttons on message hover */\n.message:hover .message-action-buttons button,\n.message:hover .message-start-editing-button {\n  opacity: 1;\n}\n\n.message-edit-buttons {\n  display: flex;\n  gap: 8px;\n  padding: 5px;\n}\n\n.message-edit-buttons button {\n  padding: 4px 12px;\n  border-radius: 4px;\n  background-color: var(--jp-layout-color1);\n  color: var(--jp-content-font-color1);\n  border: 1px solid var(--jp-border-color1);\n  cursor: pointer;\n}\n\n.message-edit-buttons button:hover {\n  background-color: var(--jp-layout-color2);\n}\n\n.chat-message-alert {\n  background-color: var(--purple-300);\n  border-radius: 5px;\n  padding: 10px;\n  border: 1px solid var(--purple-500);\n  color: var(--grey-900);\n}\n\n.chat-message-alert a {\n  color: var(--purple-700);\n  text-decoration: underline;\n}\n"],"sourceRoot":""}]);
+
+/* New style for the main error message */
+.alert-error-message {
+  font-size: 14px;
+  font-weight: 600;
+  line-height: 1.4;
+  color: var(--red-900);
+  margin-bottom: 8px;
+}
+
+.alert-actions-header {
+  margin-bottom: 12px;
+}
+
+.alert-actions-title {
+  font-weight: 500;
+  margin: 0 0 8px 0;
+  color: var(--red-900);
+  font-size: 13px;
+}
+
+.alert-actions-list {
+  margin: 0;
+  padding-left: 16px;
+  color: var(--red-800);
+}
+
+.alert-actions-list li {
+  margin-bottom: 4px;
+  font-size: 13px;
+  line-height: 1.4;
+}
+
+.alert-action-item {
+  display: flex;
+  align-items: flex-start;
+  gap: 8px;
+  padding: 8px 0;
+  color: var(--red-800);
+  font-size: 13px;
+  line-height: 1.4;
+}
+
+.action-icon {
+  font-size: 16px;
+  flex-shrink: 0;
+  margin-top: 1px;
+}
+
+.details-toggle {
+  display: inline-flex;
+  align-items: center;
+}
+
+.toggle-button {
+  background: none;
+  border: none;
+  padding: 0;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  color: var(--red-900);
+  font-size: 12px;
+  font-family: inherit;
+  text-decoration: underline;
+}
+
+.toggle-button:hover {
+  color: var(--red-800);
+}
+
+.toggle-caret {
+  font-size: 10px;
+  transition: transform 0.2s ease;
+  display: inline-block;
+  text-decoration: none !important;
+}
+
+.toggle-caret.open {
+  transform: rotate(180deg);
+}
+
+.details-content {
+  margin-top: 8px;
+  margin-left: 16px;
+  padding: 8px;
+  background-color: var(--grey-100);
+  border-radius: 4px;
+  animation: slideDown 0.2s ease-out;
+}
+
+@keyframes slideDown {
+  from {
+    opacity: 0;
+    transform: translateY(-4px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}`, "",{"version":3,"sources":["webpack://./style/ChatMessage.css"],"names":[],"mappings":"AAAA;;;EAGE;;AAEF;EACE,kBAAkB;EAClB,mBAAmB;EACnB,sBAAsB;EACtB,WAAW;EACX,eAAe;EACf,sDAAsD;EACtD,2CAA2C;AAC7C;;AAEA;EACE,mBAAmB;AACrB;;AAEA;EACE,qBAAqB;AACvB;;AAEA;EACE,2DAA2D;EAC3D,0CAA0C;EAC1C,aAAa;AACf;;AAEA;EACE,+CAA+C;AACjD;;AAEA;EACE,aAAa;EACb,mBAAmB;EACnB,QAAQ;EACR,gBAAgB;EAChB,kBAAkB;EAClB,eAAe;AACjB;;AAEA;EACE,gBAAgB;EAChB,sBAAsB;EACtB,SAAS;EACT,gBAAgB;AAClB;;AAEA;EACE,mBAAmB;AACrB;;AAEA,qCAAqC;AACrC;EACE,kBAAkB;EAClB,WAAW;EACX,UAAU;EACV,aAAa;EACb,kBAAkB;EAClB,gBAAgB,EAAE,0DAA0D;AAC9E;;AAEA,qCAAqC;AACrC;;EAEE,eAAe;EACf,UAAU;EACV;;qCAEmC;EACnC,yCAAyC;EACzC,YAAY;EACZ,aAAa;EACb,mBAAmB;EACnB,uBAAuB;EACvB,oCAAoC;AACtC;;AAEA,gCAAgC;AAChC;EACE,WAAW;EACX,YAAY;EACZ,UAAU;EACV,gBAAgB,EAAE,oCAAoC;AACxD;;AAEA,yCAAyC;AACzC;EACE,+CAA+C;AACjD;;AAEA,8FAA8F;AAC9F;;EAEE,gBAAgB;AAClB;;AAEA,2BAA2B;AAC3B;EACE,kBAAkB;EAClB,YAAY;EACZ,kBAAkB;AACpB;;AAEA,mBAAmB;AACnB;EACE,oCAAoC;AACtC;;AAEA,iBAAiB;AACjB;;EAEE,yCAAyC;AAC3C;;AAEA,kCAAkC;AAClC;;EAEE,UAAU;AACZ;;AAEA;EACE,aAAa;EACb,QAAQ;EACR,YAAY;AACd;;AAEA;EACE,iBAAiB;EACjB,kBAAkB;EAClB,yCAAyC;EACzC,oCAAoC;EACpC,yCAAyC;EACzC,eAAe;AACjB;;AAEA;EACE,yCAAyC;AAC3C;;AAEA;EACE,aAAa;EACb,sBAAsB;EACtB,SAAS;EACT,gCAAgC;EAChC,kBAAkB;EAClB,aAAa;EACb,gCAAgC;EAChC,qBAAqB;AACvB;;AAEA;EACE,wBAAwB;EACxB,0BAA0B;AAC5B;;AAEA,yCAAyC;AACzC;EACE,eAAe;EACf,gBAAgB;EAChB,gBAAgB;EAChB,qBAAqB;EACrB,kBAAkB;AACpB;;AAEA;EACE,mBAAmB;AACrB;;AAEA;EACE,gBAAgB;EAChB,iBAAiB;EACjB,qBAAqB;EACrB,eAAe;AACjB;;AAEA;EACE,SAAS;EACT,kBAAkB;EAClB,qBAAqB;AACvB;;AAEA;EACE,kBAAkB;EAClB,eAAe;EACf,gBAAgB;AAClB;;AAEA;EACE,aAAa;EACb,uBAAuB;EACvB,QAAQ;EACR,cAAc;EACd,qBAAqB;EACrB,eAAe;EACf,gBAAgB;AAClB;;AAEA;EACE,eAAe;EACf,cAAc;EACd,eAAe;AACjB;;AAEA;EACE,oBAAoB;EACpB,mBAAmB;AACrB;;AAEA;EACE,gBAAgB;EAChB,YAAY;EACZ,UAAU;EACV,eAAe;EACf,aAAa;EACb,mBAAmB;EACnB,QAAQ;EACR,qBAAqB;EACrB,eAAe;EACf,oBAAoB;EACpB,0BAA0B;AAC5B;;AAEA;EACE,qBAAqB;AACvB;;AAEA;EACE,eAAe;EACf,+BAA+B;EAC/B,qBAAqB;EACrB,gCAAgC;AAClC;;AAEA;EACE,yBAAyB;AAC3B;;AAEA;EACE,eAAe;EACf,iBAAiB;EACjB,YAAY;EACZ,iCAAiC;EACjC,kBAAkB;EAClB,kCAAkC;AACpC;;AAEA;EACE;IACE,UAAU;IACV,2BAA2B;EAC7B;EACA;IACE,UAAU;IACV,wBAAwB;EAC1B;AACF","sourcesContent":["/*\n * Copyright (c) Saga Inc.\n * Distributed under the terms of the GNU Affero General Public License v3.0 License.\n */\n\n.message {\n  position: relative;\n  height: min-content;\n  box-sizing: border-box;\n  width: 100%;\n  font-size: 14px;\n  border-radius: var(--chat-taskpane-item-border-radius);\n  padding: 0 var(--chat-taskpane-item-indent);\n}\n\n.message:not(.chat-input) {\n  margin-bottom: 20px;\n}\n\n.message:hover .message-start-editing-button {\n  opacity: 1 !important;\n}\n\n.message-user {\n  background-color: var(--chat-user-message-background-color);\n  color: var(--chat-user-message-font-color);\n  padding: 10px;\n}\n\n.message-assistant-chat {\n  color: var(--chat-assistant-message-font-color);\n}\n\n.chat-message-buttons {\n  display: flex;\n  flex-direction: row;\n  gap: 8px;\n  margin-top: 10px;\n  margin-bottom: 4px;\n  flex-wrap: wrap;\n}\n\n.chat-taskpane-smart-debug-error-message {\n  white-space: pre;\n  font-family: monospace;\n  margin: 0;\n  overflow-x: auto;\n}\n\n.message-text {\n  align-items: center;\n}\n\n/* Message Action Buttons Container */\n.message-action-buttons {\n  position: absolute;\n  bottom: 8px;\n  right: 8px;\n  display: flex;\n  border-radius: 4px;\n  overflow: hidden; /* Ensures inner buttons don't break the rounded corners */\n}\n\n/* Common styles for action buttons */\n.message-action-buttons button,\n.message-start-editing-button {\n  cursor: pointer;\n  opacity: 0;\n  transition:\n    opacity 0.2s ease-in-out,\n    background-color 0.2s ease-in-out;\n  background-color: var(--jp-layout-color3);\n  border: none;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--jp-content-font-color1);\n}\n\n/* Action buttons in the group */\n.message-action-buttons button {\n  width: 28px;\n  height: 28px;\n  padding: 0;\n  border-radius: 0; /* Remove individual button radius */\n}\n\n/* Add subtle separator between buttons */\n.message-action-buttons button:not(:last-child) {\n  border-right: 1px solid var(--jp-border-color1);\n}\n\n/* Remove the individual button radius styles since we're handling it at the container level */\n.message-action-buttons button:first-child,\n.message-action-buttons button:last-child {\n  border-radius: 0;\n}\n\n/* Standalone edit button */\n.message-start-editing-button {\n  position: relative;\n  padding: 4px;\n  border-radius: 4px;\n}\n\n/* SVG icon color */\n.message-action-buttons button svg {\n  color: var(--jp-content-font-color1);\n}\n\n/* Hover states */\n.message-action-buttons button:hover,\n.message-start-editing-button:hover {\n  background-color: var(--jp-layout-color4);\n}\n\n/* Show buttons on message hover */\n.message:hover .message-action-buttons button,\n.message:hover .message-start-editing-button {\n  opacity: 1;\n}\n\n.message-edit-buttons {\n  display: flex;\n  gap: 8px;\n  padding: 5px;\n}\n\n.message-edit-buttons button {\n  padding: 4px 12px;\n  border-radius: 4px;\n  background-color: var(--jp-layout-color1);\n  color: var(--jp-content-font-color1);\n  border: 1px solid var(--jp-border-color1);\n  cursor: pointer;\n}\n\n.message-edit-buttons button:hover {\n  background-color: var(--jp-layout-color2);\n}\n\n.chat-message-alert-container {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n  background-color: var(--red-300);\n  border-radius: 5px;\n  padding: 10px;\n  border: 1px solid var(--red-900);\n  color: var(--red-900);\n}\n\n.chat-message-alert a {\n  color: var(--purple-700);\n  text-decoration: underline;\n}\n\n/* New style for the main error message */\n.alert-error-message {\n  font-size: 14px;\n  font-weight: 600;\n  line-height: 1.4;\n  color: var(--red-900);\n  margin-bottom: 8px;\n}\n\n.alert-actions-header {\n  margin-bottom: 12px;\n}\n\n.alert-actions-title {\n  font-weight: 500;\n  margin: 0 0 8px 0;\n  color: var(--red-900);\n  font-size: 13px;\n}\n\n.alert-actions-list {\n  margin: 0;\n  padding-left: 16px;\n  color: var(--red-800);\n}\n\n.alert-actions-list li {\n  margin-bottom: 4px;\n  font-size: 13px;\n  line-height: 1.4;\n}\n\n.alert-action-item {\n  display: flex;\n  align-items: flex-start;\n  gap: 8px;\n  padding: 8px 0;\n  color: var(--red-800);\n  font-size: 13px;\n  line-height: 1.4;\n}\n\n.action-icon {\n  font-size: 16px;\n  flex-shrink: 0;\n  margin-top: 1px;\n}\n\n.details-toggle {\n  display: inline-flex;\n  align-items: center;\n}\n\n.toggle-button {\n  background: none;\n  border: none;\n  padding: 0;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  gap: 4px;\n  color: var(--red-900);\n  font-size: 12px;\n  font-family: inherit;\n  text-decoration: underline;\n}\n\n.toggle-button:hover {\n  color: var(--red-800);\n}\n\n.toggle-caret {\n  font-size: 10px;\n  transition: transform 0.2s ease;\n  display: inline-block;\n  text-decoration: none !important;\n}\n\n.toggle-caret.open {\n  transform: rotate(180deg);\n}\n\n.details-content {\n  margin-top: 8px;\n  margin-left: 16px;\n  padding: 8px;\n  background-color: var(--grey-100);\n  border-radius: 4px;\n  animation: slideDown 0.2s ease-out;\n}\n\n@keyframes slideDown {\n  from {\n    opacity: 0;\n    transform: translateY(-4px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}"],"sourceRoot":""}]);
 // Exports
 /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
 
@@ -11530,6 +11808,28 @@ ___CSS_LOADER_EXPORT___.push([module.id, `/*
  * Distributed under the terms of the GNU Affero General Public License v3.0 License.
  */
 
+.settings-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 20px;
+}
+
+.header-buttons {
+    display: flex;
+    gap: 12px;
+    align-items: center;
+}
+
+.header-buttons .button-base {
+    min-width: 120px;
+    height: 32px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 8px 16px;
+}
+
 .connections-grid {
     display: grid;
     grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
@@ -11620,7 +11920,39 @@ ___CSS_LOADER_EXPORT___.push([module.id, `/*
 .confirmation-buttons {
     display: flex;
     gap: 8px;
-} `, "",{"version":3,"sources":["webpack://./style/DatabasePage.css"],"names":[],"mappings":"AAAA;;;EAGE;;AAEF;IACI,aAAa;IACb,4DAA4D;IAC5D,SAAS;IACT,gBAAgB;AACpB;;AAEA;IACI,mCAAmC;IACnC,yCAAyC;IACzC,kBAAkB;IAClB,aAAa;IACb,yBAAyB;IACzB,aAAa;IACb,sBAAsB;AAC1B;;AAEA;IACI,mCAAmC;AACvC;;AAEA;IACI,aAAa;IACb,8BAA8B;IAC9B,mBAAmB;IACnB,kBAAkB;AACtB;;AAEA;IACI,gBAAgB;IAChB,iBAAiB;IACjB,+BAA+B;IAC/B,SAAS;AACb;;AAEA;IACI,6BAA6B;IAC7B,wBAAwB;IACxB,mBAAmB;IACnB,iBAAiB;IACjB,iBAAiB;IACjB,gBAAgB;IAChB,0BAA0B;IAC1B,gBAAgB;AACpB;;AAEA;IACI,WAAW;IACX,mCAAmC;IACnC,oBAAoB;IACpB,WAAW;AACf;;AAEA;IACI,YAAY;AAChB;;AAEA;IACI,aAAa;IACb,gBAAgB;IAChB,+BAA+B;AACnC;;AAEA;IACI,aAAa;IACb,gBAAgB;IAChB,QAAQ;AACZ;;AAEA;IACI,gBAAgB;IAChB,gBAAgB;AACpB;;AAEA;IACI,6BAA6B;AACjC;;AAEA;IACI,wCAAwC;IACxC,YAAY;AAChB;;AAEA;IACI,kBAAkB;AACtB;;AAEA;IACI,aAAa;IACb,QAAQ;AACZ","sourcesContent":["/*\n * Copyright (c) Saga Inc.\n * Distributed under the terms of the GNU Affero General Public License v3.0 License.\n */\n\n.connections-grid {\n    display: grid;\n    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n    gap: 20px;\n    margin-top: 20px;\n}\n\n.connection-card {\n    background: var(--jp-layout-color0);\n    border: 1px solid var(--jp-border-color1);\n    border-radius: 8px;\n    padding: 16px;\n    transition: all 0.2s ease;\n    display: flex;\n    flex-direction: column;\n}\n\n.connection-card:hover {\n    border: 1px solid var(--purple-500);\n}\n\n.connection-card-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-bottom: 8px;\n}\n\n.connection-alias {\n    font-size: 1.2em;\n    font-weight: bold;\n    color: var(--jp-ui-font-color1);\n    margin: 0;\n}\n\n.connection-type {\n    background: var(--purple-100);\n    color: var(--purple-700);\n    border-radius: 12px;\n    padding: 2px 10px;\n    font-size: 0.85em;\n    font-weight: 500;\n    text-transform: capitalize;\n    margin-left: 8px;\n}\n\n.connection-divider {\n    height: 1px;\n    background: var(--jp-border-color2);\n    margin: 8px 0 12px 0;\n    width: 100%;\n}\n\n.connection-details {\n    flex-grow: 1;\n}\n\n.connection-details p {\n    margin: 4px 0;\n    font-size: 0.9em;\n    color: var(--jp-ui-font-color2);\n}\n\n.connection-actions {\n    display: flex;\n    margin-top: 12px;\n    gap: 8px;\n}\n\n.connection-actions button {\n    padding: 4px 8px;\n    font-size: 0.9em;\n}\n\n.connection-actions .delete-button {\n    color: var(--jp-error-color1);\n}\n\n.connection-actions .delete-button:hover {\n    background-color: var(--jp-error-color2);\n    color: white;\n}\n\n.delete-container {\n    position: relative;\n}\n\n.confirmation-buttons {\n    display: flex;\n    gap: 8px;\n} "],"sourceRoot":""}]);
+}
+
+/* No connections container styles */
+.no-connections-container {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    min-height: 400px;
+    text-align: center;
+    padding: 40px 20px;
+}
+
+.no-connections-container p {
+    font-size: 1.1em;
+    color: var(--jp-ui-font-color2);
+    margin-bottom: 32px;
+    margin-top: 0;
+}
+
+.video-tutorial {
+    border-radius: 8px;
+    display: block;
+    border: 1px solid var(--purple-500);
+    border-radius: 12px;
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
+    padding: 12px;
+}
+
+.video-container iframe {
+    border-radius: 8px;
+    display: block;
+} `, "",{"version":3,"sources":["webpack://./style/DatabasePage.css"],"names":[],"mappings":"AAAA;;;EAGE;;AAEF;IACI,aAAa;IACb,8BAA8B;IAC9B,mBAAmB;IACnB,mBAAmB;AACvB;;AAEA;IACI,aAAa;IACb,SAAS;IACT,mBAAmB;AACvB;;AAEA;IACI,gBAAgB;IAChB,YAAY;IACZ,aAAa;IACb,mBAAmB;IACnB,uBAAuB;IACvB,iBAAiB;AACrB;;AAEA;IACI,aAAa;IACb,4DAA4D;IAC5D,SAAS;IACT,gBAAgB;AACpB;;AAEA;IACI,mCAAmC;IACnC,yCAAyC;IACzC,kBAAkB;IAClB,aAAa;IACb,yBAAyB;IACzB,aAAa;IACb,sBAAsB;AAC1B;;AAEA;IACI,mCAAmC;AACvC;;AAEA;IACI,aAAa;IACb,8BAA8B;IAC9B,mBAAmB;IACnB,kBAAkB;AACtB;;AAEA;IACI,gBAAgB;IAChB,iBAAiB;IACjB,+BAA+B;IAC/B,SAAS;AACb;;AAEA;IACI,6BAA6B;IAC7B,wBAAwB;IACxB,mBAAmB;IACnB,iBAAiB;IACjB,iBAAiB;IACjB,gBAAgB;IAChB,0BAA0B;IAC1B,gBAAgB;AACpB;;AAEA;IACI,WAAW;IACX,mCAAmC;IACnC,oBAAoB;IACpB,WAAW;AACf;;AAEA;IACI,YAAY;AAChB;;AAEA;IACI,aAAa;IACb,gBAAgB;IAChB,+BAA+B;AACnC;;AAEA;IACI,aAAa;IACb,gBAAgB;IAChB,QAAQ;AACZ;;AAEA;IACI,gBAAgB;IAChB,gBAAgB;AACpB;;AAEA;IACI,6BAA6B;AACjC;;AAEA;IACI,wCAAwC;IACxC,YAAY;AAChB;;AAEA;IACI,kBAAkB;AACtB;;AAEA;IACI,aAAa;IACb,QAAQ;AACZ;;AAEA,oCAAoC;AACpC;IACI,aAAa;IACb,sBAAsB;IACtB,mBAAmB;IACnB,uBAAuB;IACvB,iBAAiB;IACjB,kBAAkB;IAClB,kBAAkB;AACtB;;AAEA;IACI,gBAAgB;IAChB,+BAA+B;IAC/B,mBAAmB;IACnB,aAAa;AACjB;;AAEA;IACI,kBAAkB;IAClB,cAAc;IACd,mCAAmC;IACnC,mBAAmB;IACnB,yCAAyC;IACzC,aAAa;AACjB;;AAEA;IACI,kBAAkB;IAClB,cAAc;AAClB","sourcesContent":["/*\n * Copyright (c) Saga Inc.\n * Distributed under the terms of the GNU Affero General Public License v3.0 License.\n */\n\n.settings-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-bottom: 20px;\n}\n\n.header-buttons {\n    display: flex;\n    gap: 12px;\n    align-items: center;\n}\n\n.header-buttons .button-base {\n    min-width: 120px;\n    height: 32px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: 8px 16px;\n}\n\n.connections-grid {\n    display: grid;\n    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n    gap: 20px;\n    margin-top: 20px;\n}\n\n.connection-card {\n    background: var(--jp-layout-color0);\n    border: 1px solid var(--jp-border-color1);\n    border-radius: 8px;\n    padding: 16px;\n    transition: all 0.2s ease;\n    display: flex;\n    flex-direction: column;\n}\n\n.connection-card:hover {\n    border: 1px solid var(--purple-500);\n}\n\n.connection-card-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-bottom: 8px;\n}\n\n.connection-alias {\n    font-size: 1.2em;\n    font-weight: bold;\n    color: var(--jp-ui-font-color1);\n    margin: 0;\n}\n\n.connection-type {\n    background: var(--purple-100);\n    color: var(--purple-700);\n    border-radius: 12px;\n    padding: 2px 10px;\n    font-size: 0.85em;\n    font-weight: 500;\n    text-transform: capitalize;\n    margin-left: 8px;\n}\n\n.connection-divider {\n    height: 1px;\n    background: var(--jp-border-color2);\n    margin: 8px 0 12px 0;\n    width: 100%;\n}\n\n.connection-details {\n    flex-grow: 1;\n}\n\n.connection-details p {\n    margin: 4px 0;\n    font-size: 0.9em;\n    color: var(--jp-ui-font-color2);\n}\n\n.connection-actions {\n    display: flex;\n    margin-top: 12px;\n    gap: 8px;\n}\n\n.connection-actions button {\n    padding: 4px 8px;\n    font-size: 0.9em;\n}\n\n.connection-actions .delete-button {\n    color: var(--jp-error-color1);\n}\n\n.connection-actions .delete-button:hover {\n    background-color: var(--jp-error-color2);\n    color: white;\n}\n\n.delete-container {\n    position: relative;\n}\n\n.confirmation-buttons {\n    display: flex;\n    gap: 8px;\n}\n\n/* No connections container styles */\n.no-connections-container {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    min-height: 400px;\n    text-align: center;\n    padding: 40px 20px;\n}\n\n.no-connections-container p {\n    font-size: 1.1em;\n    color: var(--jp-ui-font-color2);\n    margin-bottom: 32px;\n    margin-top: 0;\n}\n\n.video-tutorial {\n    border-radius: 8px;\n    display: block;\n    border: 1px solid var(--purple-500);\n    border-radius: 12px;\n    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);\n    padding: 12px;\n}\n\n.video-container iframe {\n    border-radius: 8px;\n    display: block;\n} "],"sourceRoot":""}]);
 // Exports
 /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
 
@@ -12224,7 +12556,7 @@ ___CSS_LOADER_EXPORT___.push([module.id, `/*
 }
 
 /* On compact screens, show only the icon */
-@container (max-width: 300px) {
+@container (max-width: 260px) {
 
   /* Shift the dropdown to the left to help prevent right-edge overflow */
   .model-options {
@@ -12238,7 +12570,7 @@ ___CSS_LOADER_EXPORT___.push([module.id, `/*
   .model-name {
     display: none;
   }
-}`, "",{"version":3,"sources":["webpack://./style/ModelSelector.css"],"names":[],"mappings":"AAAA;;;EAGE;;AAEF,4DAA4D;;AAE5D;EACE,kBAAkB;EAClB,cAAc;EACd,aAAa;EACb,YAAY,EAAE,mCAAmC;EACjD,aAAa;EACb,mBAAmB,EAAE,sBAAsB;EAC3C,+BAA+B;AACjC;;AAEA;EACE,+BAA+B;AACjC;;AAEA;EACE,kBAAkB;EAClB,YAAY,EAAE,yCAAyC;EACvD,kBAAkB;EAClB,eAAe;EACf,aAAa;EACb,mBAAmB,EAAE,0CAA0C;EAC/D,kBAAkB;EAClB,eAAe;AACjB;;;AAGA;EACE,aAAa;EACb,mBAAmB;EACnB,8BAA8B;EAC9B,WAAW;EACX,YAAY;EACZ,cAAc;EACd,eAAe;EACf,gBAAgB;EAChB,cAAc;EACd,mBAAmB;EACnB,gBAAgB;EAChB,uBAAuB;AACzB;;AAEA;EACE,aAAa;EACb,mBAAmB;EACnB,uBAAuB;EACvB,WAAW;EACX,YAAY;EACZ,cAAc;AAChB;;AAEA;EACE,cAAc;EACd,0BAA0B;EAC1B,gBAAgB;EAChB,cAAc,EAAE,iCAAiC;AACnD;;AAEA,2BAA2B;AAC3B;EACE,kBAAkB;EAClB,YAAY;EACZ,iBAAiB;EACjB,gBAAgB;EAChB,yCAAyC;EACzC,yCAAyC;EACzC,kBAAkB;EAClB,kBAAkB;EAClB,yCAAyC;EACzC,aAAa;EACb,WAAW;AACb;;AAEA;EACE,gBAAgB;EAChB,eAAe;EACf,mCAAmC;EACnC,oCAAoC;EACpC,eAAe;EACf,iCAAiC;EACjC,mBAAmB;EACnB,0BAA0B;AAC5B;;AAEA;EACE,yCAAyC;EACzC,wBAAwB;AAC1B;;AAEA;EACE,yCAAyC;EACzC,wBAAwB;AAC1B;;AAEA,4EAA4E;AAC5E;EACE,YAAY;EACZ,aAAa;EACb,mBAAmB;AACrB;;AAEA;EACE,YAAY;EACZ,kBAAkB;AACpB;;AAEA,iDAAiD;AACjD;EACE,aAAa;EACb,wCAAwC;AAC1C;;AAEA;EACE,qBAAqB;EACrB,gBAAgB;EAChB,gBAAgB;EAChB,uBAAuB;EACvB,mBAAmB;EACnB,sBAAsB;AACxB;;AAEA,qDAAqD;AACrD;EACE,aAAa;AACf;;AAEA;EACE,eAAe;AACjB;;AAEA,2CAA2C;AAC3C;;EAEE,uEAAuE;EACvE;IACE,WAAW;EACb;;EAEA;IACE,eAAe;EACjB;;EAEA;IACE,aAAa;EACf;AACF","sourcesContent":["/*\n * Copyright (c) Saga Inc.\n * Distributed under the terms of the GNU Affero General Public License v3.0 License.\n */\n\n/* ModelSelector.css - responsive design with compact mode */\n\n.model-selector {\n  position: relative;\n  flex: 0 0 auto;\n  margin: 0 8px;\n  height: 20px; /* Match height of other elements */\n  display: flex;\n  align-items: center; /* Center vertically */\n  color: var(--jp-ui-font-color2);\n}\n\n.model-selector:hover {\n  color: var(--jp-ui-font-color1);\n}\n\n.model-selector-dropdown {\n  position: relative;\n  height: 20px; /* Fixed height to match other elements */\n  border-radius: 4px;\n  cursor: pointer;\n  display: flex;\n  align-items: center; /* Ensure content is vertically centered */\n  width: min-content;\n  max-width: 18ch;\n}\n\n\n.selected-model {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  width: 100%;\n  height: 100%;\n  padding: 0 8px;\n  font-size: 12px;\n  font-weight: 500;\n  line-height: 1;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.model-icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 14px;\n  height: 14px;\n  line-height: 1;\n}\n\n.dropdown-arrow {\n  font-size: 8px;\n  transition: transform 0.2s;\n  margin-left: 4px;\n  flex-shrink: 0; /* Prevent arrow from shrinking */\n}\n\n/* Model options dropdown */\n.model-options {\n  position: absolute;\n  bottom: 100%;\n  max-height: 180px;\n  overflow-y: auto;\n  background-color: var(--jp-layout-color1);\n  border: 1px solid var(--jp-layout-color2);\n  border-radius: 4px;\n  margin-bottom: 4px;\n  box-shadow: 0 -2px 6px rgba(0, 0, 0, 0.1);\n  z-index: 1000;\n  width: auto;\n}\n\n.model-option {\n  padding: 4px 8px;\n  font-size: 12px;\n  /* Keep this size for readability */\n  color: var(--jp-content-font-color1);\n  cursor: pointer;\n  transition: background-color 0.2s;\n  white-space: nowrap;\n  /* Prevent text wrapping */\n}\n\n.model-option:hover {\n  background-color: var(--jp-layout-color2);\n  color: var(--purple-700);\n}\n\n.model-option.selected {\n  background-color: var(--jp-layout-color2);\n  color: var(--purple-700);\n}\n\n/* When inside chat-controls - ensure proper alignment with other controls */\n.chat-controls .model-selector {\n  height: 20px;\n  display: flex;\n  align-items: center;\n}\n\n.chat-controls .model-selector-dropdown {\n  height: 20px;\n  align-self: center;\n}\n\n/* Ensure dropdown appears above other elements */\n.model-options {\n  z-index: 1010;\n  /* Higher z-index to ensure visibility */\n}\n\n.model-name {\n  display: inline-block;\n  max-width: 120px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  vertical-align: bottom;\n}\n\n/* On wider screens, show only the name of the model*/\n.model-icon {\n  display: none;\n}\n\n.model-name {\n  display: inline;\n}\n\n/* On compact screens, show only the icon */\n@container (max-width: 300px) {\n\n  /* Shift the dropdown to the left to help prevent right-edge overflow */\n  .model-options {\n    left: -40px;\n  }\n\n  .model-icon {\n    display: inline;\n  }\n\n  .model-name {\n    display: none;\n  }\n}"],"sourceRoot":""}]);
+}`, "",{"version":3,"sources":["webpack://./style/ModelSelector.css"],"names":[],"mappings":"AAAA;;;EAGE;;AAEF,4DAA4D;;AAE5D;EACE,kBAAkB;EAClB,cAAc;EACd,aAAa;EACb,YAAY,EAAE,mCAAmC;EACjD,aAAa;EACb,mBAAmB,EAAE,sBAAsB;EAC3C,+BAA+B;AACjC;;AAEA;EACE,+BAA+B;AACjC;;AAEA;EACE,kBAAkB;EAClB,YAAY,EAAE,yCAAyC;EACvD,kBAAkB;EAClB,eAAe;EACf,aAAa;EACb,mBAAmB,EAAE,0CAA0C;EAC/D,kBAAkB;EAClB,eAAe;AACjB;;;AAGA;EACE,aAAa;EACb,mBAAmB;EACnB,8BAA8B;EAC9B,WAAW;EACX,YAAY;EACZ,cAAc;EACd,eAAe;EACf,gBAAgB;EAChB,cAAc;EACd,mBAAmB;EACnB,gBAAgB;EAChB,uBAAuB;AACzB;;AAEA;EACE,aAAa;EACb,mBAAmB;EACnB,uBAAuB;EACvB,WAAW;EACX,YAAY;EACZ,cAAc;AAChB;;AAEA;EACE,cAAc;EACd,0BAA0B;EAC1B,gBAAgB;EAChB,cAAc,EAAE,iCAAiC;AACnD;;AAEA,2BAA2B;AAC3B;EACE,kBAAkB;EAClB,YAAY;EACZ,iBAAiB;EACjB,gBAAgB;EAChB,yCAAyC;EACzC,yCAAyC;EACzC,kBAAkB;EAClB,kBAAkB;EAClB,yCAAyC;EACzC,aAAa;EACb,WAAW;AACb;;AAEA;EACE,gBAAgB;EAChB,eAAe;EACf,mCAAmC;EACnC,oCAAoC;EACpC,eAAe;EACf,iCAAiC;EACjC,mBAAmB;EACnB,0BAA0B;AAC5B;;AAEA;EACE,yCAAyC;EACzC,wBAAwB;AAC1B;;AAEA;EACE,yCAAyC;EACzC,wBAAwB;AAC1B;;AAEA,4EAA4E;AAC5E;EACE,YAAY;EACZ,aAAa;EACb,mBAAmB;AACrB;;AAEA;EACE,YAAY;EACZ,kBAAkB;AACpB;;AAEA,iDAAiD;AACjD;EACE,aAAa;EACb,wCAAwC;AAC1C;;AAEA;EACE,qBAAqB;EACrB,gBAAgB;EAChB,gBAAgB;EAChB,uBAAuB;EACvB,mBAAmB;EACnB,sBAAsB;AACxB;;AAEA,qDAAqD;AACrD;EACE,aAAa;AACf;;AAEA;EACE,eAAe;AACjB;;AAEA,2CAA2C;AAC3C;;EAEE,uEAAuE;EACvE;IACE,WAAW;EACb;;EAEA;IACE,eAAe;EACjB;;EAEA;IACE,aAAa;EACf;AACF","sourcesContent":["/*\n * Copyright (c) Saga Inc.\n * Distributed under the terms of the GNU Affero General Public License v3.0 License.\n */\n\n/* ModelSelector.css - responsive design with compact mode */\n\n.model-selector {\n  position: relative;\n  flex: 0 0 auto;\n  margin: 0 8px;\n  height: 20px; /* Match height of other elements */\n  display: flex;\n  align-items: center; /* Center vertically */\n  color: var(--jp-ui-font-color2);\n}\n\n.model-selector:hover {\n  color: var(--jp-ui-font-color1);\n}\n\n.model-selector-dropdown {\n  position: relative;\n  height: 20px; /* Fixed height to match other elements */\n  border-radius: 4px;\n  cursor: pointer;\n  display: flex;\n  align-items: center; /* Ensure content is vertically centered */\n  width: min-content;\n  max-width: 18ch;\n}\n\n\n.selected-model {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  width: 100%;\n  height: 100%;\n  padding: 0 8px;\n  font-size: 12px;\n  font-weight: 500;\n  line-height: 1;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.model-icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 14px;\n  height: 14px;\n  line-height: 1;\n}\n\n.dropdown-arrow {\n  font-size: 8px;\n  transition: transform 0.2s;\n  margin-left: 4px;\n  flex-shrink: 0; /* Prevent arrow from shrinking */\n}\n\n/* Model options dropdown */\n.model-options {\n  position: absolute;\n  bottom: 100%;\n  max-height: 180px;\n  overflow-y: auto;\n  background-color: var(--jp-layout-color1);\n  border: 1px solid var(--jp-layout-color2);\n  border-radius: 4px;\n  margin-bottom: 4px;\n  box-shadow: 0 -2px 6px rgba(0, 0, 0, 0.1);\n  z-index: 1000;\n  width: auto;\n}\n\n.model-option {\n  padding: 4px 8px;\n  font-size: 12px;\n  /* Keep this size for readability */\n  color: var(--jp-content-font-color1);\n  cursor: pointer;\n  transition: background-color 0.2s;\n  white-space: nowrap;\n  /* Prevent text wrapping */\n}\n\n.model-option:hover {\n  background-color: var(--jp-layout-color2);\n  color: var(--purple-700);\n}\n\n.model-option.selected {\n  background-color: var(--jp-layout-color2);\n  color: var(--purple-700);\n}\n\n/* When inside chat-controls - ensure proper alignment with other controls */\n.chat-controls .model-selector {\n  height: 20px;\n  display: flex;\n  align-items: center;\n}\n\n.chat-controls .model-selector-dropdown {\n  height: 20px;\n  align-self: center;\n}\n\n/* Ensure dropdown appears above other elements */\n.model-options {\n  z-index: 1010;\n  /* Higher z-index to ensure visibility */\n}\n\n.model-name {\n  display: inline-block;\n  max-width: 120px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  vertical-align: bottom;\n}\n\n/* On wider screens, show only the name of the model*/\n.model-icon {\n  display: none;\n}\n\n.model-name {\n  display: inline;\n}\n\n/* On compact screens, show only the icon */\n@container (max-width: 260px) {\n\n  /* Shift the dropdown to the left to help prevent right-edge overflow */\n  .model-options {\n    left: -40px;\n  }\n\n  .model-icon {\n    display: inline;\n  }\n\n  .model-name {\n    display: none;\n  }\n}"],"sourceRoot":""}]);
 // Exports
 /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
 
@@ -13146,7 +13478,8 @@ ___CSS_LOADER_EXPORT___.push([module.id, `/*
   justify-content: center;
   width: 12px;
   max-height: 14px;
-}`, "",{"version":3,"sources":["webpack://./style/SelectedContextContainer.css"],"names":[],"mappings":"AAAA;;;EAGE;;AAEF;EACE,aAAa;EACb,eAAe;EACf,mBAAmB;EACnB,QAAQ;EACR,iBAAiB;AACnB;;AAEA,6DAA6D;AAC7D;EACE,WAAW;AACb;;AAEA;EACE,aAAa;EACb,mBAAmB;EACnB,kBAAkB;EAClB,yCAAyC;EACzC,kBAAkB;EAClB,gBAAgB;EAChB,WAAW;;EAEX,eAAe;EACf,YAAY;EACZ,kBAAkB;;EAElB,yCAAyC;EACzC,eAAe;;EAEf;IACE,yCAAyC;EAC3C;AACF;;AAEA;EACE,gBAAgB;EAChB,oCAAoC;EACpC,mBAAmB;EACnB,gBAAgB;EAChB,uBAAuB;EACvB,gBAAgB;AAClB;;AAEA;EACE,aAAa;EACb,sBAAsB;EACtB,uBAAuB;EACvB,WAAW;EACX,gBAAgB;AAClB","sourcesContent":["/*\n * Copyright (c) Saga Inc.\n * Distributed under the terms of the GNU Affero General Public License v3.0 License.\n */\n\n.context-container {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: 4px;\n  padding: 8px 10px;\n}\n\n/* Consistent spacing for all children of context container */\n.context-container>* {\n  margin: 2px;\n}\n\n.selected-context-container {\n  display: flex;\n  align-items: center;\n  text-align: center;\n  background-color: var(--jp-layout-color2);\n  border-radius: 3px;\n  padding: 4px 8px;\n  margin: 2px;\n\n  font-size: 12px;\n  height: 20px;\n  width: fit-content;\n\n  border: 1px solid var(--jp-border-color1);\n  cursor: pointer;\n\n  &:hover {\n    background-color: var(--jp-layout-color3);\n  }\n}\n\n.selected-context-container .rule-name {\n  margin-left: 6px;\n  color: var(--jp-content-font-color1);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  max-width: 200px;\n}\n\n.selected-context-container .icon {\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  width: 12px;\n  max-height: 14px;\n}"],"sourceRoot":""}]);
+  color: var(--jp-content-font-color3);
+}`, "",{"version":3,"sources":["webpack://./style/SelectedContextContainer.css"],"names":[],"mappings":"AAAA;;;EAGE;;AAEF;EACE,aAAa;EACb,eAAe;EACf,mBAAmB;EACnB,QAAQ;EACR,iBAAiB;AACnB;;AAEA,6DAA6D;AAC7D;EACE,WAAW;AACb;;AAEA;EACE,aAAa;EACb,mBAAmB;EACnB,kBAAkB;EAClB,yCAAyC;EACzC,kBAAkB;EAClB,gBAAgB;EAChB,WAAW;;EAEX,eAAe;EACf,YAAY;EACZ,kBAAkB;;EAElB,yCAAyC;EACzC,eAAe;;EAEf;IACE,yCAAyC;EAC3C;AACF;;AAEA;EACE,gBAAgB;EAChB,oCAAoC;EACpC,mBAAmB;EACnB,gBAAgB;EAChB,uBAAuB;EACvB,gBAAgB;AAClB;;AAEA;EACE,aAAa;EACb,sBAAsB;EACtB,uBAAuB;EACvB,WAAW;EACX,gBAAgB;EAChB,oCAAoC;AACtC","sourcesContent":["/*\n * Copyright (c) Saga Inc.\n * Distributed under the terms of the GNU Affero General Public License v3.0 License.\n */\n\n.context-container {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: 4px;\n  padding: 8px 10px;\n}\n\n/* Consistent spacing for all children of context container */\n.context-container>* {\n  margin: 2px;\n}\n\n.selected-context-container {\n  display: flex;\n  align-items: center;\n  text-align: center;\n  background-color: var(--jp-layout-color2);\n  border-radius: 3px;\n  padding: 4px 8px;\n  margin: 2px;\n\n  font-size: 12px;\n  height: 20px;\n  width: fit-content;\n\n  border: 1px solid var(--jp-border-color1);\n  cursor: pointer;\n\n  &:hover {\n    background-color: var(--jp-layout-color3);\n  }\n}\n\n.selected-context-container .rule-name {\n  margin-left: 6px;\n  color: var(--jp-content-font-color1);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  max-width: 200px;\n}\n\n.selected-context-container .icon {\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  width: 12px;\n  max-height: 14px;\n  color: var(--jp-content-font-color3);\n}"],"sourceRoot":""}]);
 // Exports
 /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
 
@@ -13409,7 +13742,7 @@ ___CSS_LOADER_EXPORT___.push([module.id, `/*
   gap: 8px;
   min-width: 20px;
   font-size: 12px;
-  padding: 2px 10px;
+  padding: 2px 8px;
 }
 
 .toggle-button-half:first-child {
@@ -13436,7 +13769,7 @@ ___CSS_LOADER_EXPORT___.push([module.id, `/*
   width: 16px;
   height: 16px;
 }
-`, "",{"version":3,"sources":["webpack://./style/ToggleButton.css"],"names":[],"mappings":"AAAA;;;EAGE;;AAEF;EACE,aAAa;EACb,QAAQ;EACR,yCAAyC;EACzC,0CAA0C;EAC1C,kBAAkB;EAClB,YAAY;EACZ,gBAAgB;AAClB;;AAEA;EACE,aAAa;EACb,aAAa;EACb,mBAAmB;EACnB,uBAAuB;EACvB,QAAQ;EACR,eAAe;EACf,eAAe;EACf,iBAAiB;AACnB;;AAEA;EACE,kBAAkB;AACpB;;AAEA;EACE,kBAAkB;AACpB;;AAEA;EACE,UAAU;EACV,mCAAmC;EACnC,mCAAmC;AACrC;;AAEA;EACE,YAAY;EACZ,wCAAwC;EACxC,0CAA0C;AAC5C;;AAEA;EACE,WAAW;EACX,YAAY;AACd","sourcesContent":["/*\n * Copyright (c) Saga Inc.\n * Distributed under the terms of the GNU Affero General Public License v3.0 License.\n */\n\n.toggle-button-container {\n  display: flex;\n  gap: 1px;\n  background-color: var(--jp-layout-color2);\n  border: 1px solid var(--jp-ui-font-color3);\n  border-radius: 2px;\n  width: 100px;\n  overflow: hidden;\n}\n\n.toggle-button-half {\n  flex: 0 0 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 8px;\n  min-width: 20px;\n  font-size: 12px;\n  padding: 2px 10px;\n}\n\n.toggle-button-half:first-child {\n  border-radius: 0px;\n}\n\n.toggle-button-half:last-child {\n  border-radius: 0px;\n}\n\n.toggle-button-half.selected {\n  opacity: 1;\n  background-color: var(--purple-400);\n  color: var(--purple-700) !important;\n}\n\n.toggle-button-half.unselected {\n  opacity: 0.6;\n  background-color: transparent !important;\n  color: var(--jp-ui-font-color2) !important;\n}\n\n.toggle-button-icon {\n  width: 16px;\n  height: 16px;\n}\n"],"sourceRoot":""}]);
+`, "",{"version":3,"sources":["webpack://./style/ToggleButton.css"],"names":[],"mappings":"AAAA;;;EAGE;;AAEF;EACE,aAAa;EACb,QAAQ;EACR,yCAAyC;EACzC,0CAA0C;EAC1C,kBAAkB;EAClB,YAAY;EACZ,gBAAgB;AAClB;;AAEA;EACE,aAAa;EACb,aAAa;EACb,mBAAmB;EACnB,uBAAuB;EACvB,QAAQ;EACR,eAAe;EACf,eAAe;EACf,gBAAgB;AAClB;;AAEA;EACE,kBAAkB;AACpB;;AAEA;EACE,kBAAkB;AACpB;;AAEA;EACE,UAAU;EACV,mCAAmC;EACnC,mCAAmC;AACrC;;AAEA;EACE,YAAY;EACZ,wCAAwC;EACxC,0CAA0C;AAC5C;;AAEA;EACE,WAAW;EACX,YAAY;AACd","sourcesContent":["/*\n * Copyright (c) Saga Inc.\n * Distributed under the terms of the GNU Affero General Public License v3.0 License.\n */\n\n.toggle-button-container {\n  display: flex;\n  gap: 1px;\n  background-color: var(--jp-layout-color2);\n  border: 1px solid var(--jp-ui-font-color3);\n  border-radius: 2px;\n  width: 100px;\n  overflow: hidden;\n}\n\n.toggle-button-half {\n  flex: 0 0 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 8px;\n  min-width: 20px;\n  font-size: 12px;\n  padding: 2px 8px;\n}\n\n.toggle-button-half:first-child {\n  border-radius: 0px;\n}\n\n.toggle-button-half:last-child {\n  border-radius: 0px;\n}\n\n.toggle-button-half.selected {\n  opacity: 1;\n  background-color: var(--purple-400);\n  color: var(--purple-700) !important;\n}\n\n.toggle-button-half.unselected {\n  opacity: 0.6;\n  background-color: transparent !important;\n  color: var(--jp-ui-font-color2) !important;\n}\n\n.toggle-button-icon {\n  width: 16px;\n  height: 16px;\n}\n"],"sourceRoot":""}]);
 // Exports
 /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
 
@@ -15584,4 +15917,4 @@ var update = _node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js
 /***/ })
 
 }]);
-//# sourceMappingURL=lib_index_js.5d1d7c234e2dc7c9d97b.js.map
+//# sourceMappingURL=lib_index_js.55d9f8ca386d87856d2d.js.map