import React, { useEffect, useState } from 'react';
import { useAuth } from '../../contexts/AuthContext';
import { KnowledgeBaseView } from '../../../components/views/KnowledgeBaseView';
import { modelConfigService } from '../../../services/modelConfigService';
import { ModelConfig } from '../../../types';

export default function KnowledgePage() {
    const { apiKey, user, logout } = useAuth();
    const [modelConfigs, setModelConfigs] = useState<ModelConfig[]>([]);

    useEffect(() => {
        const fetchModels = async () => {
            if (!apiKey) return;
            try {
                const models = await modelConfigService.getAll(apiKey);
                setModelConfigs(models);
            } catch (error) {
                console.error('Failed to fetch model configs:', error);
            }
        };
        fetchModels();
    }, [apiKey]);

    return (
        <KnowledgeBaseView
            authToken={apiKey || ''}
            onLogout={logout}
            onNavigate={() => { }}
            modelConfigs={modelConfigs}
            isAdmin={user?.role === 'TENANT_ADMIN' || user?.role === 'SUPER_ADMIN'}
        />
    );
}
