feat: wire up public room

src/Bootstrap.tsx

@@ -2,12 +2,14 @@ import React from 'react'
 import { Routes, Route } from 'react-router-dom'
 
 import { Home } from './pages/Home/'
+import { PublicRoom } from './pages/PublicRoom/'
 
 function Bootstrap() {
   return (
     <div className="Chitchatter">
       <Routes>
         <Route path="/" element={<Home />} />
+        <Route path="/public/:roomId" element={<PublicRoom />} />
       </Routes>
     </div>
   )

src/components/Room/Room.tsx

@@ -0,0 +1,9 @@
+import { useParams } from 'react-router-dom'
+
+export function Room() {
+  const params = useParams()
+
+  const { roomId } = params
+
+  return <>Room ID: {roomId}</>
+}

src/components/Room/index.ts

@@ -0,0 +1 @@
+export * from './Room'

src/pages/Home/Home.tsx

@@ -11,6 +11,9 @@ export function Home() {
           for maximum security. All communication between you and your online
           peers is encrypted and ephemeral.
         </Typography>
+        <Typography variant="body1">
+          chitchatter is still a work in progress and not yet ready to be used!
+        </Typography>
       </header>
     </div>
   )

src/pages/PublicRoom/PublicRoom.tsx

@@ -0,0 +1,5 @@
+import { Room } from '../../components/Room'
+
+export function PublicRoom() {
+  return <Room />
+}

src/pages/PublicRoom/index.ts

@@ -0,0 +1 @@
+export * from './PublicRoom'