fix: past due meetings are now 8h for ics (#958)

www/app/[roomName]/MeetingSelection.tsx

@@ -24,6 +24,7 @@ import {
 } from "../lib/apiHooks";
 import { useRouter } from "next/navigation";
 import { formatDateTime, formatStartedAgo } from "../lib/timeUtils";
+import { formatJoinError } from "../lib/errorUtils";
 import MeetingMinimalHeader from "../components/MeetingMinimalHeader";
 import { NonEmptyString } from "../lib/utils";
 import { MeetingId, assertMeetingId } from "../lib/types";
@@ -188,6 +189,19 @@ export default function MeetingSelection({
         flex="1"
         gap={{ base: 4, md: 6 }}
       >
+        {joinMeetingMutation.isError && (
+          <Box
+            p={4}
+            borderRadius="md"
+            bg="red.50"
+            borderLeft="4px solid"
+            borderColor="red.400"
+          >
+            <Text color="red.700">
+              {formatJoinError(joinMeetingMutation.error)}
+            </Text>
+          </Box>
+        )}
         {/* Current Ongoing Meetings - BIG DISPLAY */}
         {currentMeetings.length > 0 ? (
           <VStack align="stretch" gap={6} mb={8}>

www/app/[roomName]/components/DailyRoom.tsx

@@ -28,6 +28,7 @@ import {
   useRoomJoinMeeting,
   useMeetingStartRecording,
 } from "../../lib/apiHooks";
+import { formatJoinError } from "../../lib/errorUtils";
 import { omit } from "remeda";
 import {
   assertExists,
@@ -428,7 +429,7 @@ export default function DailyRoom({ meeting, room }: DailyRoomProps) {
   if (joinMutation.isError) {
     return (
       <Center width="100vw" height="100vh">
-        <Text color="red.500">Failed to join meeting. Please try again.</Text>
+        <Text color="red.500">{formatJoinError(joinMutation.error)}</Text>
       </Center>
     );
   }

www/app/[roomName]/components/LiveKitRoom.tsx

@@ -13,6 +13,7 @@ import {
 import type { components } from "../../reflector-api";
 import { useAuth } from "../../lib/AuthProvider";
 import { useRoomJoinMeeting } from "../../lib/apiHooks";
+import { formatJoinError } from "../../lib/errorUtils";
 import { assertMeetingId } from "../../lib/types";
 import {
   ConsentDialogButton,
@@ -66,7 +67,6 @@ export default function LiveKitRoom({ meeting, room }: LiveKitRoomProps) {
 
   const joinMutation = useRoomJoinMeeting();
   const [joinedMeeting, setJoinedMeeting] = useState<Meeting | null>(null);
-  const [connectionError, setConnectionError] = useState(false);
   const [userChoices, setUserChoices] = useState<LocalUserChoices | null>(null);
 
   // ── Consent dialog (same hooks as Daily/Whereby) ──────────
@@ -99,7 +99,7 @@ export default function LiveKitRoom({ meeting, room }: LiveKitRoomProps) {
     }
     return "";
   })();
-  const isJoining = !!userChoices && !joinedMeeting && !connectionError;
+  const isJoining = !!userChoices && !joinedMeeting && !joinMutation.isError;
 
   // ── Join meeting via backend API after PreJoin submit ─────
   useEffect(() => {
@@ -123,7 +123,6 @@ export default function LiveKitRoom({ meeting, room }: LiveKitRoomProps) {
         if (!cancelled) setJoinedMeeting(result);
       } catch (err) {
         console.error("Failed to join LiveKit meeting:", err);
-        if (!cancelled) setConnectionError(true);
       }
     }
 
@@ -182,10 +181,10 @@ export default function LiveKitRoom({ meeting, room }: LiveKitRoomProps) {
     );
   }
 
-  if (connectionError) {
+  if (joinMutation.isError) {
     return (
       <Center h="100vh" bg="gray.50">
-        <Text fontSize="lg">Failed to connect to meeting</Text>
+        <Text fontSize="lg">{formatJoinError(joinMutation.error)}</Text>
       </Center>
     );
   }

www/app/lib/apiHooks.ts

@@ -863,16 +863,9 @@ export function useRoomGetMeeting(
 }
 
 export function useRoomJoinMeeting() {
-  const { setError } = useError();
-
   return $api.useMutation(
     "post",
     "/v1/rooms/{room_name}/meetings/{meeting_id}/join",
-    {
-      onError: (error) => {
-        setError(error as Error, "There was an error joining the meeting");
-      },
-    },
   );
 }
 

www/app/lib/errorUtils.ts

@@ -1,5 +1,35 @@
 import { isNonEmptyArray, NonEmptyArray } from "./array";
 
+export function getErrorDetail(error: unknown, fallback: string): string {
+  if (!error) return fallback;
+  if (typeof error === "object" && error !== null) {
+    const detail = (error as { detail?: unknown }).detail;
+    if (typeof detail === "string" && detail.length > 0) return detail;
+    const response = (error as { response?: { data?: { detail?: unknown } } })
+      .response;
+    const nestedDetail = response?.data?.detail;
+    if (typeof nestedDetail === "string" && nestedDetail.length > 0)
+      return nestedDetail;
+  }
+  return fallback;
+}
+
+export function formatJoinError(error: unknown): string {
+  const detail = getErrorDetail(error, "");
+  switch (detail) {
+    case "Meeting has ended":
+      return "This meeting has ended. The organizer can start a new one.";
+    case "Meeting is not active":
+      return "This meeting is no longer active. Ask the organizer to start it again.";
+    case "Meeting not found":
+      return "This meeting no longer exists. Check the link or ask the organizer for a new one.";
+    case "Room not found":
+      return "This room doesn't exist.";
+    default:
+      return detail || "We couldn't join the meeting. Please try again.";
+  }
+}
+
 export function shouldShowError(error: Error | null | undefined) {
   if (
     error?.name == "ResponseError" &&