import { Routes, Route, Navigate } from 'react-router-dom';
import { useWalletStore } from './store/wallet';
import Layout from './components/Layout';
import WelcomePage from './pages/Welcome';
import CreateWalletPage from './pages/CreateWallet';
import RecoverWalletPage from './pages/RecoverWallet';
import DashboardPage from './pages/Dashboard';
import SendPage from './pages/Send';
import ReceivePage from './pages/Receive';
import HistoryPage from './pages/History';
import SettingsPage from './pages/Settings';

function ProtectedRoute({ children }: { children: React.ReactNode }) {
  const isUnlocked = useWalletStore((state) => state.isUnlocked);

  if (!isUnlocked) {
    return <Navigate to="/" replace />;
  }

  return <>{children}</>;
}

export default function App() {
  return (
    <Routes>
      <Route path="/" element={<WelcomePage />} />
      <Route path="/create" element={<CreateWalletPage />} />
      <Route path="/recover" element={<RecoverWalletPage />} />

      <Route
        path="/wallet"
        element={
          <ProtectedRoute>
            <Layout />
          </ProtectedRoute>
        }
      >
        <Route index element={<DashboardPage />} />
        <Route path="send" element={<SendPage />} />
        <Route path="receive" element={<ReceivePage />} />
        <Route path="history" element={<HistoryPage />} />
        <Route path="settings" element={<SettingsPage />} />
      </Route>
    </Routes>
  );
}
