93713b33df
* Use context for pending sats * Fix sats going negative on zap undo We already handle undoing pending sats by wrapping the payment+mutation with try/finally. * Remove unnecessary ItemContextProvider * Rename to parentCtx * Fix hierarchy of ItemContextProvider If a comment was root and it was zapped, the pending sats contributed to the sats shown in <CommentsHeader>. This was caused by <CommentsHeader> accessing the root item context for all comments, even for the root comment. So even if the root comment was zapped, the pending sats contributed to the sats for the comment section. This wasn't the case for posts since their item context was above the context used by <CommentsHeader>. This was fixed by moving <ItemProviderContext> down into <Comments> and <Item> instead of declaring it at <ItemFull> which wraps the root item and all comments. * Optimistic update for poll votes * prevent twice optimistic zap * enhance client notifications with skeleton and no redudant queries * enlarge nwc amount limits * Disable max amount and daily limit in NWC container --------- Co-authored-by: Keyan <34140557+huumn@users.noreply.github.com> Co-authored-by: keyan <keyan.kousha+huumn@gmail.com>
103 lines
3.1 KiB
JavaScript
103 lines
3.1 KiB
JavaScript
import { Fragment } from 'react'
|
|
import Comment, { CommentSkeleton } from './comment'
|
|
import styles from './header.module.css'
|
|
import Nav from 'react-bootstrap/Nav'
|
|
import Navbar from 'react-bootstrap/Navbar'
|
|
import { numWithUnits } from '@/lib/format'
|
|
import { defaultCommentSort } from '@/lib/item'
|
|
import { useRouter } from 'next/router'
|
|
import { ItemContextProvider, useItemContext } from './item'
|
|
|
|
export function CommentsHeader ({ handleSort, pinned, bio, parentCreatedAt, commentSats }) {
|
|
const router = useRouter()
|
|
const sort = router.query.sort || defaultCommentSort(pinned, bio, parentCreatedAt)
|
|
const { pendingCommentSats } = useItemContext()
|
|
|
|
const getHandleClick = sort => {
|
|
return () => {
|
|
handleSort(sort)
|
|
}
|
|
}
|
|
|
|
return (
|
|
<Navbar className='pt-1 pb-0 px-3'>
|
|
<Nav
|
|
className={styles.navbarNav}
|
|
activeKey={sort}
|
|
>
|
|
<Nav.Item className='text-muted'>
|
|
{numWithUnits(commentSats + pendingCommentSats)}
|
|
</Nav.Item>
|
|
<div className='ms-auto d-flex'>
|
|
<Nav.Item>
|
|
<Nav.Link
|
|
eventKey='hot'
|
|
className={styles.navLink}
|
|
onClick={getHandleClick('hot')}
|
|
>
|
|
hot
|
|
</Nav.Link>
|
|
</Nav.Item>
|
|
<Nav.Item>
|
|
<Nav.Link
|
|
eventKey='recent'
|
|
className={styles.navLink}
|
|
onClick={getHandleClick('recent')}
|
|
>
|
|
recent
|
|
</Nav.Link>
|
|
</Nav.Item>
|
|
<Nav.Item>
|
|
<Nav.Link
|
|
eventKey='top'
|
|
className={styles.navLink}
|
|
onClick={getHandleClick('top')}
|
|
>
|
|
top
|
|
</Nav.Link>
|
|
</Nav.Item>
|
|
</div>
|
|
</Nav>
|
|
</Navbar>
|
|
)
|
|
}
|
|
|
|
export default function Comments ({ parentId, pinned, bio, parentCreatedAt, commentSats, comments, ...props }) {
|
|
const router = useRouter()
|
|
|
|
const pins = comments?.filter(({ position }) => !!position).sort((a, b) => a.position - b.position)
|
|
|
|
return (
|
|
<ItemContextProvider>
|
|
{comments?.length > 0
|
|
? <CommentsHeader
|
|
commentSats={commentSats} parentCreatedAt={parentCreatedAt}
|
|
pinned={pinned} bio={bio} handleSort={sort => {
|
|
const { commentsViewedAt, commentId, ...query } = router.query
|
|
delete query.nodata
|
|
router.push({
|
|
pathname: router.pathname,
|
|
query: { ...query, commentsViewedAt, sort }
|
|
}, {
|
|
pathname: `/items/${parentId}`,
|
|
query: sort === defaultCommentSort(pinned, bio, parentCreatedAt) ? undefined : { sort }
|
|
}, { scroll: false })
|
|
}}
|
|
/>
|
|
: null}
|
|
{pins.map(item => (
|
|
<Fragment key={item.id}>
|
|
<Comment depth={1} item={item} {...props} pin />
|
|
</Fragment>
|
|
))}
|
|
{comments.filter(({ position }) => !position).map(item => (
|
|
<Comment depth={1} key={item.id} item={item} {...props} />
|
|
))}
|
|
</ItemContextProvider>
|
|
)
|
|
}
|
|
|
|
export function CommentsSkeleton () {
|
|
return <CommentSkeleton skeletonChildren={7} />
|
|
}
|