Dynamically load AI models from OpenRouter API for content generation

Implement a new API endpoint `/api/openrouter/models` to fetch AI model data from OpenRouter and dynamically populate the model selection in the settings page.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: ae4037a0-2a6f-4530-9bac-79b543286bda
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/397bca8c-984f-43ff-841a-10897aeb8140/ae4037a0-2a6f-4530-9bac-79b543286bda/HPCBgsr

client/src/pages/settings.tsx

@@ -33,6 +33,10 @@ export default function Settings() {
     queryKey: ['/api/openrouter/config'],
   });
 
+  const { data: openrouterModels } = useQuery({
+    queryKey: ['/api/openrouter/models'],
+  });
+
   useEffect(() => {
     if (cloudinaryConfig) {
       setCloudName((cloudinaryConfig as any).cloudName || "");
@@ -200,12 +204,11 @@ export default function Settings() {
                       <SelectValue placeholder="Sélectionner un modèle" />
                     </SelectTrigger>
                     <SelectContent>
-                      <SelectItem value="anthropic/claude-3.5-sonnet">Claude 3.5 Sonnet</SelectItem>
-                      <SelectItem value="anthropic/claude-3-opus">Claude 3 Opus</SelectItem>
-                      <SelectItem value="openai/gpt-4o">GPT-4o</SelectItem>
-                      <SelectItem value="openai/gpt-4-turbo">GPT-4 Turbo</SelectItem>
-                      <SelectItem value="google/gemini-pro-1.5">Gemini 1.5 Pro</SelectItem>
-                      <SelectItem value="meta-llama/llama-3.1-70b-instruct">Llama 3.1 70B</SelectItem>
+                      {openrouterModels?.data?.map((model: any) => (
+                        <SelectItem key={model.id} value={model.id}>
+                          {model.name}
+                        </SelectItem>
+                      ))}
                     </SelectContent>
                   </Select>
                   <p className="text-xs text-muted-foreground">

server/routes.ts

@@ -283,6 +283,27 @@ export async function registerRoutes(app: Express): Promise<Server> {
     }
   });
 
+  // OpenRouter models list
+  app.get("/api/openrouter/models", async (req, res) => {
+    try {
+      const response = await fetch("https://openrouter.ai/api/v1/models", {
+        headers: {
+          "Content-Type": "application/json",
+        }
+      });
+
+      if (!response.ok) {
+        throw new Error(`OpenRouter API error: ${response.status}`);
+      }
+
+      const data = await response.json();
+      res.json(data);
+    } catch (error) {
+      console.error("Error fetching OpenRouter models:", error);
+      res.status(500).json({ error: "Failed to fetch OpenRouter models" });
+    }
+  });
+
   // OpenRouter configuration
   app.get("/api/openrouter/config", async (req, res) => {
     try {