import React, { useState, useEffect } from 'react';
import { createRoot } from 'react-dom/client';
import './index.css';
import { App } from './App';
import { GestureV2Demo } from './GestureV2Demo';

function Router() {
    const [route, setRoute] = useState(window.location.hash);

    useEffect(() => {
        const onHash = () => setRoute(window.location.hash);
        window.addEventListener('hashchange', onHash);
        return () => window.removeEventListener('hashchange', onHash);
    }, []);

    if (route === '#v2') {
        return <GestureV2Demo />;
    }

    return <App />;
}

createRoot(document.getElementById('root')!).render(
    <React.StrictMode>
        <Router />
    </React.StrictMode>
);
