Permanent room urls

www/app/[domain]/rooms/[roomName]/page.tsx

@@ -0,0 +1,33 @@
+"use client";
+
+import "@whereby.com/browser-sdk/embed";
+import { useCallback, useEffect, useRef } from "react";
+import useRoomMeeting from "../../rooms/useRoomMeeting";
+
+export type RoomDetails = {
+  params: {
+    roomName: string;
+  };
+};
+
+export default function Room(details: RoomDetails) {
+  const wherebyRef = useRef<HTMLElement>(null);
+  const roomName = details.params.roomName;
+  const meeting = useRoomMeeting(roomName);
+
+  const roomUrl = meeting?.response?.host_room_url
+    ? meeting?.response?.host_room_url
+    : meeting?.response?.room_url;
+
+  return (
+    <>
+      {roomUrl && (
+        <whereby-embed
+          ref={wherebyRef}
+          room={roomUrl}
+          style={{ width: "100%", height: "98%" }}
+        />
+      )}
+    </>
+  );
+}