fix: handle manual toggle vision for remote model

web-app/src/containers/ChatInput.tsx

@@ -85,9 +85,9 @@
         const servers = await getConnectedServers()
         setConnectedServers(servers)
       } catch (error) {
         console.error('Failed to get connected servers:', error)
         setConnectedServers([])
       }
     }
 
     checkConnectedServers()
@@ -107,19 +107,25 @@
           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)
           setHasMmproj(false)
         }
       }
     }
 
     checkMmprojSupport()
-  }, [selectedModel?.id, selectedProvider])
+  }, [selectedModel?.capabilities, selectedModel?.id, selectedProvider])
 
   // Check if there are active MCP servers
   const hasActiveMCPServers = connectedServers.length > 0 || tools.length > 0
@@ -130,8 +136,8 @@
       return
     }
     if (!prompt.trim() && uploadedFiles.length === 0) {
       return
     }
     setMessage('')
     sendMessage(
       prompt,
@@ -172,8 +178,8 @@
 
   useEffect(() => {
     if (tooltipToolsAvailable && dropdownToolsAvailable) {
       setTooltipToolsAvailable(false)
     }
   }, [dropdownToolsAvailable, tooltipToolsAvailable])
 
   // Focus when thread changes
@@ -195,39 +201,39 @@
 
   const stopStreaming = useCallback(
     (threadId: string) => {
       abortControllers[threadId]?.abort()
       cancelToolCall?.()
     },
     [abortControllers, cancelToolCall]
   )
 
   const fileInputRef = useRef<HTMLInputElement>(null)
 
   const handleAttachmentClick = () => {
     fileInputRef.current?.click()
   }
 
   const handleRemoveFile = (indexToRemove: number) => {
     setUploadedFiles((prev) =>
       prev.filter((_, index) => index !== indexToRemove)
     )
   }
 
   const getFileTypeFromExtension = (fileName: string): string => {
     const extension = fileName.toLowerCase().split('.').pop()
     switch (extension) {
       case 'jpg':
       case 'jpeg':
         return 'image/jpeg'
       case 'png':
         return 'image/png'
       default:
         return ''
     }
   }
 
   const handleFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {
     const files = e.target.files
 
     if (files && files.length > 0) {
       const maxSize = 10 * 1024 * 1024 // 10MB in bytes

web-app/src/containers/dialogs/EditModel.tsx

@@ -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">