stacker.news/pages/items/[id]/related.js

38 lines
1.2 KiB
JavaScript
Raw Normal View History

2022-10-26 22:46:01 +00:00
// ssr the related query with an adequate limit
// need to use a cursor on related
import { RELATED_ITEMS, RELATED_ITEMS_WITH_ITEM } from '../../../fragments/items'
import { getGetServerSideProps } from '../../../api/ssrApollo'
import Items from '../../../components/items'
import Layout from '../../../components/layout'
import { useRouter } from 'next/router'
import Item from '../../../components/item'
import { useQuery } from '@apollo/client'
import PageLoading from '../../../components/page-loading'
2022-10-26 22:46:01 +00:00
export const getServerSideProps = getGetServerSideProps({
query: RELATED_ITEMS_WITH_ITEM,
notFound: data => !data.item
})
2022-10-26 22:46:01 +00:00
export default function Related ({ ssrData }) {
2022-10-26 22:46:01 +00:00
const router = useRouter()
const { data } = useQuery(RELATED_ITEMS_WITH_ITEM, { variables: { id: router.query.id } })
if (!data && !ssrData) return <PageLoading />
const { item } = data || ssrData
2022-10-26 22:46:01 +00:00
return (
<Layout>
<Item item={item} />
2023-07-24 18:35:05 +00:00
<div className='fw-bold my-2'>related</div>
2022-10-26 22:46:01 +00:00
<Items
ssrData={ssrData}
2022-10-26 22:46:01 +00:00
query={RELATED_ITEMS}
destructureData={data => data.related}
variables={{ id: router.query.id }}
/>
</Layout>
)
}