import { useQuery } from '@apollo/client' import Comment, { CommentSkeleton } from './comment' import Item from './item' import { NOTIFICATIONS } from '../fragments/notifications' import styles from './notifications.module.css' import { useRouter } from 'next/router' import MoreFooter from './more-footer' function Notification ({ n }) { const router = useRouter() return (
{ if (n.__typename === 'Reply' || !n.item.title) { router.push({ pathname: '/items/[id]', query: { id: n.item.parentId, commentId: n.item.id } }, `/items/${n.item.parentId}`) } else { router.push({ pathname: '/items/[id]', query: { id: n.item.id } }, `/items/${n.item.id}`) } }} > {n.__typename === 'Votification' && your {n.item.title ? 'post' : 'reply'} stacked {n.earnedSats} sats} {n.__typename === 'Mention' && you were mentioned in}
{n.item.title ? : }
) } export default function Notifications ({ notifications, cursor, lastChecked, variables }) { const router = useRouter() const { data, fetchMore } = useQuery(NOTIFICATIONS, { variables, fetchPolicy: router.query.cache ? 'cache-first' : undefined }) if (data) { ({ notifications: { notifications, cursor } } = data) } const [fresh, old] = notifications.reduce((result, n) => { result[new Date(n.sortTime).getTime() > lastChecked ? 0 : 1].push(n) return result }, [[], []]) return ( <> {/* XXX we shouldn't use the index but we don't have a unique id in this union yet */}
{fresh.map((n, i) => ( ))}
{old.map((n, i) => ( ))} ) } function CommentsFlatSkeleton () { const comments = new Array(21).fill(null) return (
{comments.map((_, i) => ( ))}
) }