latest

2025-07-14 10:14:20 +04:00
parent 890acbd5bc
commit 868c9b252c
21 changed files with 615 additions and 97 deletions
@@ -0,0 +1,96 @@
+'use client';
+
+import React, { useState } from 'react';
+
+export default function AIConfigPage() {
+  const [apiKey, setApiKey] = useState('');
+  const [ollamaUrl, setOllamaUrl] = useState('http://localhost:11434');
+  const [modelName, setModelName] = useState('command-r7b-arabic');
+  const [saveStatus, setSaveStatus] = useState('');
+  
+  const handleSave = async () => {
+    try {
+      setSaveStatus('Saving...');
+      // In a real implementation, we would update the configuration
+      // securely through a protected API endpoint
+      await new Promise(resolve => setTimeout(resolve, 1000));
+      setSaveStatus('Configuration saved successfully!');
+    } catch (error) {
+      console.error('Error saving configuration:', error);
+      setSaveStatus('Error saving configuration');
+    }
+  };
+  
+  return (
+    <div className="container mx-auto px-6 py-8">
+      <h1 className="text-3xl font-bold mb-8">AI Assistant Configuration</h1>
+      
+      <div className="bg-white p-6 rounded-lg shadow-md mb-6">
+        <h2 className="text-xl font-semibold mb-4">OpenRouter Configuration</h2>
+        <div className="mb-4">
+          <label className="block text-sm font-medium text-gray-700 mb-2">
+            API Key
+          </label>
+          <input
+            type="password"
+            value={apiKey}
+            onChange={(e) => setApiKey(e.target.value)}
+            className="w-full p-2 border border-gray-300 rounded focus:ring-blue-500 focus:border-blue-500"
+            placeholder="sk-..."
+          />
+          <p className="text-xs text-gray-500 mt-1">
+            Your OpenRouter API key is stored securely and never exposed to clients.
+          </p>
+        </div>
+      </div>
+      
+      <div className="bg-white p-6 rounded-lg shadow-md mb-6">
+        <h2 className="text-xl font-semibold mb-4">Ollama Configuration (Fallback)</h2>
+        <div className="mb-4">
+          <label className="block text-sm font-medium text-gray-700 mb-2">
+            Ollama Server URL
+          </label>
+          <input
+            type="text"
+            value={ollamaUrl}
+            onChange={(e) => setOllamaUrl(e.target.value)}
+            className="w-full p-2 border border-gray-300 rounded focus:ring-blue-500 focus:border-blue-500"
+          />
+        </div>
+        <div className="mb-4">
+          <label className="block text-sm font-medium text-gray-700 mb-2">
+            Model Name
+          </label>
+          <input
+            type="text"
+            value={modelName}
+            onChange={(e) => setModelName(e.target.value)}
+            className="w-full p-2 border border-gray-300 rounded focus:ring-blue-500 focus:border-blue-500"
+          />
+          <p className="text-xs text-gray-500 mt-1">
+            The model must be installed on your Ollama server
+          </p>
+        </div>
+      </div>
+      
+      <div className="flex justify-end">
+        <button
+          onClick={handleSave}
+          className="bg-blue-600 text-white px-6 py-2 rounded-lg hover:bg-blue-700 transition-colors"
+        >
+          Save Configuration
+        </button>
+      </div>
+      
+      {saveStatus && (
+        <div className={`mt-4 p-3 rounded ${
+          saveStatus.includes('Error') 
+            ? 'bg-red-100 text-red-800' 
+            : 'bg-green-100 text-green-800'
+        }`}>
+          {saveStatus}
+        </div>
+      )}
+    </div>
+  );
+}