diff --git a/frontend/src/components/app-config/ai-config.tsx b/frontend/src/components/app-config/ai-config.tsx index 83c94538688..0c19fbfd898 100644 --- a/frontend/src/components/app-config/ai-config.tsx +++ b/frontend/src/components/app-config/ai-config.tsx @@ -5,6 +5,7 @@ import { BotIcon, BrainIcon, ChevronRightIcon, + InfoIcon, PlusIcon, Trash2Icon, } from "lucide-react"; @@ -61,6 +62,7 @@ import { } from "../ui/accordion"; import { Button } from "../ui/button"; import { Checkbox } from "../ui/checkbox"; +import { DropdownMenuSeparator } from "../ui/dropdown-menu"; import { Label } from "../ui/label"; import { ExternalLink } from "../ui/links"; import { @@ -272,6 +274,32 @@ export const ModelSelector: React.FC = ({ placeholder={placeholder} onSelect={selectModel} triggerClassName="text-sm" + customDropdownContent={ + <> + +

+ Enter a custom model + + + +

+
+ + {value && ( + + )} +
+ + } forRole={forRole} /> diff --git a/frontend/src/components/chat/chat-panel.tsx b/frontend/src/components/chat/chat-panel.tsx index 256f7164e3c..f7cf6f6ba13 100644 --- a/frontend/src/components/chat/chat-panel.tsx +++ b/frontend/src/components/chat/chat-panel.tsx @@ -433,7 +433,7 @@ const ChatPanel = () => { return ( diff --git a/frontend/src/components/editor/ai/ai-completion-editor.tsx b/frontend/src/components/editor/ai/ai-completion-editor.tsx index e35b141b1af..86b5ce8942c 100644 --- a/frontend/src/components/editor/ai/ai-completion-editor.tsx +++ b/frontend/src/components/editor/ai/ai-completion-editor.tsx @@ -363,6 +363,7 @@ export const AiCompletionEditor: React.FC = ({ iconSize="small" forRole="edit" displayIconOnly={true} + placeholder="Edit model" /> {completion && ( diff --git a/frontend/src/components/editor/renderers/cell-array.tsx b/frontend/src/components/editor/renderers/cell-array.tsx index 33cd86aa05b..3bb0d055b4f 100644 --- a/frontend/src/components/editor/renderers/cell-array.tsx +++ b/frontend/src/components/editor/renderers/cell-array.tsx @@ -13,6 +13,7 @@ import { SquareMIcon, } from "lucide-react"; import { useEffect } from "react"; +import { useOpenSettingsToTab } from "@/components/app-config/state"; import { StartupLogsAlert } from "@/components/editor/alerts/startup-logs-alert"; import { Cell } from "@/components/editor/notebook-cell"; import { PackageAlert } from "@/components/editor/package-alert"; @@ -253,6 +254,7 @@ const AddCellButtons: React.FC<{ const [isAiButtonOpen, isAiButtonOpenActions] = useBoolean(false); const aiEnabled = useAtomValue(aiEnabledAtom); const canInteractWithApp = useAtomValue(canInteractWithAppAtom); + const { handleClick } = useOpenSettingsToTab(); const buttonClass = cn( "mb-0 rounded-none sm:px-4 md:px-5 lg:px-8 tracking-wide no-wrap whitespace-nowrap", @@ -320,7 +322,9 @@ const AddCellButtons: React.FC<{ Enable via settings under AI Assist + aiEnabled ? null : ( + AI provider not found or Edit model not selected + ) } delayDuration={100} asChild={false} @@ -329,8 +333,12 @@ const AddCellButtons: React.FC<{ className={buttonClass} variant="text" size="sm" - disabled={!aiEnabled || !canInteractWithApp} - onClick={isAiButtonOpenActions.toggle} + disabled={!canInteractWithApp} + onClick={ + aiEnabled + ? isAiButtonOpenActions.toggle + : () => handleClick("ai", "ai-providers") + } > Generate with AI