forked from vercel/next.js
-
Notifications
You must be signed in to change notification settings - Fork 2
/
list.tsx
34 lines (30 loc) · 880 Bytes
/
list.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
import { useQuery } from '@apollo/client'
import type { NextPage } from 'next'
import { useRouter } from 'next/dist/client/router'
import { GET_LAUNCHES_LIST_QUERY } from 'queries/getLaunchesList'
const List: NextPage = () => {
const { back } = useRouter()
const { data: { launches = [] } = {}, loading } = useQuery<{
launches: { id: string; mission_id: string[]; mission_name: string }[]
}>(GET_LAUNCHES_LIST_QUERY)
if (loading) {
return <div>Loading...</div>
}
return (
<>
<button onClick={back}>Back</button>
{launches.length > 0 ? (
<ul>
{Array.from(new Set(launches)).map(
({ mission_name, mission_id, id }) => (
<li key={`${id}-${mission_id[0]}`}>{mission_name}</li>
)
)}
</ul>
) : (
<div>No data</div>
)}
</>
)
}
export default List