import CharacterCard from '../../components/CharacterCard';
import { CharacterList, NocoCharacterResponse } from '../../utils/types';
import Header from '../../components/Header';
import { Grid, Text } from "@nextui-org/react";
import Nav from '../../components/Nav';

// @ts-ignore
const fetcher = (...args: string[]) => fetch(...args).then(res => res.json())

{/* <Text h1 draggable>
        Characters
    </Text>
    <Grid.Container gap={3} justify="center">
        {props.characters.map(char => (
        <Grid xs>
            <CharacterCard {...char} />
        </Grid>
        ))}
    </Grid.Container> 
*/}

export default function Characters(props: { characters: CharacterList }) {
    return (
        <>
            <Nav />
        </>
    )
}



export async function getServerSideProps(context: any) {
    let characters = await fetcher(`http://${context.req.headers.host}/api/refs`)
    return {
        props: {
            characters,
        }
    }
}