// Orchestrator — switches pages, with hash-based routing for refresh persistence

const App = () => {
  const parseHash = () => {
    const h = (location.hash || '#home').slice(1);
    const [page, ...rest] = h.split('/');
    return { page: page || 'home', id: rest[0] || null };
  };

  const [route, setRoute] = React.useState(parseHash);

  React.useEffect(() => {
    const handler = () => setRoute(parseHash());
    window.addEventListener('hashchange', handler);
    return () => window.removeEventListener('hashchange', handler);
  }, []);

  const go = (page, params = {}) => {
    const id = params.id ? `/${params.id}` : '';
    location.hash = `#${page}${id}`;
    window.scrollTo(0, 0);
  };

  switch (route.page) {
    case 'catalog': return <PageCatalog go={go} />;
    case 'product': return <PageProduct id={route.id} go={go} />;
    case 'compare': return <PageCompare go={go} />;
    case 'home':
    default: return <PageHome go={go} />;
  }
};

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