Add verified models

frontend/src/components/modals/settings/ModelSelector.tsx

@@ -5,7 +5,7 @@ import {
 } from "@nextui-org/react";
 import React from "react";
 import { mapProvider } from "#/utils/mapProvider";
-import { VERIFIED_PROVIDERS } from "#/utils/verified-models";
+import { VERIFIED_MODELS, VERIFIED_PROVIDERS } from "#/utils/verified-models";
 import { extractModelAndProvider } from "#/utils/extractModelAndProvider";
 
 interface ModelSelectorProps {
@@ -96,17 +96,24 @@ export function ModelSelector({
             extractModelAndProvider(defaultModel ?? "")?.model ?? undefined
           }
         >
-          {selectedProvider ? (
-            models[selectedProvider].models.map((model) => (
-              <AutocompleteItem key={model} value={model}>
-                {model}
-              </AutocompleteItem>
-            ))
-          ) : (
-            <AutocompleteItem key="" value="">
-              Select a model
-            </AutocompleteItem>
-          )}
+          <AutocompleteSection title="Verified">
+            {models[selectedProvider || ""]?.models
+              .filter((model) => VERIFIED_MODELS.includes(model))
+              .map((model) => (
+                <AutocompleteItem key={model} value={model}>
+                  {model}
+                </AutocompleteItem>
+              ))}
+          </AutocompleteSection>
+          <AutocompleteSection title="Others">
+            {models[selectedProvider || ""]?.models
+              .filter((model) => !VERIFIED_MODELS.includes(model))
+              .map((model) => (
+                <AutocompleteItem key={model} value={model}>
+                  {model}
+                </AutocompleteItem>
+              ))}
+          </AutocompleteSection>
         </Autocomplete>
       </div>
     </div>

frontend/src/components/modals/settings/SettingsModal.tsx

@@ -63,8 +63,10 @@ function SettingsModal({ isOpen, onOpenChange }: SettingsProps) {
   React.useEffect(() => {
     (async () => {
       try {
-        setModels(await fetchModels());
-        setAgents(await fetchAgents());
+        const fetchedModels = await fetchModels();
+        const fetchedAgents = await fetchAgents();
+        setModels(fetchedModels);
+        setAgents(fetchedAgents);
         setSecurityAnalyzers(await fetchSecurityAnalyzers());
       } catch (error) {
         toast.error("settings", t(I18nKey.CONFIGURATION$ERROR_FETCH_MODELS));

frontend/src/utils/verified-models.ts

@@ -1,10 +1,6 @@
-export const VERIFIED_PROVIDERS = [
-  "openai",
-  "azure",
-  "anthropic",
-  "palm",
-  "ollama",
-];
+export const VERIFIED_PROVIDERS = ["openai", "azure", "anthropic"];
+
+export const VERIFIED_MODELS = ["gpt-4o", "claude-3-5-sonnet-20240620-v1:0"];
 
 export const VERIFIED_OPENAI_MODELS = [
   "gpt-4o",