diff --git a/apps/web/src/app/arcade/page.tsx b/apps/web/src/app/arcade/page.tsx index 03b1b760..8a3146de 100644 --- a/apps/web/src/app/arcade/page.tsx +++ b/apps/web/src/app/arcade/page.tsx @@ -1,8 +1,8 @@ 'use client' import { useRouter } from 'next/navigation' -import { useState } from 'react' -import { useRoomData, useSetRoomGame } from '@/hooks/useRoomData' +import { useState, useEffect } from 'react' +import { useRoomData, useSetRoomGame, useCreateRoom } from '@/hooks/useRoomData' import { useViewerId } from '@/hooks/useViewerId' import { GAMES_CONFIG } from '@/components/GameSelector' import type { GameType } from '@/components/GameSelector' @@ -17,7 +17,8 @@ import { getAllGames, getGame, hasGame } from '@/lib/arcade/game-registry' * Shows game selection when no game is set, then shows the game itself once selected. * URL never changes - it's always /arcade regardless of selection, setup, or gameplay. * - * Note: We show a friendly message with a link if no room exists to avoid navigation loops. + * Auto-creates a solo room if the user doesn't have one, ensuring they always have + * a context in which to play games. * * Note: ModerationNotifications is handled by PageWithNav inside each game component, * so we don't need to render it here. @@ -27,10 +28,38 @@ export default function RoomPage() { const { roomData, isLoading } = useRoomData() const { data: viewerId } = useViewerId() const { mutate: setRoomGame } = useSetRoomGame() + const { mutate: createRoom, isPending: isCreatingRoom } = useCreateRoom() const [permissionError, setPermissionError] = useState(null) - // Show loading state - if (isLoading) { + // Auto-create room when user has no room + // This happens when: + // 1. First time visiting /arcade + // 2. After leaving a room + useEffect(() => { + if (!isLoading && !roomData && viewerId && !isCreatingRoom) { + console.log('[RoomPage] No room found, auto-creating room for user:', viewerId) + + createRoom( + { + name: 'My Room', + gameName: null, // No game selected yet + gameConfig: undefined, // No game config since no game selected + accessMode: 'open' as const, // Open by default - user can change settings later + }, + { + onSuccess: (newRoom) => { + console.log('[RoomPage] Successfully created room:', newRoom.id) + }, + onError: (error) => { + console.error('[RoomPage] Failed to auto-create room:', error) + }, + } + ) + } + }, [isLoading, roomData, viewerId, isCreatingRoom, createRoom]) + + // Show loading state (includes both initial load and room creation) + if (isLoading || isCreatingRoom) { return (
- Loading room... + {isCreatingRoom ? 'Creating solo room...' : 'Loading room...'}
) } - // Show error if no room (instead of redirecting) + // If still no room after loading and creation attempt, show fallback + // This should rarely happen (only if auto-creation fails) if (!roomData) { return (
-
No active room found
- - Go to Champion Arena - +
Unable to create room
+
Please try refreshing the page
) }