// 1Radar Hybrid — V1 power features rebuilt in V3 visual language // AI Rail (right panel), Cmd+K palette, Floating AI button, Selection bar // ---- Shared chat utilities ---- const API_BASE = (window.APP_CONFIG && window.APP_CONFIG.API_BASE) || 'http://localhost:3001/api'; const CHAT_API = `${API_BASE}/chat`; const apiFetch = async (path, method = 'GET', body = null) => { const token = localStorage.getItem('1radar_token'); const opts = { method, headers: { 'Authorization': `Bearer ${token}` } }; if (body) { opts.headers['Content-Type'] = 'application/json'; opts.body = JSON.stringify(body); } const res = await fetch(`${API_BASE}${path}`, opts); if (!res.ok) { const e = await res.json().catch(() => ({})); throw new Error(e.error || 'Request failed'); } return res.json(); }; // ---- Folder utilities ---- // System folders are virtual (not stored in DB). const SYSTEM_FOLDERS = [ { id: 'all', name: 'All saved', icon: 'bookmark', system: true, count: 0 }, { id: 'trash', name: 'Trash', icon: 'trash', system: true, count: 0 }, ]; // Fetches user folders from API, merges with system folders, // updates window.SAVE_FOLDERS_V3 and dispatches 'folders-updated'. const loadFolders = async () => { try { const folders = await apiFetch('/folders'); window.SAVE_FOLDERS_V3 = [...SYSTEM_FOLDERS, ...folders]; window.dispatchEvent(new CustomEvent('folders-updated')); } catch {} }; window.loadFolders = loadFolders; // ---- Streams a chat completion. onChunk(text), onDone(), onError(msg) ---- const streamChat = async ({ messages, model = 'gemini', conversationId, attachments, onChunk, onDone, onError, signal }) => { const token = localStorage.getItem('1radar_token'); let res; try { res = await fetch(`${CHAT_API}/completions`, { method: 'POST', headers: { 'Content-Type': 'application/json', 'Authorization': `Bearer ${token}` }, body: JSON.stringify({ messages, model, conversation_id: conversationId, attachments, stream: true }), signal, }); } catch (err) { if (err.name !== 'AbortError') onError('Cannot reach the backend.'); return; } if (!res.ok) { const data = await res.json().catch(() => ({})); onError(data.error || 'Request failed'); return; } const reader = res.body.getReader(); const decoder = new TextDecoder(); let buffer = ''; while (true) { const { done, value } = await reader.read(); if (done) break; buffer += decoder.decode(value, { stream: true }); const lines = buffer.split('\n'); buffer = lines.pop(); for (const line of lines) { if (!line.startsWith('data: ')) continue; const raw = line.slice(6).trim(); if (raw === '[DONE]') { onDone(); return; } try { const chunk = JSON.parse(raw); const content = chunk.choices?.[0]?.delta?.content; if (content) onChunk(content); } catch {} } } onDone(); }; // Render message text: handles newlines + markdown images const MsgContent = ({ text }) => { const parts = text.split(/(!\[.*?\]\(https?:\/\/[^\s)]+\))/g); return React.createElement('span', null, ...parts.map((part, i) => { const m = part.match(/!\[(.*?)\]\((https?:\/\/[^\s)]+)\)/); if (m) return React.createElement('img', { key: i, src: m[2], alt: m[1], style: { display: 'block', maxWidth: '100%', borderRadius: 10, marginTop: 8 }, }); return React.createElement('span', { key: i, style: { whiteSpace: 'pre-wrap' } }, part); }) ); }; // ---- Floating AI Button (bottom-right) ---- const FloatingAI = ({ onClick, hidden }) => { if (hidden) return null; return ( ); }; // ---- AI Rail — right panel ---- const AIRailV3 = ({ open, onClose, context, onPin }) => { const WELCOME = "Hi — I'm Radar AI. I can analyze ads, summarize brand strategy, draft hooks or generate matching images. What are we working on?"; const [messages, setMessages] = React.useState([{ role: 'assistant', text: WELCOME }]); const [input, setInput] = React.useState(''); const [loading, setLoading] = React.useState(false); const scrollRef = React.useRef(null); const abortRef = React.useRef(null); React.useEffect(() => { if (scrollRef.current) scrollRef.current.scrollTop = scrollRef.current.scrollHeight; }, [messages]); // Inject context as new user message when it changes React.useEffect(() => { if (context) { setMessages([{ role: 'assistant', text: WELCOME }]); } }, [context]); const send = (override) => { const text = (override ?? input).trim(); if (!text || loading) return; setInput(''); setLoading(true); const userMsg = { role: 'user', text }; const apiMessages = [...messages, userMsg] .filter(m => m.text) .map(m => ({ role: m.role, content: m.role === 'user' && context && messages.length <= 1 ? `Context: ${context}\n\n${m.text}` : m.text })); setMessages(m => [...m, userMsg, { role: 'assistant', text: '' }]); const controller = new AbortController(); abortRef.current = controller; streamChat({ messages: apiMessages, signal: controller.signal, onChunk: (chunk) => { setMessages(m => { const next = [...m]; next[next.length - 1] = { ...next[next.length - 1], text: next[next.length - 1].text + chunk }; return next; }); }, onDone: () => setLoading(false), onError: (err) => { setMessages(m => { const next = [...m]; next[next.length - 1] = { ...next[next.length - 1], text: `Error: ${err}` }; return next; }); setLoading(false); }, }); }; if (!open) return null; return (