feat: implement Hybrid AI architecture for admin norm builder

This commit is contained in:
2026-06-23 18:40:41 +00:00
parent 3f8d8d6e34
commit 3298cd8c5d
3 changed files with 70 additions and 5 deletions
+19
View File
@@ -19,6 +19,8 @@ const App: React.FC = () => {
const [endpoint, setEndpoint] = useState<string>('');
const [provider, setProvider] = useState<AIProvider>('gemini');
const [model, setModel] = useState<string>('gemini-2.5-flash');
const [adminApiKey, setAdminApiKey] = useState<string>('');
const [adminModel, setAdminModel] = useState<string>('claude-3.5-sonnet-20241022');
const [hasKey, setHasKey] = useState<boolean>(false);
const [reportsData, setReportsData] = useState<ReportData[] | null>(null);
const [isLoading, setIsLoading] = useState(false);
@@ -50,6 +52,9 @@ const App: React.FC = () => {
fetch('/api/config')
.then(res => res.json())
.then(config => {
if (config.adminApiKey) setAdminApiKey(config.adminApiKey);
if (config.adminModel) setAdminModel(config.adminModel);
if (config.provider) {
setProvider(config.provider);
if (config.apiKey) setApiKey(config.apiKey);
@@ -224,6 +229,20 @@ const App: React.FC = () => {
apiKey={apiKey}
model={model}
endpoint={endpoint}
adminApiKey={adminApiKey}
adminModel={adminModel}
onAdminConfigSave={(key, mdl) => {
setAdminApiKey(key);
setAdminModel(mdl);
fetch('/api/config', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
provider, apiKey, model, endpoint,
adminApiKey: key, adminModel: mdl
})
});
}}
/>
) : (!hasKey || showSetup) ? (
<ApiKeySetup onKeySave={handleKeySave} onCancel={hasKey ? () => setShowSetup(false) : undefined} />
+3
View File
@@ -8,6 +8,9 @@ interface AdminPanelProps {
provider: AIProvider;
model: string;
endpoint?: string;
adminApiKey: string;
adminModel: string;
onAdminConfigSave: (key: string, model: string) => void;
}
export const AdminPanel: React.FC<AdminPanelProps> = (props) => {
+48 -5
View File
@@ -8,9 +8,12 @@ interface AdminStandardsProps {
provider: AIProvider;
model: string;
endpoint?: string;
adminApiKey: string;
adminModel: string;
onAdminConfigSave: (key: string, model: string) => void;
}
export const AdminStandards: React.FC<AdminStandardsProps> = ({ apiKey, provider, model, endpoint }) => {
export const AdminStandards: React.FC<AdminStandardsProps> = ({ apiKey, provider, model, endpoint, adminApiKey, adminModel, onAdminConfigSave }) => {
const [categories, setCategories] = useState<Category[]>([]);
const [selectedCategory, setSelectedCategory] = useState<string>('');
const [standards, setStandards] = useState<any[]>([]);
@@ -21,6 +24,9 @@ export const AdminStandards: React.FC<AdminStandardsProps> = ({ apiKey, provider
const [generatedJson, setGeneratedJson] = useState('');
const [jsonError, setJsonError] = useState<string | null>(null);
const [localAdminKey, setLocalAdminKey] = useState(adminApiKey);
const [localAdminModel, setLocalAdminModel] = useState(adminModel);
useEffect(() => {
fetchCategories();
}, []);
@@ -66,7 +72,8 @@ export const AdminStandards: React.FC<AdminStandardsProps> = ({ apiKey, provider
setJsonError(null);
try {
const jsonObj = await buildStandardWithAI(
{ provider, apiKey, model, endpoint },
// Use the admin config if provided, otherwise fallback to the global one
localAdminKey ? { provider: 'openrouter', apiKey: localAdminKey, model: localAdminModel } : { provider, apiKey, model, endpoint },
standardName,
cat.description
);
@@ -113,6 +120,42 @@ export const AdminStandards: React.FC<AdminStandardsProps> = ({ apiKey, provider
return (
<div className="animate-fade-in space-y-8">
{/* Admin Engine Config */}
<div className="bg-slate-50 dark:bg-slate-800/50 rounded-xl border border-slate-200 dark:border-slate-700 p-5">
<h3 className="text-sm font-bold text-slate-700 dark:text-slate-300 mb-3">Motor de Engenharia IA (Opcional)</h3>
<p className="text-xs text-slate-500 mb-4">
Para criar normas perfeitamente estruturadas, recomendamos utilizar um modelo avançado como Claude 3.5 Sonnet ou GPT-4o via OpenRouter, separado do modelo de leitura rápida usado na página inicial.
</p>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4 items-end">
<div>
<label className="block text-xs font-medium text-slate-600 dark:text-slate-400 mb-1">OpenRouter API Key (Admin)</label>
<input
type="password"
value={localAdminKey}
onChange={e => setLocalAdminKey(e.target.value)}
placeholder="sk-or-v1-..."
className="w-full rounded-md border-slate-300 dark:border-slate-600 bg-white dark:bg-slate-700 px-3 py-1.5 text-sm"
/>
</div>
<div>
<label className="block text-xs font-medium text-slate-600 dark:text-slate-400 mb-1">Modelo de Alta Precisão</label>
<input
type="text"
value={localAdminModel}
onChange={e => setLocalAdminModel(e.target.value)}
placeholder="ex: anthropic/claude-3.5-sonnet"
className="w-full rounded-md border-slate-300 dark:border-slate-600 bg-white dark:bg-slate-700 px-3 py-1.5 text-sm font-mono"
/>
</div>
</div>
<button
onClick={() => onAdminConfigSave(localAdminKey, localAdminModel)}
className="mt-3 px-4 py-1.5 bg-slate-200 dark:bg-slate-700 hover:bg-slate-300 dark:hover:bg-slate-600 text-slate-700 dark:text-slate-200 text-xs font-bold rounded transition-all"
>
Salvar Cérebro Admin na Memória
</button>
</div>
{/* Selector */}
<div className="bg-white dark:bg-slate-800 rounded-xl shadow-sm border border-slate-200 dark:border-slate-700 p-5">
<label htmlFor="category-select" className="block text-sm font-medium text-slate-700 dark:text-slate-300 mb-2">Selecione a Categoria de Material</label>
@@ -152,14 +195,14 @@ export const AdminStandards: React.FC<AdminStandardsProps> = ({ apiKey, provider
<button
onClick={handleGenerate}
disabled={isGenerating || !standardName || !apiKey}
disabled={isGenerating || !standardName || !(localAdminKey || apiKey)}
className="w-full bg-indigo-600 hover:bg-indigo-700 disabled:opacity-50 text-white font-bold py-2.5 rounded-lg transition-all"
>
{isGenerating ? 'Analisando e Extraindo Limites...' : 'Gerar Estrutura com IA'}
</button>
{!apiKey && (
<p className="text-red-500 text-xs">Configure a Chave da API no painel inicial primeiro.</p>
{!(localAdminKey || apiKey) && (
<p className="text-red-500 text-xs">Configure uma Chave de IA (Admin ou Global) primeiro.</p>
)}
{jsonError && (