52 lines
1.7 KiB
TypeScript
52 lines
1.7 KiB
TypeScript
import { createBrowserRouter, RouterProvider } from 'react-router-dom';
|
|
import { ColorFunctionProvider } from './ColorFunctionContext';
|
|
import { Notifications } from './components/Notifications';
|
|
import { Harmonies } from './pages/Harmonies';
|
|
import { Home } from './pages/Home';
|
|
import { LightenDarken } from './pages/LightenDarken';
|
|
import { MainLayout } from './pages/MainLayout';
|
|
import { Mixer } from './pages/Mixer';
|
|
import { NewScheme } from './pages/NewScheme';
|
|
import { SchemeDetail } from './pages/SchemeDetail';
|
|
import { SchemeNotFound } from './pages/SchemeNotFound';
|
|
import { Schemes } from './pages/Schemes';
|
|
import { TintsShades } from './pages/TintsShades';
|
|
import { Tones } from './pages/Tones';
|
|
import { Wheels } from './pages/Wheels';
|
|
|
|
const routes = createBrowserRouter([
|
|
{
|
|
path: '/',
|
|
element: <MainLayout />,
|
|
children: [
|
|
{ index: true, element: <Home /> },
|
|
{
|
|
path: 'schemes',
|
|
element: <Schemes />,
|
|
children: [
|
|
{ path: 'new', element: <NewScheme /> },
|
|
{ path: 'not-found', element: <SchemeNotFound /> },
|
|
{ path: ':id', element: <SchemeDetail /> },
|
|
],
|
|
},
|
|
{ path: 'harmonies', element: <Harmonies /> },
|
|
{ path: 'wheels', element: <Wheels /> },
|
|
{ path: 'tones', element: <Tones /> },
|
|
{ path: 'tints-shades', element: <TintsShades /> },
|
|
{ path: 'lighten-darken', element: <LightenDarken /> },
|
|
{ path: 'mixer', element: <Mixer /> },
|
|
],
|
|
},
|
|
]);
|
|
|
|
export function App() {
|
|
return (
|
|
<ColorFunctionProvider>
|
|
<Notifications>
|
|
<title>Color Lab</title>
|
|
<RouterProvider router={routes}></RouterProvider>
|
|
</Notifications>
|
|
</ColorFunctionProvider>
|
|
);
|
|
}
|