@trops/dash-core 0.1.637 → 0.1.639

package/dist/index.esm.js

@@ -47421,6 +47421,12 @@ function prettyServer(name) {
     return w.charAt(0).toUpperCase() + w.slice(1);
   }).join(" ");
 }
+
+// "search_emails" / "list-calendars" → "Search emails" / "List calendars".
+function prettyTool(name) {
+  var words = String(name || "").split(/[-_\s]+/).filter(Boolean).join(" ");
+  return words.charAt(0).toUpperCase() + words.slice(1);
+}
 function getMainApi() {
   return typeof window !== "undefined" ? window.mainApi : null;
 }
@@ -47460,77 +47466,143 @@ var BotDetail = function BotDetail(_ref) {
     approvalPolicy = _useState10[0],
     setApprovalPolicy = _useState10[1];
 
-  // --- Tools & integrations (MCP servers) ---
+  // --- Providers: the user's Dash MCP providers (Settings → Providers) ---
   var _useState11 = useState((bot === null || bot === void 0 ? void 0 : bot.mcpServers) || []),
     _useState12 = _slicedToArray(_useState11, 2),
     selectedServers = _useState12[0],
     setSelectedServers = _useState12[1];
-  var _useState13 = useState([]),
+  // Per-provider narrowing within the provider's declared tools:
+  // { [providerName]: string[] }. No entry → every tool the provider allows.
+  var _useState13 = useState((bot === null || bot === void 0 ? void 0 : bot.toolSelections) || {}),
     _useState14 = _slicedToArray(_useState13, 2),
-    connectedServers = _useState14[0],
-    setConnectedServers = _useState14[1];
-
-  // --- Model options (fetched per provider) ---
+    toolSelections = _useState14[0],
+    setToolSelections = _useState14[1];
   var _useState15 = useState([]),
     _useState16 = _slicedToArray(_useState15, 2),
-    modelOptions = _useState16[0],
-    setModelOptions = _useState16[1];
+    toolSources = _useState16[0],
+    setToolSources = _useState16[1];
+  var _useState17 = useState(false),
+    _useState18 = _slicedToArray(_useState17, 2),
+    sourcesLoaded = _useState18[0],
+    setSourcesLoaded = _useState18[1];
+  // Remembered approvals ("Always allow") for a saved bot:
+  // { [provider]: { tools: string[], folders: string[] } }.
+  var _useState19 = useState({}),
+    _useState20 = _slicedToArray(_useState19, 2),
+    grants = _useState20[0],
+    setGrants = _useState20[1];
+  useEffect(function () {
+    var _api$bots;
+    var alive = true;
+    var api = getMainApi();
+    if (!(bot !== null && bot !== void 0 && bot.id) || !(api !== null && api !== void 0 && (_api$bots = api.bots) !== null && _api$bots !== void 0 && _api$bots.getGrants)) return undefined;
+    Promise.resolve(api.bots.getGrants(bot.id)).then(function (g) {
+      if (alive && g && _typeof(g) === "object") setGrants(g);
+    })["catch"](function () {});
+    return function () {
+      alive = false;
+    };
+  }, [bot === null || bot === void 0 ? void 0 : bot.id]);
+  var isRemembered = function isRemembered(serverName, tool) {
+    return !!(grants[serverName] && (grants[serverName].tools || []).includes(tool));
+  };
+  var revokeRemembered = /*#__PURE__*/function () {
+    var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(serverName, tool) {
+      var _api$bots2;
+      var api, next;
+      return _regeneratorRuntime.wrap(function (_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            api = getMainApi();
+            if (!(!(bot !== null && bot !== void 0 && bot.id) || !(api !== null && api !== void 0 && (_api$bots2 = api.bots) !== null && _api$bots2 !== void 0 && _api$bots2.revokeGrant))) {
+              _context.next = 1;
+              break;
+            }
+            return _context.abrupt("return");
+          case 1:
+            _context.prev = 1;
+            _context.next = 2;
+            return api.bots.revokeGrant(bot.id, serverName, tool);
+          case 2:
+            next = _context.sent;
+            setGrants(next && _typeof(next) === "object" ? next : {});
+            _context.next = 4;
+            break;
+          case 3:
+            _context.prev = 3;
+            _context["catch"](1);
+          case 4:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee, null, [[1, 3]]);
+    }));
+    return function revokeRemembered(_x, _x2) {
+      return _ref2.apply(this, arguments);
+    };
+  }();
+
+  // --- Model options (fetched per provider) ---
+  var _useState21 = useState([]),
+    _useState22 = _slicedToArray(_useState21, 2),
+    modelOptions = _useState22[0],
+    setModelOptions = _useState22[1];
 
   // --- Schedule (friendly dropdowns; raw cron behind Advanced) ---
   var initialCron = (bot === null || bot === void 0 || (_bot$schedules = bot.schedules) === null || _bot$schedules === void 0 || (_bot$schedules = _bot$schedules[0]) === null || _bot$schedules === void 0 ? void 0 : _bot$schedules.cron) || "";
   var parsed = parseCron(initialCron);
-  var _useState17 = useState(parsed.frequency === "custom" ? "off" : parsed.frequency),
-    _useState18 = _slicedToArray(_useState17, 2),
-    frequency = _useState18[0],
-    setFrequency = _useState18[1];
-  var _useState19 = useState(parsed.time || DEFAULT_SCHEDULE.time),
-    _useState20 = _slicedToArray(_useState19, 2),
-    time = _useState20[0],
-    setTime = _useState20[1];
-  var _useState21 = useState(parsed.dayOfWeek || DEFAULT_SCHEDULE.dayOfWeek),
-    _useState22 = _slicedToArray(_useState21, 2),
-    dayOfWeek = _useState22[0],
-    setDayOfWeek = _useState22[1];
-  var _useState23 = useState(parsed.dayOfMonth || DEFAULT_SCHEDULE.dayOfMonth),
+  var _useState23 = useState(parsed.frequency === "custom" ? "off" : parsed.frequency),
     _useState24 = _slicedToArray(_useState23, 2),
-    dayOfMonth = _useState24[0],
-    setDayOfMonth = _useState24[1];
-  var _useState25 = useState(parsed.frequency === "custom"),
+    frequency = _useState24[0],
+    setFrequency = _useState24[1];
+  var _useState25 = useState(parsed.time || DEFAULT_SCHEDULE.time),
     _useState26 = _slicedToArray(_useState25, 2),
-    advanced = _useState26[0],
-    setAdvanced = _useState26[1];
-  var _useState27 = useState(initialCron),
+    time = _useState26[0],
+    setTime = _useState26[1];
+  var _useState27 = useState(parsed.dayOfWeek || DEFAULT_SCHEDULE.dayOfWeek),
     _useState28 = _slicedToArray(_useState27, 2),
-    advancedCron = _useState28[0],
-    setAdvancedCron = _useState28[1];
-  var _useState29 = useState((bot === null || bot === void 0 || (_bot$schedules2 = bot.schedules) === null || _bot$schedules2 === void 0 || (_bot$schedules2 = _bot$schedules2[0]) === null || _bot$schedules2 === void 0 ? void 0 : _bot$schedules2.prompt) || ""),
+    dayOfWeek = _useState28[0],
+    setDayOfWeek = _useState28[1];
+  var _useState29 = useState(parsed.dayOfMonth || DEFAULT_SCHEDULE.dayOfMonth),
     _useState30 = _slicedToArray(_useState29, 2),
-    schedulePrompt = _useState30[0],
-    setSchedulePrompt = _useState30[1];
+    dayOfMonth = _useState30[0],
+    setDayOfMonth = _useState30[1];
+  var _useState31 = useState(parsed.frequency === "custom"),
+    _useState32 = _slicedToArray(_useState31, 2),
+    advanced = _useState32[0],
+    setAdvanced = _useState32[1];
+  var _useState33 = useState(initialCron),
+    _useState34 = _slicedToArray(_useState33, 2),
+    advancedCron = _useState34[0],
+    setAdvancedCron = _useState34[1];
+  var _useState35 = useState((bot === null || bot === void 0 || (_bot$schedules2 = bot.schedules) === null || _bot$schedules2 === void 0 || (_bot$schedules2 = _bot$schedules2[0]) === null || _bot$schedules2 === void 0 ? void 0 : _bot$schedules2.prompt) || ""),
+    _useState36 = _slicedToArray(_useState35, 2),
+    schedulePrompt = _useState36[0],
+    setSchedulePrompt = _useState36[1];
 
   // --- Run-on-events (subscriptions) ---
-  var _useState31 = useState(((bot === null || bot === void 0 ? void 0 : bot.subscriptions) || []).map(function (s) {
+  var _useState37 = useState(((bot === null || bot === void 0 ? void 0 : bot.subscriptions) || []).map(function (s) {
       return s && s.eventType;
     }).filter(Boolean)),
-    _useState32 = _slicedToArray(_useState31, 2),
-    subscriptions = _useState32[0],
-    setSubscriptions = _useState32[1];
-  var _useState33 = useState(""),
-    _useState34 = _slicedToArray(_useState33, 2),
-    newEvent = _useState34[0],
-    setNewEvent = _useState34[1];
-  var _useState35 = useState([]),
-    _useState36 = _slicedToArray(_useState35, 2),
-    knownEvents = _useState36[0],
-    setKnownEvents = _useState36[1];
-  var _useState37 = useState(false),
     _useState38 = _slicedToArray(_useState37, 2),
-    saving = _useState38[0],
-    setSaving = _useState38[1];
-  var _useState39 = useState(null),
+    subscriptions = _useState38[0],
+    setSubscriptions = _useState38[1];
+  var _useState39 = useState(""),
     _useState40 = _slicedToArray(_useState39, 2),
-    error = _useState40[0],
-    setError = _useState40[1];
+    newEvent = _useState40[0],
+    setNewEvent = _useState40[1];
+  var _useState41 = useState([]),
+    _useState42 = _slicedToArray(_useState41, 2),
+    knownEvents = _useState42[0],
+    setKnownEvents = _useState42[1];
+  var _useState43 = useState(false),
+    _useState44 = _slicedToArray(_useState43, 2),
+    saving = _useState44[0],
+    setSaving = _useState44[1];
+  var _useState45 = useState(null),
+    _useState46 = _slicedToArray(_useState45, 2),
+    error = _useState46[0],
+    setError = _useState46[1];
 
   // Discover recently-seen widget event types to suggest as subscriptions.
   useEffect(function () {
@@ -47546,29 +47618,32 @@ var BotDetail = function BotDetail(_ref) {
     };
   }, []);
 
-  // Discover the user's connected integrations for the picker.
+  // Discover the user's configured MCP providers — running or not. The bot
+  // starts any that aren't running when it runs.
   useEffect(function () {
-    var _api$llm;
+    var _api$bots3;
     var alive = true;
     var api = getMainApi();
-    if (!(api !== null && api !== void 0 && (_api$llm = api.llm) !== null && _api$llm !== void 0 && _api$llm.listConnectedTools)) return undefined;
-    api.llm.listConnectedTools().then(function (servers) {
-      if (!alive || !Array.isArray(servers)) return;
-      setConnectedServers(servers.map(function (s) {
-        return s.serverName;
-      }).filter(Boolean));
-    })["catch"](function () {});
+    if (!(api !== null && api !== void 0 && (_api$bots3 = api.bots) !== null && _api$bots3 !== void 0 && _api$bots3.listToolSources)) {
+      setSourcesLoaded(true);
+      return undefined;
+    }
+    Promise.resolve(api.bots.listToolSources((bot === null || bot === void 0 ? void 0 : bot.workspaceId) || null)).then(function (sources) {
+      if (alive && Array.isArray(sources)) setToolSources(sources);
+    })["catch"](function () {})["finally"](function () {
+      if (alive) setSourcesLoaded(true);
+    });
     return function () {
       alive = false;
     };
-  }, []);
+  }, [bot === null || bot === void 0 ? void 0 : bot.workspaceId]);
 
   // Fetch the model list for the chosen provider.
   useEffect(function () {
-    var _api$llm2;
+    var _api$llm;
     var alive = true;
     var api = getMainApi();
-    if (!(api !== null && api !== void 0 && (_api$llm2 = api.llm) !== null && _api$llm2 !== void 0 && _api$llm2.listModels)) {
+    if (!(api !== null && api !== void 0 && (_api$llm = api.llm) !== null && _api$llm !== void 0 && _api$llm.listModels)) {
       setModelOptions([]);
       return undefined;
     }
@@ -47582,12 +47657,32 @@ var BotDetail = function BotDetail(_ref) {
     };
   }, [provider]);
 
-  // Union of connected servers + any the bot already has (so an attached server
-  // that isn't currently connected still shows, checked, and isn't dropped).
-  var availableServers = _toConsumableArray(new Set([].concat(_toConsumableArray(selectedServers || []), _toConsumableArray(connectedServers)))).map(function (serverName) {
+  // Configured providers + any the bot already has (so a provider that was
+  // since removed still shows, checked, and isn't silently dropped on save).
+  var availableServers = [].concat(_toConsumableArray(toolSources.map(function (s) {
+    return _objectSpread$t(_objectSpread$t({}, s), {}, {
+      missing: false
+    });
+  })), _toConsumableArray((selectedServers || []).filter(function (name) {
+    return !toolSources.some(function (s) {
+      return s.name === name;
+    });
+  }).map(function (name) {
     return {
-      serverName: serverName,
-      label: prettyServer(serverName)
+      name: name,
+      running: false,
+      toolCount: null,
+      missing: true
+    };
+  }))).map(function (s) {
+    var _s$toolCount;
+    return {
+      serverName: s.name,
+      label: prettyServer(s.name),
+      // The provider's declared tools (or live tools if undeclared + running);
+      // null → every tool, list not known yet.
+      tools: Array.isArray(s.tools) ? s.tools : null,
+      status: s.missing ? "No longer set up under Settings → Providers" : s.running ? "Running \xB7 ".concat((_s$toolCount = s.toolCount) !== null && _s$toolCount !== void 0 ? _s$toolCount : 0, " tools") : "Starts when the bot runs"
     };
   });
   var modelSelectOptions = [{
@@ -47606,6 +47701,35 @@ var BotDetail = function BotDetail(_ref) {
       }) : [].concat(_toConsumableArray(prev), [serverName]);
     });
   };
+
+  // Is `tool` allowed for this bot on `serverName`? No stored selection → yes.
+  var isToolOn = function isToolOn(serverName, tool) {
+    var sel = toolSelections[serverName];
+    return Array.isArray(sel) ? sel.includes(tool) : true;
+  };
+
+  // Toggle one tool. Selecting every tool again clears the entry (= all), so
+  // a later provider-side addition is picked up automatically.
+  var toggleTool = function toggleTool(serverName, allTools, tool) {
+    setToolSelections(function (prev) {
+      var current = Array.isArray(prev[serverName]) ? prev[serverName] : _toConsumableArray(allTools);
+      var next = current.includes(tool) ? current.filter(function (t) {
+        return t !== tool;
+      }) : allTools.filter(function (t) {
+        return t === tool || current.includes(t);
+      });
+      var copy = _objectSpread$t({}, prev);
+      if (next.length === allTools.length) delete copy[serverName];else copy[serverName] = next;
+      return copy;
+    });
+  };
+  var setAllTools = function setAllTools(serverName, on) {
+    setToolSelections(function (prev) {
+      var copy = _objectSpread$t({}, prev);
+      if (on) delete copy[serverName];else copy[serverName] = [];
+      return copy;
+    });
+  };
   var addSubscription = function addSubscription(eventType) {
     var ev = (eventType || "").trim();
     if (!ev) return;
@@ -47628,10 +47752,10 @@ var BotDetail = function BotDetail(_ref) {
   });
   var canSave = name.trim() && instructions.trim() && !saving;
   var handleSave = /*#__PURE__*/function () {
-    var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
-      var cron, schedules, definition, _t;
-      return _regeneratorRuntime.wrap(function (_context) {
-        while (1) switch (_context.prev = _context.next) {
+    var _ref3 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
+      var cron, schedules, definition, _t2;
+      return _regeneratorRuntime.wrap(function (_context2) {
+        while (1) switch (_context2.prev = _context2.next) {
           case 0:
             setError(null);
             cron = advanced ? advancedCron.trim() : buildCron({
@@ -47654,6 +47778,12 @@ var BotDetail = function BotDetail(_ref) {
               engine: engine || null,
               approvalPolicy: approvalPolicy,
               mcpServers: selectedServers,
+              // Only keep narrowing for providers the bot still uses.
+              toolSelections: Object.fromEntries(Object.entries(toolSelections).filter(function (_ref4) {
+                var _ref5 = _slicedToArray(_ref4, 1),
+                  server = _ref5[0];
+                return selectedServers.includes(server);
+              })),
               schedules: schedules,
               subscriptions: subscriptions.map(function (eventType) {
                 return {
@@ -47662,28 +47792,28 @@ var BotDetail = function BotDetail(_ref) {
               })
             });
             setSaving(true);
-            _context.prev = 1;
-            _context.next = 2;
+            _context2.prev = 1;
+            _context2.next = 2;
             return onSave(definition);
           case 2:
-            _context.next = 4;
+            _context2.next = 4;
             break;
           case 3:
-            _context.prev = 3;
-            _t = _context["catch"](1);
-            setError(_t && _t.message || "Failed to save bot");
+            _context2.prev = 3;
+            _t2 = _context2["catch"](1);
+            setError(_t2 && _t2.message || "Failed to save bot");
           case 4:
-            _context.prev = 4;
+            _context2.prev = 4;
             setSaving(false);
-            return _context.finish(4);
+            return _context2.finish(4);
           case 5:
           case "end":
-            return _context.stop();
+            return _context2.stop();
         }
-      }, _callee, null, [[1, 3, 4, 5]]);
+      }, _callee2, null, [[1, 3, 4, 5]]);
     }));
     return function handleSave() {
-      return _ref2.apply(this, arguments);
+      return _ref3.apply(this, arguments);
     };
   }();
   var scheduleOn = advanced || frequency !== "off";
@@ -47712,57 +47842,132 @@ var BotDetail = function BotDetail(_ref) {
           placeholder: "What should this bot do?",
           rows: 5
         })]
-      }), /*#__PURE__*/jsxs("div", {
-        className: "flex flex-col gap-1",
-        children: [/*#__PURE__*/jsx(SelectInput, {
-          label: "Provider",
-          value: provider,
-          onChange: setProvider,
-          options: providerOptionsFrom(providers)
-        }), /*#__PURE__*/jsx("span", {
-          className: "text-xs opacity-50",
-          children: "The AI that runs this bot. \"Claude Code (CLI)\" uses your Claude login \u2014 no API key needed."
-        })]
-      }), /*#__PURE__*/jsx(SelectInput, {
-        label: "Model",
-        value: model,
-        onChange: setModel,
-        options: modelSelectOptions,
-        placeholder: "Recommended (default)"
-      }), /*#__PURE__*/jsx(SelectInput, {
-        label: "Engine",
-        value: engine,
-        onChange: setEngine,
-        options: ENGINE_OPTIONS,
-        placeholder: "Standard (default)"
-      }), /*#__PURE__*/jsx(SelectInput, {
-        label: "Approval policy",
-        value: approvalPolicy,
-        onChange: setApprovalPolicy,
-        options: APPROVAL_OPTIONS
       }), /*#__PURE__*/jsxs("div", {
         className: "flex flex-col gap-2",
         children: [/*#__PURE__*/jsx("span", {
           className: "text-sm font-medium",
-          children: "Tools & integrations"
+          children: "Providers"
+        }), /*#__PURE__*/jsx("span", {
+          className: "text-xs opacity-50",
+          children: "What this bot can use \u2014 your MCP providers from Settings \u2192 Providers. The bot starts any that aren't running when it runs."
         }), availableServers.length ? /*#__PURE__*/jsx("div", {
           className: "flex flex-col gap-1",
           children: availableServers.map(function (s) {
-            return /*#__PURE__*/jsx(Checkbox, {
-              label: s.label,
-              checked: selectedServers.includes(s.serverName),
-              onChange: function onChange() {
-                return toggleServer(s.serverName);
-              }
+            var on = selectedServers.includes(s.serverName);
+            return /*#__PURE__*/jsxs("div", {
+              className: "flex flex-col gap-1",
+              children: [/*#__PURE__*/jsxs("div", {
+                className: "flex flex-row items-center justify-between gap-3",
+                children: [/*#__PURE__*/jsx(Checkbox, {
+                  label: s.label,
+                  checked: on,
+                  onChange: function onChange() {
+                    return toggleServer(s.serverName);
+                  }
+                }), /*#__PURE__*/jsx("span", {
+                  className: "text-xs opacity-50",
+                  children: s.status
+                })]
+              }), on ? /*#__PURE__*/jsx("div", {
+                className: "flex flex-col gap-1 pl-7 pb-2",
+                children: s.tools && s.tools.length ? /*#__PURE__*/jsxs(Fragment, {
+                  children: [/*#__PURE__*/jsxs("div", {
+                    className: "flex flex-row items-center gap-2",
+                    children: [/*#__PURE__*/jsx("span", {
+                      className: "text-xs opacity-50",
+                      children: "Tools this bot may use (from the provider's allowed tools):"
+                    }), /*#__PURE__*/jsx(Button3, {
+                      title: "All",
+                      size: "xs",
+                      onClick: function onClick() {
+                        return setAllTools(s.serverName, true);
+                      }
+                    }), /*#__PURE__*/jsx(Button3, {
+                      title: "None",
+                      size: "xs",
+                      onClick: function onClick() {
+                        return setAllTools(s.serverName, false);
+                      }
+                    })]
+                  }), /*#__PURE__*/jsx("div", {
+                    className: "grid grid-cols-2 gap-x-4 gap-y-1",
+                    children: s.tools.map(function (tool) {
+                      return /*#__PURE__*/jsxs("div", {
+                        className: "flex flex-row items-center gap-2",
+                        children: [/*#__PURE__*/jsx(Checkbox, {
+                          label: prettyTool(tool),
+                          checked: isToolOn(s.serverName, tool),
+                          onChange: function onChange() {
+                            return toggleTool(s.serverName, s.tools, tool);
+                          }
+                        }), isRemembered(s.serverName, tool) ? /*#__PURE__*/jsxs(Fragment, {
+                          children: [/*#__PURE__*/jsx("span", {
+                            className: "text-xs opacity-60",
+                            children: "Always allowed"
+                          }), /*#__PURE__*/jsx(Button3, {
+                            title: "Revoke",
+                            size: "xs",
+                            ariaLabel: "Revoke always-allow for ".concat(prettyTool(tool)),
+                            tooltip: "Ask again before this tool runs",
+                            onClick: function onClick() {
+                              return revokeRemembered(s.serverName, tool);
+                            }
+                          })]
+                        }) : null]
+                      }, tool);
+                    })
+                  }), grants[s.serverName] && (grants[s.serverName].folders || []).length ? /*#__PURE__*/jsxs("span", {
+                    className: "text-xs opacity-50",
+                    children: ["Always-allowed folders:", " ", grants[s.serverName].folders.join(", ")]
+                  }) : null]
+                }) : /*#__PURE__*/jsx("span", {
+                  className: "text-xs opacity-50",
+                  children: "All tools this provider offers \u2014 it has no tool limit set in Settings \u2192 Providers."
+                })
+              }) : null]
             }, s.serverName);
           })
-        }) : /*#__PURE__*/jsx("span", {
+        }) : sourcesLoaded ? /*#__PURE__*/jsx("span", {
           className: "text-xs opacity-50",
-          children: "No connected integrations yet. Add one under Settings \u2192 MCP Server, then it will appear here."
-        }), /*#__PURE__*/jsx("span", {
+          children: "You haven't set up any MCP providers yet. Add one under Settings \u2192 Providers, then it will appear here."
+        }) : null, /*#__PURE__*/jsx("span", {
           className: "text-xs opacity-50",
-          children: "Tools on these integrations route through the approval policy above."
+          children: "Each tool call follows the approval policy below."
         })]
+      }), /*#__PURE__*/jsxs("div", {
+        className: "flex flex-col gap-2",
+        children: [/*#__PURE__*/jsx("span", {
+          className: "text-sm font-medium",
+          children: "AI model"
+        }), /*#__PURE__*/jsxs("div", {
+          className: "flex flex-col gap-1",
+          children: [/*#__PURE__*/jsx(SelectInput, {
+            label: "Model source",
+            value: provider,
+            onChange: setProvider,
+            options: providerOptionsFrom(providers)
+          }), /*#__PURE__*/jsx("span", {
+            className: "text-xs opacity-50",
+            children: "Which AI powers the bot \u2014 an API key from your Anthropic, OpenAI or xAI providers, or \"Claude Code (CLI)\", which uses your Claude login with no API key."
+          })]
+        }), /*#__PURE__*/jsx(SelectInput, {
+          label: "Model",
+          value: model,
+          onChange: setModel,
+          options: modelSelectOptions,
+          placeholder: "Recommended (default)"
+        }), /*#__PURE__*/jsx(SelectInput, {
+          label: "Engine",
+          value: engine,
+          onChange: setEngine,
+          options: ENGINE_OPTIONS,
+          placeholder: "Standard (default)"
+        })]
+      }), /*#__PURE__*/jsx(SelectInput, {
+        label: "Approval policy",
+        value: approvalPolicy,
+        onChange: setApprovalPolicy,
+        options: APPROVAL_OPTIONS
       }), /*#__PURE__*/jsxs("div", {
         className: "flex flex-col gap-2",
         children: [/*#__PURE__*/jsx("span", {