chellaris-galaxy-political-compass/app/page.tsx

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

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 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 className='flex flex-col justify-around h-full'>
          <PopChart></PopChart>
          <EthicsBar></EthicsBar>
        </div>
      </div>
      

    </main>
  )
}