'use client';
import { useState } from 'react';
import {RadarChart} from '../components/charts/radar'
import {EmpireStats} from '../components/tables/empires'
import { Checkbox } from '@nextui-org/react';

export default function Home() {
  const [weighted, setWeighted] = useState(true);
  return (
    <main className="flex min-h-screen flex-row items-center">
      <div className='flex flex-row min-h-screen'>
        <RadarChart weighted={weighted}/>
        <div className='flex flex-col justify-around'>
          <EmpireStats />
          <Checkbox labelColor="primary" defaultSelected={weighted} onChange={() => setWeighted(!weighted)}>Weighted Ethics</Checkbox>
        </div>
      </div>
      

    </main>
  )
}