import { useEffect, useMemo, useRef, useState } from 'react'; const TABS = [ 'House', 'Generals', 'Captains', 'Master Chiefs', 'Detectors', 'Intake', 'Capital State', 'Calculations' ]; function formatError(err) { if (!err) return 'Unknown error'; if (typeof err === 'string') return err; return err.message || 'Unknown error'; } function blobToBase64(blob) { return new Promise((resolve, reject) => { const reader = new FileReader(); reader.onloadend = () => { try { const result = String(reader.result || ''); const parts = result.split(','); resolve(parts[1] || ''); } catch (err) { reject(err); } }; reader.onerror = reject; reader.readAsDataURL(blob); }); } export default function Home() { const [input, setInput] = useState(''); const [messages, setMessages] = useState([ { role: 'assistant', content: 'I am AURA. The gateway is live. Speak, and I will answer here.' } ]); const [threadId, setThreadId] = useState(null); const [status, setStatus] = useState(null); const [activeTab, setActiveTab] = useState('House'); const [isSending, setIsSending] = useState(false); const [lastError, setLastError] = useState(''); const [selectedFile, setSelectedFile] = useState(null); const [audioBlob, setAudioBlob] = useState(null); const [audioTranscript, setAudioTranscript] = useState(''); const [isRecording, setIsRecording] = useState(false); const [isTranscribing, setIsTranscribing] = useState(false); const [isMobile, setIsMobile] = useState(false); const outputRef = useRef(null); const fileInputRef = useRef(null); const mediaRecorderRef = useRef(null); const audioChunksRef = useRef([]); const streamRef = useRef(null); useEffect(() => { function handleResize() { setIsMobile(window.innerWidth < 900); } handleResize(); window.addEventListener('resize', handleResize); return () => window.removeEventListener('resize', handleResize); }, []); useEffect(() => { if (outputRef.current) { outputRef.current.scrollTop = outputRef.current.scrollHeight; } }, [messages]); const canSend = useMemo(() => { return input.trim().length > 0 && !isSending; }, [input, isSending]); function appendMessage(role, content) { setMessages(prev => [...prev, { role, content }]); } function handleFileChange(event) { const file = event.target.files && event.target.files[0]; if (!file) return; setSelectedFile(file); appendMessage('user', `File attached: ${file.name} (${Math.round(file.size / 1024)} KB)`); } async function startRecording() { try { setLastError(''); setAudioTranscript(''); const stream = await navigator.mediaDevices.getUserMedia({ audio: true }); streamRef.current = stream; const recorder = new MediaRecorder(stream); mediaRecorderRef.current = recorder; audioChunksRef.current = []; recorder.ondataavailable = event => { if (event.data && event.data.size > 0) { audioChunksRef.current.push(event.data); } }; recorder.onstop = () => { const blob = new Blob(audioChunksRef.current, { type: 'audio/webm' }); setAudioBlob(blob); appendMessage('user', `Audio recorded: ${Math.round(blob.size / 1024)} KB`); if (streamRef.current) { streamRef.current.getTracks().forEach(track => track.stop()); streamRef.current = null; } }; recorder.start(); setIsRecording(true); } catch (err) { setLastError('Microphone access failed: ' + formatError(err)); } } function stopRecording() { try { if (mediaRecorderRef.current && isRecording) { mediaRecorderRef.current.stop(); } } catch (err) { setLastError('Microphone stop failed: ' + formatError(err)); } finally { setIsRecording(false); } } async function transcribeAudio() { if (!audioBlob || isTranscribing) return; setIsTranscribing(true); setLastError(''); try { const base64Audio = await blobToBase64(audioBlob); const res = await fetch('/api/whisper', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ audio: base64Audio, context: { mimeType: audioBlob.type || 'audio/webm', activeSurface: activeTab } }) }); const data = await res.json(); if (!res.ok) { throw new Error(data?.message || data?.error || 'Whisper request failed'); } const transcript = data?.text || ''; setAudioTranscript(transcript); if (transcript) { appendMessage('assistant', `Governed transcript: ${transcript}`); setInput(transcript); } else { appendMessage('assistant', 'No governed transcript was returned.'); } } catch (err) { setLastError('Transcription failed: ' + formatError(err)); appendMessage('assistant', 'I am AURA. Audio transcription failed: ' + formatError(err)); } finally { setIsTranscribing(false); } } async function sendMessage() { const trimmed = input.trim(); if (!trimmed || isSending) return; appendMessage('user', trimmed); setInput(''); setIsSending(true); setLastError(''); try { const payload = { message: trimmed, thread_id: threadId, history: messages.slice(-8), active_surface: activeTab, file: selectedFile ? { name: selectedFile.name, size: selectedFile.size, type: selectedFile.type, lastModified: selectedFile.lastModified || null } : null, audio: audioBlob ? { type: audioBlob.type, size: audioBlob.size } : null, transcript: audioTranscript || null }; const res = await fetch('/api/embodiment', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(payload) }); let data; try { data = await res.json(); } catch (jsonErr) { throw new Error('Non-JSON response from embodiment'); } if (!res.ok) { throw new Error(data?.message || data?.error || 'Embodiment request failed'); } if (data?.meta?.thread_id) { setThreadId(data.meta.thread_id); } appendMessage('assistant', data?.response || 'AURA returned no visible response.'); setStatus(data?.governance || null); setSelectedFile(null); setAudioBlob(null); setAudioTranscript(''); if (fileInputRef.current) { fileInputRef.current.value = ''; } } catch (err) { const msg = formatError(err); setLastError(msg); appendMessage('assistant', 'I am AURA. An error occurred: ' + msg); } finally { setIsSending(false); } } function onKeyDown(e) { if (e.key === 'Enter' && !e.shiftKey) { e.preventDefault(); sendMessage(); } } return (
AURAL-M

AURA Gateway

Primary communication surface for embodiment, mediator, vault, and Mars hierarchy.
{!isMobile && ( )}
Active Surface
{activeTab}
Thread: {threadId || 'not established yet'}
{isMobile && (
{TABS.map(tab => ( ))}
)}
{messages.map((m, i) => (
{m.role === 'user' ? 'You' : 'AURA'}
{m.content}
))}