-export default function App(){const {locale,setLocale,t}=useI18n(),[job,setJob]=useState<Job|null>(null),[id,setId]=useState(()=>new URLSearchParams(location.search).get("job"));const refresh=useCallback(async()=>{if(id)setJob(await getJob(id))},[id]);useEffect(()=>{if(!id)return;void refresh();const timer=setInterval(()=>{if(job?.status!=="completed"&&job?.status!=="failed"&&job?.status!=="canceled")void refresh()},2500);return()=>clearInterval(timer)},[id,job?.status,refresh]);async function create(data:FormData){const result=await createJob(data);history.replaceState(null,"",`/?job=${result.id}`);setId(result.id)}async function retry(){if(id){await retryJob(id);setJob(job?{...job,status:"queued",progress:5,stage:"等待重试"}:null)}}async function cancel(){if(id){await cancelJob(id);setJob(job?{...job,status:"canceled",stage:"已取消"}:null)}}function reset(){history.replaceState(null,"","/");setId(null);setJob(null)}return <><header><a className="brand" href="/"><span>PF</span> PodForge</a><div className="header-actions"><div className="tag">{t.tagline}</div><div className="locale-switch" role="group" aria-label={t.languageLabel}><button type="button" aria-pressed={locale==="zh-CN"} onClick={()=>setLocale("zh-CN")}>{t.zhShort}</button><button type="button" aria-pressed={locale==="en-US"} onClick={()=>setLocale("en-US")}>{t.enShort}</button></div></div></header><main><section className="hero"><p className="eyebrow">AI PODCAST STUDIO</p><h1>{t.heroLead} <em>{t.heroEmphasis}</em></h1><p>{t.heroCopy}</p></section><div className="layout"><JobForm onCreate={create}/><aside><JobPanel job={job} onRetry={retry} onCancel={cancel} onReset={reset}/></aside></div></main><footer>PodForge <span>·</span> Powered securely on Cloudflare <span>·</span> <a href="https://1991421.cn">Created by Alan H</a></footer></>}
0 commit comments