Make v3 room links backwards compatible

app/javascript/RootBoundary.jsx

@@ -15,28 +15,18 @@
 // with Greenlight; if not, see <http://www.gnu.org/licenses/>.
 
 import React from 'react';
-import { isRouteErrorResponse, useRouteError } from 'react-router-dom';
+import { useRouteError } from 'react-router-dom';
 import DefaultErrorPage from './components/errors/DefaultErrorPage';
 import NotFoundPage from './components/errors/NotFoundPage';
 
 export default function RootBoundary() {
   const error = useRouteError();
+  const status = error?.response?.status || error?.status;
 
-  if (isRouteErrorResponse(error)) {
-    // Route Errors
-    switch (error.status) {
-      case 404:
-        return <NotFoundPage />;
-      default:
-        return <DefaultErrorPage />;
-    }
-  } else {
-    // Non-Route Errors (hooks, promises, etc.)
-    switch (error.response.status) {
-      case 404:
-        return <NotFoundPage />;
-      default:
-        return <DefaultErrorPage />;
-    }
+  switch (status) {
+    case 404:
+      return <NotFoundPage />;
+    default:
+      return <DefaultErrorPage />;
   }
 }

app/javascript/main.jsx

@@ -50,6 +50,7 @@ import AuthenticatedOnly from './routes/AuthenticatedOnly';
 import PendingRegistration from './components/users/registration/PendingRegistration';
 import RootBoundary from './RootBoundary';
 import Tenants from './components/admin/tenants/Tenants';
+import RoomIdRouter from './routes/RoomIdRouter';
 
 const queryClientConfig = {
   defaultOptions: {
@@ -100,6 +101,7 @@ const router = createBrowserRouter(
       </Route>
 
       <Route path="/rooms/:friendlyId/join" element={<RoomJoin />} />
+      <Route path="/:roomId" element={<RoomIdRouter />} />
     </Route>,
   ),
   { basename: process.env.RELATIVE_URL_ROOT },

app/javascript/routes/RoomIdRouter.jsx

@@ -0,0 +1,30 @@
+// BigBlueButton open source conferencing system - http://www.bigbluebutton.org/.
+//
+// Copyright (c) 2022 BigBlueButton Inc. and by respective authors (see below).
+//
+// This program is free software; you can redistribute it and/or modify it under the
+// terms of the GNU Lesser General Public License as published by the Free Software
+// Foundation; either version 3.0 of the License, or (at your option) any later
+// version.
+//
+// Greenlight is distributed in the hope that it will be useful, but WITHOUT ANY
+// WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A
+// PARTICULAR PURPOSE. See the GNU Lesser General Public License for more details.
+//
+// You should have received a copy of the GNU Lesser General Public License along
+// with Greenlight; if not, see <http://www.gnu.org/licenses/>.
+
+import React from 'react';
+import { Navigate, useParams } from 'react-router-dom';
+
+export default function RoomIdRouter() {
+  const { roomId } = useParams();
+  const regex = /(\w{3}-\w{3}-\w{3})(-\w{3})?/;
+  const match = roomId.match(regex);
+
+  if (match) {
+    return <Navigate to={`/rooms/${roomId}/join`} />;
+  }
+
+  throw new Response('Not Found', { status: 404 });
+}