function Topicos({user}){ const SECCIONES=[ {icon:"👤",name:"Quien soy",subs:[ {name:"Mi historia y presente",qs:[ "Donde naciste y que significa ese lugar para ti?", "Como fue tu infancia? Y como es tu vida hoy?", "Como era tu familia cuando creciste? Como es ahora?", "Quien fue importante en tu ninez? Quien lo es hoy?", "Como describirias la etapa de vida en que estas ahora?", ]}, {name:"Educacion",qs:[ "Que estudiaste o estas estudiando?", "Que materia o tema te apasiona aprender?", "Hubo algun maestro o mentor que te marco?", ]}, {name:"Trabajo",qs:[ "A que te dedicas o te dedicabas?", "Cual fue tu primer trabajo y que te enseno?", "Que parte de tu trabajo te da o daba mas satisfaccion?", "Que harias si pudieras elegir cualquier carrera?", ]}, {name:"Salud",qs:[ "Que habitos cuidan tu cuerpo y tu mente hoy?", "Que has aprendido sobre tu salud con el tiempo?", "Que consejo darias sobre bienestar a alguien mas joven?", ]}, ]}, {icon:"💭",name:"Mis recuerdos",subs:[ {name:"Momentos",qs:[ "Cual es el recuerdo mas feliz de tu vida?", "Que lugar te trae recuerdos muy importantes?", "Que momento familiar quisieras conservar para siempre?", "Que momento te gustaria volver a vivir?", "Que recuerdo te hace sonreir de inmediato?", ]}, {name:"Recetas y tradiciones",qs:[ "Cual es tu receta favorita o la de tu familia?", "Quien te la enseno y en que ocasiones se preparaba?", "Que tradicion familiar es importante para ti?", ]}, ]}, {icon:"💪",name:"Lo que vivi",subs:[ {name:"Experiencias",qs:[ "Que momento cambio el rumbo de tu vida?", "Que experiencia dificil te hizo crecer?", "Que decision importante marco tu historia?", "De que logro te sientes mas orgulloso — no el mas grande, sino el mas tuyo?", "Que fracaso te enseno algo que ningun exito pudo ensenarte?", ]}, {name:"Proyectos y logros",qs:[ "Que proyecto construiste del que te enorgulleces?", "Que meta importante alcanzaste con esfuerzo?", "Que desafio superaste que no creias poder superar?", ]}, ]}, {icon:"❤️",name:"Lo que me mueve",subs:[ {name:"Relaciones",qs:[ "Que significa la familia para ti?", "Quien ha sido la persona mas importante en tu vida y por que?", "Hay alguien a quien nunca le dijiste lo que sentias? Que le dirias hoy?", "Como te gustaria que te recordaran las personas que te quieren?", ]}, {name:"Pasiones y hobbies",qs:[ "Que hobby o actividad te hace perder la nocion del tiempo?", "Que actividad te da paz y te recarga?", "Que frase representa tu forma de ver la vida?", "Que musica, libro o pelicula te ha marcado?", ]}, ]}, {icon:"🌱",name:"Lo que sueno",subs:[ {name:"Suenos",qs:[ "Que suenos te gustaria cumplir antes de partir?", "Que proyecto te gustaria iniciar o terminar?", "Que cosas aun te gustaria aprender o experimentar?", "Que le deseas al mundo?", ]}, ]}, {icon:"🌍",name:"Mi legado",subs:[ {name:"Mensaje al mundo",qs:[ "Como te gustaria ser recordado?", "Que valores quieres dejar a tu familia?", "Que consejo le darias a alguien que esta empezando su vida?", "Que mensaje dejarias a tus hijos o nietos?", "Hay algo que nunca dijiste y quisieras expresar?", "Cual es tu mensaje final para el mundo?", ]}, {name:"Documentos importantes",qs:[ "Hay algun documento familiar importante que quieras preservar?", "Hay cartas o escritos que quieras guardar aqui?", ]}, ]}, {icon:"✨",name:"Mi personalidad",subs:[ {name:"Como soy",qs:[ "Que te hace reir? Tienes algun chiste o historia que siempre cuentas?", "Que es absolutamente innegociable para ti?", "Que pequenas manias o habitos te definen?", "Tienes palabras o frases que usas mucho?", "De que tema podrias hablar horas sin parar?", "Como eres cuando estas feliz? Y cuando estas enojado?", "Eres mas de manana o de noche? Introvertido o extrovertido?", "En que crees tan fuerte que siempre lo defenderas?", ]}, ]}, ]; const [secIdx,setSecIdx]=useState(0); const [subIdx,setSubIdx]=useState(0); const [ans,setAns]=useState({}); const [media,setMedia]=useState({}); const [customQs,setCustomQs]=useState({}); const [uploading,setUploading]=useState({}); const [newQ,setNewQ]=useState(""); const [guardado,setGuardado]=useState(false); const [guardando,setGuardando]=useState(false); const [recording,setRecording]=useState(null); const [aiLoading,setAiLoading]=useState(false); const [aiSuggestions,setAiSuggestions]=useState({}); const mediaRecRef=useRef(null); useEffect(()=>{ const cargar=async()=>{ if(!user?.id) return; const {data}=await supabase.from("topicos").select("*").eq("user_id",user.id); if(!data||data.length===0) return; const loaded={}; const loadedMedia={}; data.forEach(row=>{ const k=row.topico+"__"+row.subtema+"__"+row.pregunta; loaded[k]=row.respuesta; if(row.media_url) loadedMedia[k]=row.media_url; }); setAns(loaded); setMedia(loadedMedia); }; cargar(); },[]); const guardar=async()=>{ if(!user?.id) return; setGuardando(true); const sec=SECCIONES[secIdx]; const sub=sec.subs[subIdx]; const allQs=[...sub.qs,...(customQs[secIdx+"-"+subIdx]||[])]; for(const q of allQs){ const k=sec.name+"__"+sub.name+"__"+q; const respuesta=ans[k]; if(!respuesta?.trim()) continue; await supabase.from("topicos").upsert({ user_id:user.id,topico:sec.name,subtema:sub.name, pregunta:q,respuesta:respuesta.trim(), privacidad:"privado",media_url:media[k]||null },{onConflict:"user_id,topico,subtema,pregunta"}); } setGuardando(false); setGuardado(true); setTimeout(()=>setGuardado(false),2500); }; const subirArchivo=async(k,file,tipo)=>{ if(!file||!user?.id) return; if(file.size>10485760){alert("Archivo maximo 10MB");return;} const ext=file.name.split(".").pop(); const path=user.id+"/"+tipo+"-"+Date.now()+"."+ext; const {error}=await supabase.storage.from("topicos-media").upload(path,file,{upsert:true}); if(error){alert("Error subiendo archivo");return;} const {data:{publicUrl}}=supabase.storage.from("topicos-media").getPublicUrl(path); setMedia(m=>({...m,[k]:publicUrl})); }; const [uploadingAudio,setUploadingAudio]=useState(false); const iniciarGrabacion=async(k)=>{ try{ const stream=await navigator.mediaDevices.getUserMedia({audio:true}); const types=["audio/mp4","audio/webm;codecs=opus","audio/webm","audio/ogg"]; const mimeType=types.find(t=>MediaRecorder.isTypeSupported(t))||"audio/webm"; const ext=mimeType.includes("mp4")?"mp4":mimeType.includes("ogg")?"ogg":"webm"; const mr=new MediaRecorder(stream,{mimeType}); const chunks=[]; mr.ondataavailable=e=>{if(e.data&&e.data.size>0)chunks.push(e.data);}; mr.onstop=async()=>{ setUploadingAudio(true); const blob=new Blob(chunks,{type:mimeType}); if(blob.size===0){alert("El audio esta vacio, intenta de nuevo");setUploadingAudio(false);return;} const path=user.id+"/audio-"+Date.now()+"."+ext; const {error}=await supabase.storage.from("topicos-media").upload(path,blob,{upsert:true,contentType:mimeType}); if(!error){ const {data:{publicUrl}}=supabase.storage.from("topicos-media").getPublicUrl(path); setMedia(m=>({...m,[k]:{...(m[k]||{}),audio:publicUrl}})); } else { alert("Error guardando audio: "+error.message); } setUploadingAudio(false); stream.getTracks().forEach(t=>t.stop()); }; mr.start(250); mediaRecRef.current=mr; setRecording(k); }catch(e){alert("No se pudo acceder al microfono: "+e.message);} }; const detenerGrabacion=()=>{ if(mediaRecRef.current){mediaRecRef.current.stop();setRecording(null);} }; const generarPreguntasIA=async()=>{ const sec=SECCIONES[secIdx]; const sub=sec.subs[subIdx]; const allQs=[...sub.qs,...(customQs[secIdx+"-"+subIdx]||[])]; const respuestas=allQs.filter(q=>ans[sec.name+"__"+sub.name+"__"+q]?.trim()).map(q=>q+": "+ans[sec.name+"__"+sub.name+"__"+q]).join(" "); if(!respuestas){alert("Escribe algo primero para que la IA pueda sugerir preguntas.");return;} setAiLoading(true); try{ const resp=await fetch("/api/chat",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({message:"Basandote en estas respuestas sobre "+sec.name+" - "+sub.name+", genera 3 preguntas nuevas, profundas y personales que ayuden a la persona a seguir explorando este tema. Solo devuelve las 3 preguntas numeradas, sin explicacion. "+respuestas,system:"Eres un biógrafo experto que ayuda a las personas a documentar su historia de vida. Genera preguntas profundas, personales y emotivas."})}); const data=await resp.json(); const text=data.text||""; const preguntas=text.split(" ").filter(l=>l.match(/^\d+\./)).map(l=>l.replace(/^\d+\.\s*/,"").trim()).filter(Boolean); const ckey=secIdx+"-"+subIdx; setAiSuggestions(s=>({...s,[ckey]:preguntas})); }catch(e){alert("Error conectando con IA");} setAiLoading(false); }; const agregarPreguntaPersonalizada=()=>{ if(!newQ.trim()) return; const ckey=secIdx+"-"+subIdx; setCustomQs(q=>({...q,[ckey]:[...(q[ckey]||[]),newQ.trim()]})); setNewQ(""); }; const agregarSugerenciaIA=(q)=>{ const ckey=secIdx+"-"+subIdx; setCustomQs(prev=>({...prev,[ckey]:[...(prev[ckey]||[]),q]})); setAiSuggestions(s=>({...s,[ckey]:(s[ckey]||[]).filter(x=>x!==q)})); }; const sec=SECCIONES[secIdx]; const sub=sec.subs[subIdx]; const ckey=secIdx+"-"+subIdx; const allQs=[...sub.qs,...(customQs[ckey]||[])]; const answered=allQs.filter(q=>ans[sec.name+"__"+sub.name+"__"+q]?.trim()).length; return(
Mi Vida
Tu historia completa
{SECCIONES.map((s,i)=>(
{setSecIdx(i);setSubIdx(0);}} style={{display:"flex",alignItems:"center",gap:8,padding:"9px 12px",cursor:"pointer",background:i===secIdx?C.navy:"none",borderLeft:i===secIdx?"3px solid "+C.gold:"3px solid transparent"}}> {s.icon}
{s.name}
{i===secIdx&&s.subs.map((sb,j)=>(
setSubIdx(j)} style={{padding:"6px 12px 6px 36px",cursor:"pointer",fontSize:11,color:j===subIdx?C.gold:C.text3,background:j===subIdx?"rgba(201,168,76,0.06)":"none",borderLeft:j===subIdx?"3px solid "+C.gold:"3px solid transparent"}}> {sb.name}
))}
))}
{sec.icon}
{sec.name}
{sub.name}
{answered}/{allQs.length} respondidas
{allQs.map((q,i)=>{ const k=sec.name+"__"+sub.name+"__"+q; const v=ans[k]||""; const mediaUrl=media[k]; return(
PREGUNTA {i+1}
{q}