diff --git a/src/components/App.tsx b/src/components/App.tsx
index d465b79..4f96b62 100644
--- a/src/components/App.tsx
+++ b/src/components/App.tsx
@@ -8,6 +8,7 @@ import WheelShare from './WheelShare';
 import WheelShareLoggedOut from './WheelShareLoggedOut';
 
 const Authenticator = lazy(() => import('./Authentication/Authenticator'));
+const Carpool = lazy(() => import('./Carpool/Carpool'));
 const Group = lazy(() => import('./Group'));
 
 const dummyNotificationData: IInvitation[] = [
@@ -81,6 +82,7 @@ export default function App() {
 								component={Authenticator}
 								path="/auth/:provider/callback"
 							/>
+							<Route path="/carpools/:id" component={Carpool} />
 						</Suspense>
 					</Switch>
 				</BrowserRouter>
diff --git a/src/components/Carpool.tsx b/src/components/Carpool/Carpool.tsx
similarity index 87%
rename from src/components/Carpool.tsx
rename to src/components/Carpool/Carpool.tsx
index 66e848e..9306db6 100644
--- a/src/components/Carpool.tsx
+++ b/src/components/Carpool/Carpool.tsx
@@ -1,8 +1,8 @@
 import { useEffect, useState } from 'react';
 import { useParams } from 'react-router-dom';
-import { getCarpool } from './api';
-import { ICarpool } from './types';
-import UISecondaryBox from './UI/UISecondaryBox';
+import { getCarpool } from '../api';
+import { ICarpool } from '../types';
+import UISecondaryBox from '../UI/UISecondaryBox';
 
 function MemberList({ members }: { members: ICarpool['members'] }) {
 	return (