rsnext/examples/api-routes-graphql/pages/index.tsx
2023-01-12 09:36:29 -08:00

36 lines
714 B
TypeScript

import useSWR from 'swr'
const fetcher = (query: string) =>
fetch('/api/graphql', {
method: 'POST',
headers: {
'Content-type': 'application/json',
},
body: JSON.stringify({ query }),
})
.then((res) => res.json())
.then((json) => json.data)
type Data = {
users: {
name: string
}[]
}
export default function Index() {
const { data, error, isLoading } = useSWR<Data>('{ users { name } }', fetcher)
if (error) return <div>Failed to load</div>
if (isLoading) return <div>Loading...</div>
if (!data) return null
const { users } = data
return (
<div>
{users.map((user, index) => (
<div key={index}>{user.name}</div>
))}
</div>
)
}