hotschpotsh/Pottery-website/App.tsx

34 lines
1.1 KiB
TypeScript

import React, { Suspense, lazy } from 'react';
import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';
import Header from './components/Header';
import Footer from './components/Footer';
import ScrollToTop from './components/ScrollToTop';
import RouteTransition from './components/RouteTransition';
// Lazy load pages for better performance
const Home = lazy(() => import('./pages/Home'));
const Collections = lazy(() => import('./pages/Collections'));
const Atelier = lazy(() => import('./pages/Atelier'));
const Editorial = lazy(() => import('./pages/Editorial'));
function App() {
return (
<Router>
<ScrollToTop />
<Header />
<RouteTransition>
<Suspense fallback={<div className="h-screen w-full bg-stone-100 dark:bg-stone-900" />}>
<Routes>
<Route path="/" element={<Home />} />
<Route path="/collections" element={<Collections />} />
<Route path="/atelier" element={<Atelier />} />
<Route path="/editorial" element={<Editorial />} />
</Routes>
</Suspense>
</RouteTransition>
<Footer />
</Router>
);
}
export default App;