Updated UI with accounts and fixed routing

ui/src/main.tsx

@@ -4,6 +4,10 @@ import './index.css';
 import App from './App.tsx';
 import { createTheme, MantineProvider } from '@mantine/core';
 import { Notifications } from '@mantine/notifications';
+import { UserProvider } from '@components/context/UserProvider.tsx';
+import { BrowserRouter, Route, Routes } from 'react-router';
+import { Profile } from '@components/Profile.tsx';
+import { Administration } from '@components/Administration.tsx';
 
 const theme = createTheme({
   fontFamily: 'Inter, sans-serif'
@@ -11,9 +15,17 @@ const theme = createTheme({
 
 createRoot(document.getElementById('root')!).render(
   <StrictMode>
-    <MantineProvider theme={theme} defaultColorScheme={'dark'}>
-      <Notifications zIndex={2000} />
-      <App />
-    </MantineProvider>
+    <BrowserRouter>
+      <MantineProvider theme={theme} defaultColorScheme={'dark'}>
+        <Notifications zIndex={2000} />
+        <UserProvider>
+          <Routes>
+            <Route path='/' element={<App />} />
+            <Route path='/profile' element={<Profile />} />
+            <Route path='/administration' element={<Administration />} />
+          </Routes>
+        </UserProvider>
+      </MantineProvider>
+    </BrowserRouter>
   </StrictMode>
 );