import { Routes, Route, Link } from 'react-router-dom';
import Layout from './components/Layout';
import Home from './pages/Home';
import Blocks from './pages/Blocks';
import Block from './pages/Block';
import Transaction from './pages/Transaction';
import Mempool from './pages/Mempool';
import Address from './pages/Address';
import DAG from './pages/DAG';
import Network from './pages/Network';
import Search from './pages/Search';

export default function App() {
  return (
    <Layout>
      <Routes>
        <Route path="/" element={<Home />} />
        <Route path="/blocks" element={<Blocks />} />
        <Route path="/block/:hash" element={<Block />} />
        <Route path="/tx/:txId" element={<Transaction />} />
        <Route path="/mempool" element={<Mempool />} />
        <Route path="/address/:address" element={<Address />} />
        <Route path="/dag" element={<DAG />} />
        <Route path="/network" element={<Network />} />
        <Route path="/search" element={<Search />} />
        <Route path="*" element={<NotFound />} />
      </Routes>
    </Layout>
  );
}

function NotFound() {
  return (
    <div className="text-center py-20">
      <h1 className="text-6xl font-bold text-gray-700 mb-4">404</h1>
      <p className="text-xl text-gray-400 mb-6">Page not found</p>
      <Link to="/" className="btn btn-primary">
        Go Home
      </Link>
    </div>
  );
}