@trops/dash-core 0.1.54 → 0.1.55

package/dist/index.js

@@ -27660,42 +27660,46 @@ var ProvidersSection = function ProvidersSection(_ref) {
   var appContext = React.useContext(AppContext);
   var providers = (appContext === null || appContext === void 0 ? void 0 : appContext.providers) || {};
   var refreshProviders = appContext === null || appContext === void 0 ? void 0 : appContext.refreshProviders;
-  var _useState = React.useState(null),
+  var _useState = React.useState("credentials"),
     _useState2 = _slicedToArray(_useState, 2),
-    selectedName = _useState2[0],
-    setSelectedName = _useState2[1];
-  var _useState3 = React.useState(false),
+    providerTab = _useState2[0],
+    setProviderTab = _useState2[1];
+  var _useState3 = React.useState(null),
     _useState4 = _slicedToArray(_useState3, 2),
-    isCreating = _useState4[0],
-    setIsCreating = _useState4[1];
+    selectedName = _useState4[0],
+    setSelectedName = _useState4[1];
   var _useState5 = React.useState(false),
     _useState6 = _slicedToArray(_useState5, 2),
-    isEditing = _useState6[0],
-    setIsEditing = _useState6[1];
-  var _useState7 = React.useState(""),
+    isCreating = _useState6[0],
+    setIsCreating = _useState6[1];
+  var _useState7 = React.useState(false),
     _useState8 = _slicedToArray(_useState7, 2),
-    formName = _useState8[0],
-    setFormName = _useState8[1];
+    isEditing = _useState8[0],
+    setIsEditing = _useState8[1];
   var _useState9 = React.useState(""),
     _useState0 = _slicedToArray(_useState9, 2),
-    formType = _useState0[0],
-    setFormType = _useState0[1];
-  var _useState1 = React.useState({}),
+    formName = _useState0[0],
+    setFormName = _useState0[1];
+  var _useState1 = React.useState(""),
     _useState10 = _slicedToArray(_useState1, 2),
-    formCredentials = _useState10[0],
-    setFormCredentials = _useState10[1];
-  var _useState11 = React.useState(null),
+    formType = _useState10[0],
+    setFormType = _useState10[1];
+  var _useState11 = React.useState({}),
     _useState12 = _slicedToArray(_useState11, 2),
-    deleteTarget = _useState12[0],
-    setDeleteTarget = _useState12[1];
-  var _useState13 = React.useState(false),
+    formCredentials = _useState12[0],
+    setFormCredentials = _useState12[1];
+  var _useState13 = React.useState(null),
     _useState14 = _slicedToArray(_useState13, 2),
-    isAddingMcp = _useState14[0],
-    setIsAddingMcp = _useState14[1];
+    deleteTarget = _useState14[0],
+    setDeleteTarget = _useState14[1];
   var _useState15 = React.useState(false),
     _useState16 = _slicedToArray(_useState15, 2),
-    isEditingMcp = _useState16[0],
-    setIsEditingMcp = _useState16[1];
+    isAddingMcp = _useState16[0],
+    setIsAddingMcp = _useState16[1];
+  var _useState17 = React.useState(false),
+    _useState18 = _slicedToArray(_useState17, 2),
+    isEditingMcp = _useState18[0],
+    setIsEditingMcp = _useState18[1];
 
   // Row ID counter for env/header rows in MCP edit mode
   var nextRowIdRef = React.useRef(0);
@@ -27738,6 +27742,7 @@ var ProvidersSection = function ProvidersSection(_ref) {
       credentials: credentials
     }, function () {
       resetForm();
+      setProviderTab("credentials");
       refreshProviders && refreshProviders();
     }, function (e, err) {
       return (void 0);
@@ -27746,6 +27751,7 @@ var ProvidersSection = function ProvidersSection(_ref) {
   function handleStartEdit(name, provider) {
     setSelectedName(name);
     setIsCreating(false);
+    setProviderTab(provider.providerClass === "mcp" ? "mcp" : "credentials");
     if (provider.providerClass === "mcp") {
       setIsEditingMcp(true);
       setIsEditing(false);
@@ -27810,6 +27816,7 @@ var ProvidersSection = function ProvidersSection(_ref) {
       setIsAddingMcp(false);
       refreshProviders && refreshProviders();
       setSelectedName(providerName);
+      setProviderTab("mcp");
     }, function (e, err) {
       return (void 0);
     });
@@ -27831,6 +27838,7 @@ var ProvidersSection = function ProvidersSection(_ref) {
       mcpConfig: mcpConfig
     }, function () {
       setSelectedName(providerName);
+      setProviderTab("mcp");
       setIsEditingMcp(false);
       resetForm();
       refreshProviders && refreshProviders();
@@ -27855,19 +27863,39 @@ var ProvidersSection = function ProvidersSection(_ref) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [createRequested]);
   var selectedProvider = selectedName && providers[selectedName] ? providers[selectedName] : null;
-  var listContent = /*#__PURE__*/jsxRuntime.jsxs(DashReact.Sidebar.Content, {
-    children: [credentialProviders.length > 0 && /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
-      children: [/*#__PURE__*/jsxRuntime.jsx("div", {
-        className: "px-3 py-2 text-xs font-semibold opacity-40 uppercase tracking-wider",
-        children: "API Credentials"
-      }), credentialProviders.map(function (_ref8) {
+  var activeProviders = providerTab === "credentials" ? credentialProviders : mcpProviders;
+  var activeIcon = providerTab === "credentials" ? "key" : "server";
+  var listContent = /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/jsxRuntime.jsx("div", {
+      className: "px-2 pt-2",
+      children: /*#__PURE__*/jsxRuntime.jsx(DashReact.Tabs3, {
+        value: providerTab,
+        onValueChange: setProviderTab,
+        backgroundColor: "bg-transparent",
+        spacing: "p-0",
+        children: /*#__PURE__*/jsxRuntime.jsxs(DashReact.Tabs3.List, {
+          className: "w-full flex",
+          spacing: "p-0.5",
+          children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.Tabs3.Trigger, {
+            value: "credentials",
+            className: "flex-1",
+            children: "API Credentials"
+          }), /*#__PURE__*/jsxRuntime.jsx(DashReact.Tabs3.Trigger, {
+            value: "mcp",
+            className: "flex-1",
+            children: "MCP Servers"
+          })]
+        })
+      })
+    }), /*#__PURE__*/jsxRuntime.jsxs(DashReact.Sidebar.Content, {
+      children: [activeProviders.map(function (_ref8) {
         var _ref9 = _slicedToArray(_ref8, 2),
           name = _ref9[0],
           provider = _ref9[1];
         var isSelected = selectedName === name && !isCreating;
         return /*#__PURE__*/jsxRuntime.jsx(DashReact.Sidebar.Item, {
           icon: /*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
-            icon: "key",
+            icon: activeIcon,
             className: "h-3.5 w-3.5"
           }),
           active: isSelected,
@@ -27884,54 +27912,25 @@ var ProvidersSection = function ProvidersSection(_ref) {
           className: isSelected ? "bg-white/10 opacity-100" : "",
           children: name
         }, name);
-      })]
-    }), mcpProviders.length > 0 && /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
-      children: [/*#__PURE__*/jsxRuntime.jsx("div", {
-        className: "px-3 py-2 text-xs font-semibold opacity-40 uppercase tracking-wider mt-2",
-        children: "MCP Servers"
-      }), mcpProviders.map(function (_ref0) {
-        var _ref1 = _slicedToArray(_ref0, 2),
-          name = _ref1[0],
-          provider = _ref1[1];
-        var isSelected = selectedName === name && !isCreating;
-        return /*#__PURE__*/jsxRuntime.jsx(DashReact.Sidebar.Item, {
-          icon: /*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
-            icon: "server",
-            className: "h-3.5 w-3.5"
-          }),
-          active: isSelected,
+      }), activeProviders.length === 0 && /*#__PURE__*/jsxRuntime.jsx("span", {
+        className: "text-sm opacity-40 py-8 text-center",
+        children: providerTab === "credentials" ? "No API credentials configured" : "No MCP servers configured"
+      }), providerTab === "mcp" && /*#__PURE__*/jsxRuntime.jsx("div", {
+        className: "px-3 py-3 mt-2 border-t border-white/10",
+        children: /*#__PURE__*/jsxRuntime.jsxs("button", {
           onClick: function onClick() {
-            setSelectedName(name);
+            setIsAddingMcp(true);
+            setSelectedName(null);
             setIsCreating(false);
             setIsEditing(false);
-            setIsAddingMcp(false);
-            resetForm();
           },
-          badge: provider.type ? /*#__PURE__*/jsxRuntime.jsx(DashReact.Tag3, {
-            text: provider.type
-          }) : null,
-          className: isSelected ? "bg-white/10 opacity-100" : "",
-          children: name
-        }, name);
+          className: "flex items-center gap-2 text-sm text-blue-400 hover:text-blue-300 transition-colors w-full",
+          children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
+            icon: "plus",
+            className: "h-3 w-3"
+          }), "Add MCP Server"]
+        })
       })]
-    }), providerEntries.length === 0 && /*#__PURE__*/jsxRuntime.jsx("span", {
-      className: "text-sm opacity-40 py-8 text-center",
-      children: "No providers configured"
-    }), /*#__PURE__*/jsxRuntime.jsx("div", {
-      className: "px-3 py-3 mt-2 border-t border-white/10",
-      children: /*#__PURE__*/jsxRuntime.jsxs("button", {
-        onClick: function onClick() {
-          setIsAddingMcp(true);
-          setSelectedName(null);
-          setIsCreating(false);
-          setIsEditing(false);
-        },
-        className: "flex items-center gap-2 text-sm text-blue-400 hover:text-blue-300 transition-colors w-full",
-        children: [/*#__PURE__*/jsxRuntime.jsx(DashReact.FontAwesomeIcon, {
-          icon: "plus",
-          className: "h-3 w-3"
-        }), "Add MCP Server"]
-      })
     })]
   });
   var detailContent = null;