Nicholai/jan
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #6281 from menloresearch/fix/handle-vision-remote-model

Browse Source 
fix: handle manual toggle vision for remote model
This commit is contained in:
Faisal Amir 2025-08-25 13:36:27 +07:00 committed by GitHub
commit 2472cc949a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 56 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

60
web-app/src/containers/ChatInput.tsx
View File

@ -107,9 +107,15 @@ const ChatInput = ({ model, className, initialMessage }: ChatInputProps) => {
if (selectedProvider === 'llamacpp') {
const hasLocalMmproj = await checkMmprojExists(selectedModel.id)
setHasMmproj(hasLocalMmproj)
} else {
// For non-llamacpp providers, only check vision capability
}
// For non-llamacpp providers, only check vision capability
else if (
selectedProvider !== 'llamacpp' &&
selectedModel?.capabilities?.includes('vision')
) {
setHasMmproj(true)
} else {
setHasMmproj(false)
}
} catch (error) {
console.error('Error checking mmproj:', error)
@ -119,7 +125,7 @@ const ChatInput = ({ model, className, initialMessage }: ChatInputProps) => {
}
checkMmprojSupport()
}, [selectedModel?.id, selectedProvider])
}, [selectedModel?.capabilities, selectedModel?.id, selectedProvider])
// Check if there are active MCP servers
const hasActiveMCPServers = connectedServers.length > 0 || tools.length > 0
@ -535,29 +541,41 @@ const ChatInput = ({ model, className, initialMessage }: ChatInputProps) => {
)}
{/* File attachment - show only for models with mmproj */}
{hasMmproj && (
<div
className="h-6 p-1 flex items-center justify-center rounded-sm hover:bg-main-view-fg/10 transition-all duration-200 ease-in-out gap-1"
onClick={handleAttachmentClick}
>
<IconPhoto size={18} className="text-main-view-fg/50" />
<input
type="file"
ref={fileInputRef}
className="hidden"
multiple
onChange={handleFileChange}
/>
</div>
<TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
<div
className="h-7 p-1 flex items-center justify-center rounded-sm hover:bg-main-view-fg/10 transition-all duration-200 ease-in-out gap-1"
onClick={handleAttachmentClick}
>
<IconPhoto
size={18}
className="text-main-view-fg/50"
/>
<input
type="file"
ref={fileInputRef}
className="hidden"
multiple
onChange={handleFileChange}
/>
</div>
</TooltipTrigger>
<TooltipContent>
<p>{t('visions')}</p>
</TooltipContent>
</Tooltip>
</TooltipProvider>
)}
{/* Microphone - always available - Temp Hide */}
{/* <div className="h-6 p-1 flex items-center justify-center rounded-sm hover:bg-main-view-fg/10 transition-all duration-200 ease-in-out gap-1">
{/* <div className="h-7 p-1 flex items-center justify-center rounded-sm hover:bg-main-view-fg/10 transition-all duration-200 ease-in-out gap-1">
<IconMicrophone size={18} className="text-main-view-fg/50" />
</div> */}
{selectedModel?.capabilities?.includes('embeddings') && (
<TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
<div className="h-6 p-1 flex items-center justify-center rounded-sm hover:bg-main-view-fg/10 transition-all duration-200 ease-in-out gap-1">
<div className="h-7 p-1 flex items-center justify-center rounded-sm hover:bg-main-view-fg/10 transition-all duration-200 ease-in-out gap-1">
<IconCodeCircle2
size={18}
className="text-main-view-fg/50"
@ -601,7 +619,7 @@ const ChatInput = ({ model, className, initialMessage }: ChatInputProps) => {
return (
<div
className={cn(
'h-6 p-1 flex items-center justify-center rounded-sm hover:bg-main-view-fg/10 transition-all duration-200 ease-in-out gap-1 cursor-pointer relative',
'h-7 p-1 flex items-center justify-center rounded-sm hover:bg-main-view-fg/10 transition-all duration-200 ease-in-out gap-1 cursor-pointer relative',
isOpen && 'bg-main-view-fg/10'
)}
>
@ -632,7 +650,7 @@ const ChatInput = ({ model, className, initialMessage }: ChatInputProps) => {
<TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
<div className="h-6 p-1 flex items-center justify-center rounded-sm hover:bg-main-view-fg/10 transition-all duration-200 ease-in-out gap-1">
<div className="h-7 p-1 flex items-center justify-center rounded-sm hover:bg-main-view-fg/10 transition-all duration-200 ease-in-out gap-1">
<IconWorld
size={18}
className="text-main-view-fg/50"
@ -649,7 +667,7 @@ const ChatInput = ({ model, className, initialMessage }: ChatInputProps) => {
<TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
<div className="h-6 p-1 flex items-center justify-center rounded-sm hover:bg-main-view-fg/10 transition-all duration-200 ease-in-out gap-1">
<div className="h-7 p-1 flex items-center justify-center rounded-sm hover:bg-main-view-fg/10 transition-all duration-200 ease-in-out gap-1">
<IconAtom
size={18}
className="text-main-view-fg/50"

16
web-app/src/containers/DropdownModelProvider.tsx
View File

@ -414,13 +414,15 @@ const DropdownModelProvider = ({
</span>
</button>
</PopoverTrigger>
{currentModel?.settings && provider && (
<ModelSetting
model={currentModel as Model}
provider={provider}
smallIcon
/>
)}
{currentModel?.settings &&
provider &&
provider.provider === 'llamacpp' && (
<ModelSetting
model={currentModel as Model}
provider={provider}
smallIcon
/>
)}
<ModelSupportStatus
modelId={selectedModel?.id}
provider={selectedProvider}

22
web-app/src/containers/dialogs/EditModel.tsx
View File

@ -177,21 +177,13 @@ export const DialogEditModel = ({
{t('providers:editModel.vision')}
</span>
</div>
<Tooltip>
<TooltipTrigger>
<Switch
id="vision-capability"
checked={capabilities.vision}
disabled={true}
onCheckedChange={(checked) =>
handleCapabilityChange('vision', checked)
}
/>
</TooltipTrigger>
<TooltipContent>
{t('providers:editModel.notAvailable')}
</TooltipContent>
</Tooltip>
<Switch
id="vision-capability"
checked={capabilities.vision}
onCheckedChange={(checked) =>
handleCapabilityChange('vision', checked)
}
/>
</div>
<div className="flex items-center justify-between">

2
web-app/src/hooks/useModelProvider.ts
View File

@ -241,7 +241,7 @@ export const useModelProvider = create<ModelProviderState>()(
}
// Migrate model settings
if (provider.models) {
if (provider.models && provider.provider === 'llamacpp') {
provider.models.forEach((model) => {
if (!model.settings) model.settings = {}