Merge pull request #3497 from emerzon/new_icons

New model icons for LLM Picker

web/src/app/admin/configuration/llm/interfaces.ts

@@ -1,8 +1,12 @@
 import {
   AnthropicIcon,
+  AmazonIcon,
   AWSIcon,
   AzureIcon,
   CPUIcon,
+  MicrosoftIconSVG,
+  MistralIcon,
+  MetaIcon,
   OpenAIIcon,
   GeminiIcon,
   OpenSourceIcon,
@@ -72,12 +76,25 @@ export const getProviderIcon = (providerName: string, modelName?: string) => {
   switch (providerName) {
     case "openai":
       // Special cases for openai based on modelName
+      if (modelName?.toLowerCase().includes("amazon")) {
+        return AmazonIcon;
+      }
+      if (modelName?.toLowerCase().includes("phi")) {
+        return MicrosoftIconSVG;
+      }    
+      if (modelName?.toLowerCase().includes("mistral")) {
+        return MistralIcon;
+      }    
+      if (modelName?.toLowerCase().includes("llama")) {
+        return MetaIcon;
+      }      
       if (modelName?.toLowerCase().includes("gemini")) {
         return GeminiIcon;
       }
       if (modelName?.toLowerCase().includes("claude")) {
         return AnthropicIcon;
       }
+
       return OpenAIIcon; // Default for openai
     case "anthropic":
       return AnthropicIcon;

web/src/components/icons/icons.tsx

@@ -39,7 +39,10 @@ import Image, { StaticImageData } from "next/image";
 import jiraSVG from "../../../public/Jira.svg";
 import confluenceSVG from "../../../public/Confluence.svg";
 import openAISVG from "../../../public/Openai.svg";
+import amazonSVG from "../../../public/Amazon.svg";
 import geminiSVG from "../../../public/Gemini.svg";
+import metaSVG from "../../../public/Meta.svg";
+import mistralSVG from "../../../public/Mistral.svg";
 import openSourceIcon from "../../../public/OpenSource.png";
 import litellmIcon from "../../../public/LiteLLM.jpg";
 
@@ -49,6 +52,7 @@ import asanaIcon from "../../../public/Asana.png";
 import anthropicSVG from "../../../public/Anthropic.svg";
 import nomicSVG from "../../../public/nomic.svg";
 import microsoftIcon from "../../../public/microsoft.png";
+import microsoftSVG from "../../../public/Microsoft.svg";
 import mixedBreadSVG from "../../../public/Mixedbread.png";
 
 import OCIStorageSVG from "../../../public/OCI.svg";
@@ -1104,6 +1108,26 @@ export const GeminiIcon = ({
   className = defaultTailwindCSS,
 }: IconProps) => <LogoIcon size={size} className={className} src={geminiSVG} />;
 
+export const AmazonIcon = ({
+  size = 16,
+  className = defaultTailwindCSS,
+}: IconProps) => <LogoIcon size={size} className={className} src={amazonSVG} />;
+
+export const MetaIcon = ({
+  size = 16,
+  className = defaultTailwindCSS,
+}: IconProps) => <LogoIcon size={size} className={className} src={metaSVG} />;
+
+export const MicrosoftIconSVG = ({
+  size = 16,
+  className = defaultTailwindCSS,
+}: IconProps) => <LogoIcon size={size} className={className} src={microsoftSVG} />;
+
+export const MistralIcon = ({
+  size = 16,
+  className = defaultTailwindCSS,
+}: IconProps) => <LogoIcon size={size} className={className} src={mistralSVG} />;
+
 export const VoyageIcon = ({
   size = 16,
   className = defaultTailwindCSS,

web/src/lib/hooks.ts

@@ -318,6 +318,21 @@ const MODEL_DISPLAY_NAMES: { [key: string]: string } = {
   "gpt-3.5-turbo-16k-0613": "GPT 3.5 Turbo 16k (June 2023)",
   "gpt-3.5-turbo-0301": "GPT 3.5 Turbo (March 2023)",
 
+  // Amazon models
+  "amazon.nova-micro@v1": "Amazon Nova Micro",
+  "amazon.nova-lite@v1": "Amazon Nova Lite",
+  "amazon.nova-pro@v1": "Amazon Nova Pro",
+
+  // Meta models
+  "llama-3.2-90b-vision-instruct": "Llama 3.2 90B",
+  "llama-3.2-11b-vision-instruct": "Llama 3.2 11B",
+  "llama-3.3-70b-instruct": "Llama 3.3 70B",
+
+  // Microsoft models
+  "phi-3.5-mini-instruct": "Phi 3.5 Mini",
+  "phi-3.5-moe-instruct": "Phi 3.5 MoE",
+  "phi-3.5-vision-instruct": "Phi 3.5 Vision",
+
   // Anthropic models
   "claude-3-opus-20240229": "Claude 3 Opus",
   "claude-3-sonnet-20240229": "Claude 3 Sonnet",
@@ -329,6 +344,9 @@ const MODEL_DISPLAY_NAMES: { [key: string]: string } = {
   "claude-3-5-sonnet-20241022": "Claude 3.5 Sonnet (New)",
   "claude-3-5-sonnet-v2@20241022": "Claude 3.5 Sonnet (New)",
   "claude-3.5-sonnet-v2@20241022": "Claude 3.5 Sonnet (New)",
+  "claude-3-5-haiku-20241022": "Claude 3.5 Haiku",
+  "claude-3-5-haiku@20241022": "Claude 3.5 Haiku",
+  "claude-3.5-haiku@20241022": "Claude 3.5 Haiku",
 
   // Google Models
   "gemini-1.5-pro": "Gemini 1.5 Pro",
@@ -337,6 +355,11 @@ const MODEL_DISPLAY_NAMES: { [key: string]: string } = {
   "gemini-1.5-flash-001": "Gemini 1.5 Flash",
   "gemini-1.5-pro-002": "Gemini 1.5 Pro (v2)",
   "gemini-1.5-flash-002": "Gemini 1.5 Flash (v2)",
+  "gemini-2.0-flash-exp": "Gemini 2.0 Flash (Experimental)",
+
+  // Mistral Models
+  "mistral-large-2411": "Mistral Large 24.11",
+  "mistral-large@2411": "Mistral Large 24.11",
 
   // Bedrock models
   "meta.llama3-1-70b-instruct-v1:0": "Llama 3.1 70B",

web/src/lib/llm/utils.ts

@@ -74,6 +74,8 @@ const MODEL_NAMES_SUPPORTING_IMAGE_INPUT = [
   "claude-3-opus-20240229",
   "claude-3-sonnet-20240229",
   "claude-3-haiku-20240307",
+  // custom claude names
+  "claude-3.5-sonnet-v2@20241022",
   // claude names with AWS Bedrock Suffix
   "claude-3-opus-20240229-v1:0",
   "claude-3-sonnet-20240229-v1:0",
@@ -93,6 +95,13 @@ const MODEL_NAMES_SUPPORTING_IMAGE_INPUT = [
   "gemini-1.5-flash-001",
   "gemini-1.5-pro-002",
   "gemini-1.5-flash-002",
+  "gemini-2.0-flash-exp",
+  // amazon models
+  "amazon.nova-lite@v1",
+  "amazon.nova-pro@v1",
+  // meta models
+  "llama-3.2-90b-vision-instruct",
+  "llama-3.2-11b-vision-instruct"  
 ];
 
 export function checkLLMSupportsImageInput(model: string) {