// ============================================================
// Direction B standalone — multi-page router
// All pages live behind in-app routing with a navigation stack.
// ============================================================

const { useState, useEffect, useRef } = React;

function AppB() {
  const [stack, setStack] = useState([{ route: 'home', params: {} }]);
  const top = stack[stack.length - 1];

  const navigate = (route, params = {}) => {
    if (!route) return;
    setStack(s => [...s, { route, params }]);
    // Scroll to top on navigation
    window.scrollTo({ top: 0, behavior: 'instant' });
  };

  const back = () => {
    setStack(s => s.length > 1 ? s.slice(0, -1) : s);
    window.scrollTo({ top: 0, behavior: 'instant' });
  };

  // Browser back/forward (Esc takes us home for prototype context)
  useEffect(() => {
    const onKey = (e) => {
      if (e.altKey && e.key === 'ArrowLeft') { e.preventDefault(); back(); }
    };
    window.addEventListener('keydown', onKey);
    return () => window.removeEventListener('keydown', onKey);
  }, []);

  // Stash route in URL hash for shareability & reload-persistence
  useEffect(() => {
    const hash = top.route + (Object.keys(top.params || {}).length ? '?' + new URLSearchParams(top.params).toString() : '');
    if (location.hash.slice(1) !== hash) history.replaceState(null, '', '#' + hash);
  }, [top]);

  // Read hash on first load
  useEffect(() => {
    const hash = location.hash.slice(1);
    if (!hash) return;
    const [route, qs] = hash.split('?');
    const params = qs ? Object.fromEntries(new URLSearchParams(qs)) : {};
    if (route !== 'home') setStack([{ route: 'home', params: {} }, { route, params }]);
  }, []);

  const Page = pageFor(top.route);
  return (
    <div key={top.route + JSON.stringify(top.params)} className="fade-in">
      <Page onNavigate={navigate} onBack={back} params={top.params}/>
    </div>
  );
}

function pageFor(route) {
  switch (route) {
    case 'home': return (props) => <HomeB {...props}/>;
    case 'products': return ProductsIndex;
    case 'product': return ProductPage;
    case 'applications': return ApplicationsHub;
    case 'application': return ApplicationDetail;
    case 'facilities': case 'map': return FacilitiesMap;
    case 'resources': return ResourcesHub;
    case 'sds': return SDSLibrary;
    case 'about': return AboutPage;
    case 'sustainability': return SustainabilityPage;
    case 'newsroom': return NewsroomPage;
    case 'article': return ArticlePage;
    case 'careers': return CareersPage;
    case 'contact': return ContactPage;
    case 'rfq': return RfqWizard;
    default: return (props) => <HomeB {...props}/>;
  }
}

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