feat: enforce accessing only existing chats

packages/status-react/src/routes/index.tsx

@@ -1,12 +1,18 @@
 import React from 'react'
 
-import { BrowserRouter, Route, Routes } from 'react-router-dom'
+import {
+  BrowserRouter,
+  Navigate,
+  Route,
+  Routes,
+  useMatch,
+} from 'react-router-dom'
 
 import { MainSidebar } from '~/src/components/main-sidebar'
 import { AppProvider } from '~/src/contexts/app-context'
 import { DialogProvider } from '~/src/contexts/dialog-context'
 import { ThemeProvider } from '~/src/contexts/theme-context'
-import { ProtocolProvider } from '~/src/protocol'
+import { ProtocolProvider, useProtocol } from '~/src/protocol'
 import { Chat } from '~/src/routes/chat'
 import { styled } from '~/src/styles/config'
 import { GlobalStyle } from '~/src/styles/GlobalStyle'
@@ -17,6 +23,24 @@ interface Props extends Config {
   meta?: string
 }
 
+// TODO: use a better way to handle this
+const Gate = (props: { children: JSX.Element }) => {
+  const { client } = useProtocol()
+
+  const { params } = useMatch(':id')!
+  const chatId = params.id!
+
+  const chat = client.community.getChat(chatId)
+
+  if (!chat) {
+    return (
+      <Navigate to={`/${client.community._chats[0].uuid ?? '/'}`} replace />
+    )
+  }
+
+  return props.children
+}
+
 export const Community = (props: Props) => {
   const { theme, router: Router = BrowserRouter } = props
 
@@ -30,7 +54,14 @@ export const Community = (props: Props) => {
               <Wrapper>
                 <MainSidebar />
                 <Routes>
-                  <Route path="/:id" element={<Chat />} />
+                  <Route
+                    path="/:id"
+                    element={
+                      <Gate>
+                        <Chat />
+                      </Gate>
+                    }
+                  />
                 </Routes>
               </Wrapper>
             </DialogProvider>