// fs-app.jsx — hash router + layout for Short's Resort Field Station (SRFS)

function parseHash(){
  let h = (location.hash||'').replace(/^#\/?/, '').trim();
  if(!h) return { route:'home', arg:null };
  const parts = h.split('/');
  return { route:parts[0], arg:parts[1]||null };
}

function App(){
  const [loc, setLoc] = React.useState(parseHash());
  const [session, setSession] = React.useState(null);
  const [showSignIn, setShowSignIn] = React.useState(false);

  React.useEffect(()=>{
    const on = ()=>{ setLoc(parseHash()); window.scrollTo({top:0,behavior:'auto'}); };
    window.addEventListener('hashchange', on);
    return ()=>window.removeEventListener('hashchange', on);
  },[]);

  const go = (to)=>{ location.hash = '#/'+(to==='home'?'':to); };
  const openSignIn = ()=> setShowSignIn(true);
  const signOut = ()=> setSession(null);
  const onSignIn = (op)=>{ setSession(op); setShowSignIn(false); };

  const { route, arg } = loc;
  let view;
  switch(route){
    case 'home':    view = <Frontispiece go={go} onSignIn={openSignIn} session={session} onSignOut={signOut}/>; break;
    case 'journal': view = arg ? <JournalEntry slug={arg} go={go}/> : <JournalView go={go}/>; break;
    case 'land':    view = <LandView/>; break;
    case 'ii':      view = <InstrumentsView go={go} session={session}/>; break;
    case 'library': view = <LibraryView go={go}/>; break;
    case 'species': view = <SpeciesPage slug={arg} go={go}/>; break;
    case 'about':   view = <AboutView go={go}/>; break;
    case 'support': view = <SupportView go={go}/>; break;
    // legacy routes → new homes
    case 'station': case 'instrument': case 'source': view = <InstrumentsView go={go} session={session}/>; break;
    default:        view = <NotFound go={go}/>;
  }

  return (
    <React.Fragment>
      <Masthead route={route} go={go} session={session} onSignIn={openSignIn}/>
      <main>{view}</main>
      <Footer go={go} session={session} onSignIn={openSignIn} onSignOut={signOut}/>
      {showSignIn && <SignIn onClose={()=>setShowSignIn(false)} onSignIn={onSignIn}/>}
    </React.Fragment>
  );
}

ReactDOM.createRoot(document.getElementById('root')).render(<App/>);
