import Head from 'next/head' import dynamic from 'next/dynamic' import { useState, useEffect } from 'react' // Dynamically import the chess app to avoid SSR issues with Pusher const ChessApp = dynamic(() => import('../components/ChessApp'), { ssr: false, loading: () => (
🍄
Connecting to the mycelial network...
Loading application...
) }) export default function Home() { const [healthStatus, setHealthStatus] = useState(null) const [loading, setLoading] = useState(true) useEffect(() => { // Check API health on mount fetch('/api/health') .then(res => res.json()) .then(data => { setHealthStatus(data) setLoading(false) }) .catch(error => { console.error('Health check failed:', error) setHealthStatus({ status: 'error', error: error.message }) setLoading(false) }) }, []) if (loading) { return (
🍄
Checking system health...
) } if (healthStatus?.status === 'unhealthy') { return (
⚠️

System Error

Error: {healthStatus.error}

Environment Check:

  • Supabase URL: {healthStatus.environment?.hasSupabaseUrl ? '✅' : '❌'}
  • Supabase Key: {healthStatus.environment?.hasSupabaseKey ? '✅' : '❌'}
  • Pusher Key: {healthStatus.environment?.hasPusherKey ? '✅' : '❌'}
  • Pusher Cluster: {healthStatus.environment?.hasPusherCluster ? '✅' : '❌'}

Please check your environment variables and database setup.

) } return ( <> Commons Hub Chess Tournament ) }