stacker.news/components/item-popover.js
Felipe Bueno 471888563e
Item popover (#1162)
* WIP Item Popover

* Hide user on ItemSumarry to avoid infinite popovers

* Introduce HoverablePopover

* Delete itempopover & userpopover css

* Fix excess bottom padding on the ItemPopover

* Fix ItemSummary: Use text for itens that doesn't have a title

* Handling #itemid/something links + Tweaks for rendering comment summary

* refine hoverable popover

---------

Co-authored-by: Keyan <34140557+huumn@users.noreply.github.com>
Co-authored-by: keyan <keyan.kousha+huumn@gmail.com>
2024-05-15 12:05:50 -05:00

29 lines
814 B
JavaScript

import { ITEM } from '@/fragments/items'
import errorStyles from '@/styles/error.module.css'
import { useLazyQuery } from '@apollo/client'
import classNames from 'classnames'
import HoverablePopover from './hoverable-popover'
import { ItemSkeleton, ItemSummary } from './item'
export default function ItemPopover ({ id, children }) {
const [getItem, { loading, data }] = useLazyQuery(
ITEM,
{
variables: { id },
fetchPolicy: 'cache-first'
}
)
return (
<HoverablePopover
onShow={getItem}
trigger={children}
body={!data || loading
? <ItemSkeleton showUpvote={false} />
: !data.item
? <h1 className={classNames(errorStyles.status, errorStyles.describe)}>ITEM NOT FOUND</h1>
: <ItemSummary item={data.item} />}
/>
)
}