Styles, API calls, and more

src/App.tsx

@@ -2,6 +2,14 @@ import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import './App.css'
 import Homepage from './pages/homepage/Homepage'
 import { MantineProvider } from '@mantine/core'
+import {
+	Route,
+	createBrowserRouter,
+	createRoutesFromElements,
+	RouterProvider,
+	Navigate,
+} from "react-router-dom";
+import Settings from './pages/settings/Settings';
 
 function App() {
   const queryClient = new QueryClient({
@@ -13,10 +21,21 @@ function App() {
     },
   });
 
+  const router = createBrowserRouter(
+		createRoutesFromElements(
+			<Route>
+				<Route path="/trigger" element={<Homepage />}></Route>
+				<Route path="/trigger/settings" element={<Settings />}></Route>
+			</Route>,
+		),
+	);
+
   return (
     <QueryClientProvider client={queryClient}>
-      <MantineProvider>
-        <Homepage />
+      <MantineProvider theme={{
+        fontFamily: '-apple-system,Jost,BlinkMacSystemFont,Helvetica Neue,Roboto,sans-serif',
+      }}>
+        <RouterProvider router={router} />
       </MantineProvider>
     </QueryClientProvider>
   )