Upload 2 files

app.py

@@ -16,7 +16,12 @@ app = Flask(__name__)
 CORS(app, supports_credentials=True)
 # --- CONFIGURATION ---
 app.config['SQLALCHEMY_DATABASE_URI'] = os.environ.get('DATABASE_URL', 'sqlite:///ai_cms.db')
+app.config['SQLALCHEMY_TRACK_MODIFICATIONS'] = False
 app.config['SECRET_KEY'] = os.environ.get('SECRET_KEY', 'dev-key-change-in-production')
+app.config['PERMANENT_SESSION_LIFETIME'] = timedelta(days=7)
+app.config['SESSION_COOKIE_SECURE'] = False
+app.config['SESSION_COOKIE_HTTPONLY'] = True
+app.config['SESSION_COOKIE_SAMESITE'] = 'Lax'
 app.config['SQLALCHEMY_ENGINE_OPTIONS'] = {
     'pool_recycle': 300,
     'pool_pre_ping': True,
@@ -38,6 +43,12 @@ class User(UserMixin, db.Model):
     created_at = db.Column(db.DateTime, default=datetime.utcnow)
     is_admin = db.Column(db.Boolean, default=False)
     
+    # Flask-Login already provides is_authenticated via UserMixin
+    # But you can override if needed:
+    @property
+    def is_authenticated(self):
+        return True
+    
     def set_password(self, password):
         self.password_hash = bcrypt.generate_password_hash(password).decode('utf-8')
     
@@ -150,21 +161,39 @@ def login():
         return redirect(url_for('dashboard'))
     
     if request.method == 'POST':
-        data = request.json if request.is_json else request.form
-        username = data.get('username')
-        password = data.get('password')
-        
-        user = User.query.filter_by(username=username).first()
-        
-        if user and user.check_password(password):
-            login_user(user)
+        try:
+            data = request.get_json() if request.is_json else request.form
+            username = data.get('username') if data else None
+            password = data.get('password') if data else None
+            
+            if not username or not password:
+                if request.is_json:
+                    return jsonify({"status": "error", "message": "Username and password required"}), 400
+                flash('Username and password required', 'error')
+                return render_template('login.html')
+            
+            user = User.query.filter_by(username=username).first()
+            
+            if user and user.check_password(password):
+                login_user(user, remember=True)  # Add remember=True
+                
+                # Set session as permanent
+                session.permanent = True
+                
+                next_page = request.args.get('next')
+                if request.is_json:
+                    return jsonify({"status": "success", "message": "Login successful"})
+                return redirect(next_page) if next_page else redirect(url_for('dashboard'))
+            
             if request.is_json:
-                return jsonify({"status": "success", "message": "Login successful"})
-            return redirect(url_for('dashboard'))
-        
-        if request.is_json:
-            return jsonify({"status": "error", "message": "Invalid credentials"}), 401
-        flash('Invalid username or password', 'error')
+                return jsonify({"status": "error", "message": "Invalid credentials"}), 401
+            flash('Invalid username or password', 'error')
+            
+        except Exception as e:
+            print(f"Login error: {str(e)}")
+            if request.is_json:
+                return jsonify({"status": "error", "message": "Internal server error"}), 500
+            flash('An error occurred', 'error')
     
     return render_template('login.html')
 
@@ -381,6 +410,15 @@ def dynamic_endpoint(route):
         cost=cost,
         status_code=200
     )
+
+    @app.route('/debug-session')
+    def debug_session():
+        return jsonify({
+        'is_authenticated': current_user.is_authenticated,
+        'user_id': current_user.id if current_user.is_authenticated else None,
+        'username': current_user.username if current_user.is_authenticated else None,
+        'session_id': session.get('_id', 'No session')
+    })
     
     db.session.add(log)
     db.session.commit()

script.js

@@ -0,0 +1,251 @@
+// Navigation Logic
+function showSection(sectionId) {
+    document.querySelectorAll('.section').forEach(el => el.classList.remove('active'));
+    document.querySelectorAll('.nav-links li').forEach(el => el.classList.remove('active'));
+    
+    document.getElementById(sectionId).classList.add('active');
+    event.target.classList.add('active');
+
+    if(sectionId === 'dashboard') loadStats();
+    if(sectionId === 'list') loadApis();
+}
+
+// Load Stats
+async function loadStats() {
+    const res = await fetch('/api/cms/stats');
+    const data = await res.json();
+    
+    document.getElementById('stat-calls').innerText = data.total_calls;
+    document.getElementById('stat-tokens').innerText = data.total_tokens;
+    document.getElementById('stat-cost').innerText = '$' + data.total_cost.toFixed(4);
+    document.getElementById('stat-apis').innerText = data.active_apis;
+}
+
+// Create API
+document.getElementById('create-form').addEventListener('submit', async (e) => {
+    e.preventDefault();
+    
+    const payload = {
+        route: document.getElementById('api-route').value,
+        model: document.getElementById('api-model').value,
+        prompt: document.getElementById('api-prompt').value
+    };
+
+    const res = await fetch('/api/cms/create', {
+        method: 'POST',
+        headers: {'Content-Type': 'application/json'},
+        body: JSON.stringify(payload)
+    });
+
+    if(res.ok) {
+        alert('API Created! You can now POST to: http://localhost:5000/user-api/' + payload.route);
+        document.getElementById('create-form').reset();
+        showSection('list');
+    }
+});
+
+document.getElementById('login-form').addEventListener('submit', async (e) => {
+    e.preventDefault();
+    
+    const messageContainer = document.getElementById('message-container');
+    messageContainer.innerHTML = '<div style="background:#fff3cd;border:2px solid #ffc107;padding:1rem;margin-bottom:1rem;border-radius:4px;text-align:center;">Logging in...</div>';
+    
+    try {
+        const res = await fetch('/login', {
+            method: 'POST',
+            headers: {'Content-Type': 'application/json'},
+            body: JSON.stringify({
+                username: document.getElementById('username').value,
+                password: document.getElementById('password').value
+            }),
+            credentials: 'include'  // Important! Include cookies
+        });
+        
+        const contentType = res.headers.get('content-type');
+        if (!contentType || !contentType.includes('application/json')) {
+            throw new Error('Server returned HTML instead of JSON. Check backend logs.');
+        }
+        
+        const data = await res.json();
+        
+        if (res.ok) {
+            messageContainer.innerHTML = '<div class="success-message">✅ Login successful! Redirecting...</div>';
+            
+            // Force redirect to dashboard
+            setTimeout(() => {
+                window.location.href = '/';
+            }, 1000);
+        } else {
+            messageContainer.innerHTML = `<div class="error-message">❌ ${data.message}</div>`;
+        }
+    } catch (error) {
+        console.error('Login error:', error);
+        messageContainer.innerHTML = `<div class="error-message">❌ ${error.message}</div>`;
+    }
+});
+
+async function loadLogs() {
+    const res = await fetch('/api/cms/logs');
+    const logs = await res.json();
+    const container = document.getElementById('logs-container');
+    
+    if (logs.length === 0) {
+        container.innerHTML = '<p class="sub-text">No API calls yet</p>';
+        return;
+    }
+    
+    let html = '<table style="width:100%; font-size:0.85rem;">';
+    html += '<tr><th>Time</th><th>Tokens</th><th>Latency</th><th>Cost</th></tr>';
+    
+    logs.slice(0, 10).forEach(log => {
+        html += `
+            <tr>
+                <td>${log.timestamp.split(' ')[1]}</td>
+                <td>${log.tokens_used}</td>
+                <td>${log.latency}s</td>
+                <td>$${log.cost}</td>
+            </tr>
+        `;
+    });
+    
+    html += '</table>';
+    container.innerHTML = html;
+}
+
+// Update showSection function to load logs
+function showSection(sectionId) {
+    document.querySelectorAll('.section').forEach(el => el.classList.remove('active'));
+    document.querySelectorAll('.nav-links li').forEach(el => el.classList.remove('active'));
+    
+    document.getElementById(sectionId).classList.add('active');
+    event.target.classList.add('active');
+
+    if(sectionId === 'dashboard') {
+        loadStats();
+        loadLogs();
+    }
+    if(sectionId === 'list') loadApis();
+}
+
+// Load API List
+async function loadApis() {
+    const res = await fetch('/api/cms/list');
+    const apis = await res.json();
+    const tbody = document.getElementById('api-table-body');
+    
+    tbody.innerHTML = '';
+    
+    apis.forEach(api => {
+        const row = `
+            <tr>
+                <td><span class="endpoint-url">/user-api/${api.route}</span></td>
+                <td>${api.model}</td>
+                <td>${api.total_calls}</td>
+                <td>
+                    <button onclick="testApi('${api.route}')" style="padding:5px; cursor:pointer;">Test</button>
+                    <button onclick="deleteApi(${api.id})" style="padding:5px; cursor:pointer; color:red;">Delete</button>
+                </td>
+            </tr>
+        `;
+        tbody.innerHTML += row;
+    });
+}
+
+// Add delete function
+async function deleteApi(id) {
+    if(confirm('Are you sure you want to delete this API?')) {
+        await fetch(`/api/cms/delete/${id}`, { method: 'DELETE' });
+        loadApis();
+        loadStats();
+    }
+}
+
+// API Keys Functions
+async function loadKeys() {
+    const res = await fetch('/api/cms/keys');
+    const keys = await res.json();
+    const tbody = document.getElementById('keys-table-body');
+    
+    tbody.innerHTML = '';
+    
+    keys.forEach(key => {
+        const row = `
+            <tr>
+                <td>${key.name}</td>
+                <td><code style="background:#eee; padding:2px 6px; font-size:0.75rem;">${key.key}</code></td>
+                <td>${key.usage_count}</td>
+                <td><span style="color:${key.is_active ? 'green' : 'red'}">● ${key.is_active ? 'Active' : 'Inactive'}</span></td>
+                <td>
+                    <button onclick="toggleKey(${key.id})" style="padding:5px; cursor:pointer;">${key.is_active ? 'Deactivate' : 'Activate'}</button>
+                    <button onclick="deleteKey(${key.id})" style="padding:5px; cursor:pointer; color:red;">Delete</button>
+                </td>
+            </tr>
+        `;
+        tbody.innerHTML += row;
+    });
+}
+
+async function createKey() {
+    const name = document.getElementById('key-name').value || 'Unnamed Key';
+    
+    const res = await fetch('/api/cms/keys', {
+        method: 'POST',
+        headers: {'Content-Type': 'application/json'},
+        body: JSON.stringify({name})
+    });
+    
+    const data = await res.json();
+    
+    if (res.ok) {
+        alert('New API Key Generated:\n\n' + data.key + '\n\nSave this key! It won\'t be shown again.');
+        document.getElementById('key-name').value = '';
+        loadKeys();
+    }
+}
+
+async function toggleKey(id) {
+    await fetch(`/api/cms/keys/${id}/toggle`, {method: 'POST'});
+    loadKeys();
+}
+
+async function deleteKey(id) {
+    if(confirm('Delete this API Key?')) {
+        await fetch(`/api/cms/keys/${id}`, {method: 'DELETE'});
+        loadKeys();
+    }
+}
+
+// Export Function
+function exportLogs() {
+    window.open('/api/cms/export', '_blank');
+}
+
+// Update showSection to handle keys
+function showSection(sectionId) {
+    document.querySelectorAll('.section').forEach(el => el.classList.remove('active'));
+    document.querySelectorAll('.nav-links li').forEach(el => el.classList.remove('active'));
+    
+    document.getElementById(sectionId).classList.add('active');
+    event.target.classList.add('active');
+
+    if(sectionId === 'dashboard') {
+        loadStats();
+        loadLogs();
+    }
+    if(sectionId === 'list') loadApis();
+    if(sectionId === 'keys') loadKeys();
+}
+
+// Simple Test Function
+async function testApi(route) {
+    const res = await fetch(`/user-api/${route}`, {
+        method: 'POST',
+        headers: {'Content-Type': 'application/json'},
+        body: JSON.stringify({test: "data"})
+    });
+    const data = await res.json();
+    alert("Response:\n" + JSON.stringify(data, null, 2));
+}
+
+// Initial Load
+loadStats();