46 lines
1.6 KiB
JavaScript
46 lines
1.6 KiB
JavaScript
import { BrowserRouter, Routes, Route, Link } from 'react-router-dom'
|
|
import { lazy, Suspense } from 'react'
|
|
import Layout from './components/Layout'
|
|
import Loading from './components/Loading'
|
|
import ErrorBoundary from './components/ErrorBoundary'
|
|
import { BRAND_PRIMARY } from './config'
|
|
|
|
const Home = lazy(() => import('./pages/Home'))
|
|
const About = lazy(() => import('./pages/About'))
|
|
const Services = lazy(() => import('./pages/Services'))
|
|
const ServiceDetail = lazy(() => import('./pages/ServiceDetail'))
|
|
const Project = lazy(() => import('./pages/Project'))
|
|
const Contact = lazy(() => import('./pages/Contact'))
|
|
|
|
function NotFound() {
|
|
return (
|
|
<div style={{ padding: '120px 24px', textAlign: 'center' }}>
|
|
<h1>404 — Page Not Found</h1>
|
|
<p>The page you're looking for doesn't exist.</p>
|
|
<Link to="/" style={{ color: BRAND_PRIMARY }}>← Back to Home</Link>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default function App() {
|
|
return (
|
|
<BrowserRouter>
|
|
<ErrorBoundary>
|
|
<Suspense fallback={<Loading />}>
|
|
<Routes>
|
|
<Route element={<Layout />}>
|
|
<Route path="/" element={<Home />} />
|
|
<Route path="/about" element={<About />} />
|
|
<Route path="/service" element={<Services />} />
|
|
<Route path="/service/:slug" element={<ServiceDetail />} />
|
|
<Route path="/project" element={<Project />} />
|
|
<Route path="/contact" element={<Contact />} />
|
|
<Route path="*" element={<NotFound />} />
|
|
</Route>
|
|
</Routes>
|
|
</Suspense>
|
|
</ErrorBoundary>
|
|
</BrowserRouter>
|
|
)
|
|
}
|