feat: add example components and system pages for UI showcase

- Introduced HeaderExample component for header display.
- Created StyleGuideOne, StyleGuideTwo, and StyleGuideThree components showcasing various UI elements and layouts.
- Added system pages: ComingSoon, Forbidden, Maintenance, and NotFound for better user experience during different states.
- Updated index.ts to export new components for easier access.
This commit is contained in:
Firman Ramdhani
2026-01-19 16:04:07 +07:00
parent 2313284aab
commit 23c869e574
15 changed files with 838 additions and 14 deletions
+5 -2
View File
@@ -1,5 +1,6 @@
import { lazy, Suspense } from 'react';
import { BrowserRouter, Navigate, Route, Routes } from 'react-router-dom';
import { NotFound, Forbidden, Maintenance, ComingSoon } from '@repo/ui';
const AuthModule = lazy(() => import('./auth'));
const AppModule = lazy(() => import('./modules'));
@@ -11,8 +12,10 @@ export default function App() {
<Routes>
<Route path="/auth/*" element={<AuthModule />} />
<Route path="/app/*" element={<AppModule />} />
{/* <Route path="/404" element={<NotFoundPage />} />
<Route path="/403" element={<ForbiddenPage />} /> */}
<Route path="/404" element={<NotFound />} />
<Route path="/403" element={<Forbidden />} />
<Route path="/maintenance" element={<Maintenance />} />
<Route path="/coming-soon" element={<ComingSoon />} />
<Route path="*" element={<Navigate to="/app" />} />
</Routes>
</Suspense>
+5 -2
View File
@@ -1,10 +1,13 @@
import { DateServiceComponent } from '@repo/ui';
import { DateServiceExample, StyleGuideOne, StyleGuideTree, StyleGuideTwo } from '@repo/ui';
import { Route, Routes } from 'react-router-dom';
export default function AppModule() {
return (
<Routes>
<Route path="/example/*" element={<DateServiceComponent />} />
<Route path="/example/*" element={<DateServiceExample />} />
<Route path="/guide-1/*" element={<StyleGuideOne />} />
<Route path="/guide-2/*" element={<StyleGuideTwo />} />
<Route path="/guide-3/*" element={<StyleGuideTree />} />
</Routes>
);
}