Merge branch 'master' of github.com:Mintplex-Labs/anything-llm into 3000-mcp-compatibility

Author: timothycarambat

frontend/src/pages/Admin/AgentBuilder/BlockList/index.jsx

@@ -225,7 +225,7 @@ export default function BlockList({
                             e.stopPropagation();
                             moveBlock(index, index - 1);
                           }}
-                          className="p-1.5 rounded-lg bg-theme-bg-primary border border-white/5 text-white hover:bg-theme-action-menu-item-hover transition-colors duration-300"
+                          className="w-7 h-7 flex items-center justify-center rounded-lg bg-theme-bg-primary border border-white/5 text-white hover:bg-theme-action-menu-item-hover transition-colors duration-300"
                           data-tooltip-id="block-action"
                           data-tooltip-content="Move block up"
                         >
@@ -238,7 +238,7 @@ export default function BlockList({
                             e.stopPropagation();
                             moveBlock(index, index + 1);
                           }}
-                          className="p-1.5 rounded-lg bg-theme-bg-primary border border-white/5 text-white hover:bg-theme-action-menu-item-hover transition-colors duration-300"
+                          className="w-7 h-7 flex items-center justify-center rounded-lg bg-theme-bg-primary border border-white/5 text-white hover:bg-theme-action-menu-item-hover transition-colors duration-300"
                           data-tooltip-id="block-action"
                           data-tooltip-content="Move block down"
                         >
@@ -250,7 +250,7 @@ export default function BlockList({
                           e.stopPropagation();
                           removeBlock(block.id);
                         }}
-                        className="p-1.5 rounded-lg bg-theme-bg-primary border border-white/5 text-red-400 hover:bg-red-500/10 hover:border-red-500/20 transition-colors duration-300"
+                        className="w-7 h-7 flex items-center justify-center rounded-lg bg-theme-bg-primary border border-white/5 text-red-400 hover:bg-red-500/10 hover:border-red-500/20 transition-colors duration-300"
                         data-tooltip-id="block-action"
                         data-tooltip-content="Delete block"
                       >

frontend/src/pages/Admin/AgentBuilder/HeaderMenu/index.jsx

@@ -1,4 +1,4 @@
-import { CaretDown, CaretUp, Plus } from "@phosphor-icons/react";
+import { CaretDown, CaretUp, Plus, CaretLeft } from "@phosphor-icons/react";
 import AnythingInfinityLogo from "@/media/logo/anything-llm-infinity.png";
 import { useState, useRef, useEffect } from "react";
 import { useNavigate, useParams } from "react-router-dom";
@@ -32,72 +32,83 @@ export default function HeaderMenu({
   }, []);
 
   return (
-    <div className="absolute top-4 left-4 right-4">
-      <div className="flex justify-between items-center max-w-[1700px] mx-auto">
-        <div
-          className="flex items-center bg-theme-settings-input-bg rounded-md border border-white/10 pointer-events-auto"
-          ref={dropdownRef}
-        >
+    <div className="absolute top-[calc(40px+16px)] left-4 right-4">
+      <div className="flex justify-between items-start max-w-[1700px] mx-auto">
+        <div className="flex items-center gap-x-2">
           <button
             onClick={() => navigate(paths.settings.agentSkills())}
-            className="border-y-none border-l-none flex items-center gap-x-2 px-4 py-2 border-r border-white/10 hover:bg-theme-action-menu-bg transition-colors duration-300"
+            className="w-8 h-8 flex items-center justify-center rounded-full bg-theme-settings-input-bg border border-white/10 hover:bg-theme-action-menu-bg transition-colors duration-300"
           >
-            <img
-              src={AnythingInfinityLogo}
-              alt="logo"
-              className="w-[20px] light:invert"
+            <CaretLeft
+              weight="bold"
+              className="w-5 h-5 text-theme-text-primary"
             />
-            <span className="text-theme-text-primary text-sm uppercase tracking-widest">
-              Builder
-            </span>
           </button>
-          <div className="relative">
+          <div
+            className="flex items-center bg-theme-settings-input-bg rounded-md border border-white/10 pointer-events-auto"
+            ref={dropdownRef}
+          >
             <button
-              disabled={!hasOtherFlows}
-              className="border-none flex items-center justify-between gap-x-1 text-theme-text-primary text-sm px-4 py-2 enabled:hover:bg-theme-action-menu-bg transition-colors duration-300 min-w-[200px] max-w-[300px]"
-              onClick={() => {
-                if (!agentName && !hasOtherFlows) {
-                  const agentNameInput = document.getElementById(
-                    "agent-flow-name-input"
-                  );
-                  if (agentNameInput) agentNameInput.focus();
-                  return;
-                }
-                setShowDropdown(!showDropdown);
-              }}
+              onClick={() => navigate(paths.settings.agentSkills())}
+              className="!border-t-transparent !border-l-transparent !border-b-transparent flex items-center gap-x-2 px-4 py-2 border-r border-white/10 hover:bg-theme-action-menu-bg transition-colors duration-300"
             >
-              <span
-                className={`text-sm font-medium truncate ${!!agentName ? "text-theme-text-primary " : "text-theme-text-secondary"}`}
-              >
-                {agentName || "Untitled Flow"}
+              <img
+                src={AnythingInfinityLogo}
+                alt="logo"
+                className="w-[20px] light:invert"
+              />
+              <span className="text-theme-text-primary text-sm uppercase tracking-widest">
+                Builder
               </span>
-              {hasOtherFlows && (
-                <div className="flex flex-col ml-2 shrink-0">
-                  <CaretUp size={10} />
-                  <CaretDown size={10} />
+            </button>
+            <div className="relative">
+              <button
+                disabled={!hasOtherFlows}
+                className="border-none flex items-center justify-between gap-x-1 text-theme-text-primary text-sm px-4 py-2 enabled:hover:bg-theme-action-menu-bg transition-colors duration-300 min-w-[200px] max-w-[300px]"
+                onClick={() => {
+                  if (!agentName && !hasOtherFlows) {
+                    const agentNameInput = document.getElementById(
+                      "agent-flow-name-input"
+                    );
+                    if (agentNameInput) agentNameInput.focus();
+                    return;
+                  }
+                  setShowDropdown(!showDropdown);
+                }}
+              >
+                <span
+                  className={`text-sm font-medium truncate ${!!agentName ? "text-theme-text-primary " : "text-theme-text-secondary"}`}
+                >
+                  {agentName || "Untitled Flow"}
+                </span>
+                {hasOtherFlows && (
+                  <div className="flex flex-col ml-2 shrink-0">
+                    <CaretUp size={10} />
+                    <CaretDown size={10} />
+                  </div>
+                )}
+              </button>
+              {showDropdown && (
+                <div className="absolute top-full left-0 mt-1 w-full min-w-[200px] max-w-[350px] bg-theme-settings-input-bg border border-white/10 rounded-md shadow-lg z-50 animate-fadeUpIn">
+                  {availableFlows
+                    .filter((flow) => flow.uuid !== flowId)
+                    .map((flow) => (
+                      <button
+                        key={flow?.uuid || Math.random()}
+                        onClick={() => {
+                          navigate(paths.agents.editAgent(flow.uuid));
+                          setShowDropdown(false);
+                        }}
+                        className="border-none w-full text-left px-2 py-1 text-sm text-theme-text-primary hover:bg-theme-action-menu-bg transition-colors duration-300"
+                      >
+                        <span className="block truncate">
+                          {flow?.name || "Untitled Flow"}
+                        </span>
+                      </button>
+                    ))}
                 </div>
               )}
-            </button>
-            {showDropdown && (
-              <div className="absolute top-full left-0 mt-1 w-full min-w-[200px] max-w-[350px] bg-theme-settings-input-bg border border-white/10 rounded-md shadow-lg z-50 animate-fadeUpIn">
-                {availableFlows
-                  .filter((flow) => flow.uuid !== flowId)
-                  .map((flow) => (
-                    <button
-                      key={flow?.uuid || Math.random()}
-                      onClick={() => {
-                        navigate(paths.agents.editAgent(flow.uuid));
-                        setShowDropdown(false);
-                      }}
-                      className="border-none w-full text-left px-2 py-1 text-sm text-theme-text-primary hover:bg-theme-action-menu-bg transition-colors duration-300"
-                    >
-                      <span className="block truncate">
-                        {flow?.name || "Untitled Flow"}
-                      </span>
-                    </button>
-                  ))}
-              </div>
-            )}
+            </div>
           </div>
         </div>
 
@@ -112,7 +123,7 @@ export default function HeaderMenu({
             </button>
             <button
               onClick={onSaveFlow}
-              className="border-none bg-primary-button hover:opacity-80 text-black px-3 py-2 rounded-lg text-sm font-medium transition-all duration-300 flex items-center justify-center gap-2"
+              className="border-none bg-primary-button hover:opacity-80 text-black light:text-white px-3 py-2 rounded-lg text-sm font-medium transition-all duration-300 flex items-center justify-center gap-2"
             >
               Save
             </button>

frontend/src/pages/Admin/ExperimentalFeatures/index.jsx

@@ -264,13 +264,13 @@ function FeatureVerification({ children }) {
               <div className="flex w-full justify-between items-center p-6 space-x-2 border-t border-theme-modal-border rounded-b">
                 <a
                   href={paths.home()}
-                  className="px-4 py-2 rounded-lg text-theme-text-primary hover:bg-red-500/50 light:hover:bg-red-300/50 transition-all duration-300"
+                  className="transition-all duration-300 bg-transparent text-white hover:bg-red-500/50 light:hover:bg-red-300/50 px-4 py-2 rounded-lg text-sm border border-theme-modal-border"
                 >
                   Reject & close
                 </a>
                 <button
                   type="submit"
-                  className="transition-all duration-300 text-theme-text-primary hover:bg-blue-300/50 light:hover:bg-blue-300 px-4 py-2 rounded-lg text-sm"
+                  className="transition-all duration-300 bg-white text-black hover:opacity-60 px-4 py-2 rounded-lg text-sm border border-theme-modal-border"
                 >
                   I understand
                 </button>

frontend/src/pages/OnboardingFlow/Steps/Survey/index.jsx

@@ -261,7 +261,7 @@ export default function Survey({ setHeader, setForwardBtn, setBackBtn }) {
           <button
             type="button"
             onClick={skipSurvey}
-            className="text-white text-base font-medium text-opacity-30 hover:text-opacity-100 mt-8"
+            className="text-white text-base font-medium text-opacity-30 hover:text-opacity-100 hover:text-teal mt-8"
           >
             {t("onboarding.survey.skip")}
           </button>

frontend/src/pages/OnboardingFlow/Steps/index.jsx

@@ -74,10 +74,10 @@ export function OnboardingLayout({ children }) {
                 <button
                   disabled={forwardBtn.disabled}
                   onClick={forwardBtn.onClick}
-                  className="group p-2 rounded-lg border-2 border-zinc-300 disabled:border-zinc-600 h-fit w-fit disabled:not-allowed hover:bg-zinc-100 disabled:hover:bg-transparent"
+                  className="group p-2 rounded-lg border-2 border-zinc-300 disabled:border-zinc-600 h-fit w-fit disabled:not-allowed hover:bg-teal disabled:hover:bg-transparent"
                 >
                   <ArrowRight
-                    className="text-white group-hover:text-black group-disabled:text-gray-500"
+                    className="text-white group-hover:text-teal group-disabled:text-gray-500"
                     size={30}
                   />
                 </button>
@@ -127,11 +127,11 @@ export function OnboardingLayout({ children }) {
           <button
             disabled={forwardBtn.disabled}
             onClick={forwardBtn.onClick}
-            className="group p-2 rounded-lg border-2 border-theme-sidebar-border h-fit w-fit disabled:cursor-not-allowed hover:bg-theme-bg-secondary disabled:hover:bg-transparent"
+            className="group p-2 rounded-lg border-2 border-theme-sidebar-border h-fit w-fit disabled:cursor-not-allowed hover:bg-teal disabled:hover:bg-transparent"
             aria-label="Continue"
           >
             <ArrowRight
-              className="text-theme-text-secondary group-hover:text-theme-text-primary group-disabled:text-gray-500"
+              className="text-theme-text-secondary group-hover:text-white group-disabled:text-gray-500"
               size={30}
             />
           </button>

frontend/tailwind.config.js

@@ -45,6 +45,7 @@ export default {
         warn: "#854708",
         success: "#05603A",
         darker: "#F4F4F4",
+        teal: "#0BA5EC",
 
         // Generic theme colors
         theme: {

server/utils/agents/aibitat/plugins/sql-agent/SQLConnectors/MSSQL.js

@@ -1,5 +1,5 @@
 const mssql = require("mssql");
-const UrlPattern = require("url-pattern");
+const { ConnectionStringParser } = require("./utils");
 
 class MSSQLConnector {
   #connected = false;
@@ -34,18 +34,17 @@ class MSSQLConnector {
   }
 
   #parseDatabase() {
-    const connectionPattern = new UrlPattern(
-      "mssql\\://:username\\::password@*\\::port/:database*"
-    );
-    const match = connectionPattern.match(this.connectionString);
-    this.database_id = match?.database;
+    const connectionParser = new ConnectionStringParser({ scheme: "mssql" });
+    const parsed = connectionParser.parse(this.connectionString);
+
+    this.database_id = parsed?.endpoint;
     this.connectionConfig = {
       ...this.connectionConfig,
-      user: match?.username,
-      password: match?.password,
-      database: match?.database,
-      server: match?._[0],
-      port: match?.port ? Number(match.port) : null,
+      user: parsed?.username,
+      password: parsed?.password,
+      database: parsed?.endpoint,
+      server: parsed?.hosts[0]?.host,
+      port: parsed?.hosts[0]?.port,
     };
   }
 

server/utils/agents/aibitat/plugins/sql-agent/SQLConnectors/MySQL.js

@@ -1,5 +1,5 @@
 const mysql = require("mysql2/promise");
-const UrlPattern = require("url-pattern");
+const { ConnectionStringParser } = require("./utils");
 
 class MySQLConnector {
   #connected = false;
@@ -15,9 +15,9 @@ class MySQLConnector {
   }
 
   #parseDatabase() {
-    const connectionPattern = new UrlPattern("mysql\\://*@*/:database*");
-    const match = connectionPattern.match(this.connectionString);
-    return match?.database;
+    const connectionParser = new ConnectionStringParser({ scheme: "mysql" });
+    const parsed = connectionParser.parse(this.connectionString);
+    return parsed?.endpoint;
   }
 
   async connect() {