Make supportsImage a property of a model

sedwards2009 · Feb 13, 2024 · 39ea4c4 · 39ea4c4
1 parent b1a5dfd
commit 39ea4c4
Show file tree

Hide file tree

Showing 8 changed files with 32 additions and 14 deletions.
diff --git a/backend/internal/data/data.go b/backend/internal/data/data.go
@@ -59,6 +59,7 @@ type Model struct {
 	InternalModelID  string
 	SupportsContinue bool `json:"supportsContinue"`
 	SupportsReply    bool `json:"supportsReply"`
+	SupportsImages   bool `json:"supportsImages"`
 }
 
 type Response struct {

diff --git a/backend/internal/engine/ollama/engine_ollama.go b/backend/internal/engine/ollama/engine_ollama.go
@@ -190,6 +190,7 @@ func (this *OllamaEngineBackend) ScanModels() []*data.Model {
 			InternalModelID:  modelInfo.Name,
 			SupportsContinue: false,
 			SupportsReply:    true,
+			SupportsImages:   true,
 		})
 	}
 	return result

diff --git a/backend/internal/engine/openai/engine_openai.go b/backend/internal/engine/openai/engine_openai.go
@@ -131,6 +131,7 @@ func (this *OpenAiEngineBackend) ScanModels() []*data.Model {
 			InternalModelID:  modelInfo.ID,
 			SupportsContinue: true,
 			SupportsReply:    true,
+			SupportsImages:   false,
 		})
 
 		if this.config.Variant != nil && *this.config.Variant == config.VARIANT_OOBABOOGA {

diff --git a/frontend/src/data.tsx b/frontend/src/data.tsx
@@ -68,6 +68,7 @@ export interface Model {
   name: string;
   supportsContinue: boolean;
   supportsReply: boolean;
+  supportsImages: boolean;
 }
 
 export interface ModelOverview {

diff --git a/frontend/src/responseeditor.tsx b/frontend/src/responseeditor.tsx
@@ -66,6 +66,7 @@ export function ResponseEditor({sessionId, response, modelOverview, presetOvervi
 
     supportsContinue = model?.supportsContinue === true;
   }
+  const supportsImages = model?.supportsImages == true;
 
   return <div className="card">
     <h3>Response</h3>
@@ -113,6 +114,7 @@ export function ResponseEditor({sessionId, response, modelOverview, presetOvervi
       <ResponseMessage
         sessionId={sessionId}
         message={response.messages[0]}
+        supportsImages={supportsImages}
         onContinueClicked={null}
         onDeleteClicked={null}
       />
@@ -122,6 +124,7 @@ export function ResponseEditor({sessionId, response, modelOverview, presetOvervi
         sessionId={sessionId}
         key={m.id}
         message={m}
+        supportsImages={supportsImages}
         onContinueClicked={supportsContinue && isSendEnabled && response.status === "Done" &&
           response.messages.length-1 === i+1 ? onContinueClicked : null}
         onDeleteClicked={isSendEnabled && response.status === "Done"

diff --git a/frontend/src/responsemessage.tsx b/frontend/src/responsemessage.tsx
@@ -5,11 +5,14 @@ import { FileAttachmentsList } from "./fileattachmentslist";
 export interface Props {
   sessionId: string;
   message: Message;
+  supportsImages: boolean;
   onContinueClicked: (() => void) | null;
   onDeleteClicked: (() => void) | null;
 }
 
-export function ResponseMessage({sessionId, message, onContinueClicked, onDeleteClicked}: Props): JSX.Element {
+export function ResponseMessage({sessionId, message, supportsImages, onContinueClicked,
+    onDeleteClicked}: Props): JSX.Element {
+
   const iconName = message.role === "Assistant" ? "fa-robot" : "fa-user";
   return <div className="response-message">
     <div className="response-message-gutter"><i className={"fas " + iconName}></i></div>
@@ -26,7 +29,7 @@ export function ResponseMessage({sessionId, message, onContinueClicked, onDelete
       </div>
       <ReactMarkdown children={message.text} /><br />
       {
-        message.attachedFiles != null && message.attachedFiles.length != 0 &&
+        supportsImages && message.attachedFiles != null && message.attachedFiles.length != 0 &&
         <FileAttachmentsList
           sessionId={sessionId}
           attachedFiles={message.attachedFiles}

diff --git a/frontend/src/sessioneditor.tsx b/frontend/src/sessioneditor.tsx
@@ -1,5 +1,5 @@
 import { ChangeEvent, KeyboardEventHandler, useEffect, useState } from "react";
-import { ModelOverview, PresetOverview, Session, TemplateOverview, isSettingsValid } from "./data";
+import { ModelOverview, PresetOverview, Session, TemplateOverview, getModelById, isSettingsValid } from "./data";
 import { navigate } from "raviger";
 import TextareaAutosize from "react-textarea-autosize";
 import { loadSession, newResponse, setSessionPrompt, deleteResponse, deleteResponseMessage, SessionMonitor,
@@ -158,6 +158,10 @@ export function SessionEditor({sessionId, modelOverview, presetOverview, templat
 
   const isSendEnabled = isSettingsValid(modelOverview, presetOverview, templateOverview, selectedModelId,
     selectedPresetId, selectedTemplateId);
+
+  const model = getModelById(modelOverview, selectedModelId);
+  const supportImages = model?.supportsImages == true;
+
   return <div className="session-editor">
     {session == null && <div>Loading</div>}
     {session && <>
@@ -203,12 +207,12 @@ export function SessionEditor({sessionId, modelOverview, presetOverview, templat
                 Send
             </button>
           </div>
-          <FileAttachments
+          {supportImages && <FileAttachments
             sessionId={sessionId}
             onUploadFile={onUploadFile}
             onDeleteFile={onDeleteFile}
             attachedFiles={session.attachedFiles}
-          />
+          />}
         </div>
         <div className="session-response-pane">
           {

diff --git a/frontend/src/settingspage.tsx b/frontend/src/settingspage.tsx
@@ -33,16 +33,20 @@ export function SettingsPage({ modelOverview, rescanModels }: Props): JSX.Elemen
           <th>Model</th>
           <th>Supports Continue</th>
           <th>Supports Replies</th>
+          <th>Supports Images</th>
         </thead>
-      {
-        modelOverview.models.map(m => {
-          return <tr key={m.id}>
-            <td>{m.name}</td>
-            <td>{m.supportsContinue ? "Yes" : "No"}</td>
-            <td>{m.supportsReply ? "Yes" : "No"}</td>
-          </tr>;
-        })
-      }
+        <tbody>
+        {
+          modelOverview.models.map(m => {
+            return <tr key={m.id}>
+              <td>{m.name}</td>
+              <td>{m.supportsContinue ? "Yes" : "No"}</td>
+              <td>{m.supportsReply ? "Yes" : "No"}</td>
+              <td>{m.supportsImages ? "Yes" : "No"}</td>
+            </tr>;
+          })
+        }
+        </tbody>
       </table>
 
       <button className="success" onClick={onRescanClicked} disabled={isScanning}>