'use client'

import { useSession } from 'next-auth/react'

export default function TestSessionPage() {
  const { data: session, status } = useSession()

  return (
    <div style={{ padding: '20px', fontFamily: 'monospace' }}>
      <h1>Session Debug Page</h1>

      <div style={{ marginTop: '20px' }}>
        <h2>Status: {status}</h2>
      </div>

      <div style={{ marginTop: '20px' }}>
        <h2>Session Data:</h2>
        <pre style={{ background: '#f5f5f5', padding: '10px', borderRadius: '5px' }}>
          {JSON.stringify(session, null, 2)}
        </pre>
      </div>

      <div style={{ marginTop: '20px' }}>
        <h2>Session User:</h2>
        <pre style={{ background: '#f5f5f5', padding: '10px', borderRadius: '5px' }}>
          {JSON.stringify(session?.user, null, 2)}
        </pre>
      </div>

      <div style={{ marginTop: '20px' }}>
        <h2>Tenant Info:</h2>
        <pre style={{ background: '#f5f5f5', padding: '10px', borderRadius: '5px' }}>
          {JSON.stringify((session?.user as any)?.tenant, null, 2)}
        </pre>
      </div>

      <div style={{ marginTop: '20px' }}>
        <h2>is_sysmana:</h2>
        <pre style={{ background: '#f5f5f5', padding: '10px', borderRadius: '5px', fontSize: '24px', fontWeight: 'bold' }}>
          {(session?.user as any)?.tenant?.is_sysmana?.toString() || 'undefined'}
        </pre>
      </div>
    </div>
  )
}