fix(app): add connect provier in model selector (#10706)

packages/app/src/components/dialog-select-model.tsx

@@ -110,6 +110,11 @@ export function ModelSelectorPopover<T extends ValidComponent = "div">(props: {
     setStore("open", false)
     dialog.show(() => <DialogManageModels />)
   }
+
+  const handleConnectProvider = () => {
+    setStore("open", false)
+    dialog.show(() => <DialogSelectProvider />)
+  }
   const language = useLanguage()
 
   createEffect(() => {
@@ -207,15 +212,26 @@ export function ModelSelectorPopover<T extends ValidComponent = "div">(props: {
             onSelect={() => setStore("open", false)}
             class="p-1"
             action={
-              <IconButton
+              <div class="flex items-center gap-1">
-                icon="sliders"
+                <IconButton
-                variant="ghost"
+                  icon="plus-small"
-                iconSize="normal"
+                  variant="ghost"
-                class="size-6"
+                  iconSize="normal"
-                aria-label={language.t("dialog.model.manage")}
+                  class="size-6"
-                title={language.t("dialog.model.manage")}
+                  aria-label={language.t("command.provider.connect")}
-                onClick={handleManage}
+                  title={language.t("command.provider.connect")}
-              />
+                  onClick={handleConnectProvider}
+                />
+                <IconButton
+                  icon="sliders"
+                  variant="ghost"
+                  iconSize="normal"
+                  class="size-6"
+                  aria-label={language.t("dialog.model.manage")}
+                  title={language.t("dialog.model.manage")}
+                  onClick={handleManage}
+                />
+              </div>
             }
           />
         </Kobalte.Content>