diff --git a/api/resolvers/notifications.js b/api/resolvers/notifications.js index eac7a6bb..fc06bce3 100644 --- a/api/resolvers/notifications.js +++ b/api/resolvers/notifications.js @@ -5,9 +5,9 @@ export default { Query: { notifications: async (parent, { cursor }, { me, models }) => { const decodedCursor = decodeCursor(cursor) - // if (!me) { - // throw new AuthenticationError('you must be logged in') - // } + if (!me) { + throw new AuthenticationError('you must be logged in') + } /* So that we can cursor over results, we union notifications together ... @@ -63,12 +63,15 @@ export default { GROUP BY ${ITEM_SUBQUERY_FIELDS}, subquery.island ORDER BY max(subquery.voted_at) desc) ORDER BY sort_time DESC OFFSET $3 - LIMIT ${LIMIT}`, 622, decodedCursor.time, decodedCursor.offset) + LIMIT ${LIMIT}`, me.id, decodedCursor.time, decodedCursor.offset) notifications = notifications.map(n => { n.item = { ...n } return n }) + + await models.user.update({ where: { id: me.id }, data: { checkedNotesAt: new Date() } }) + return { cursor: notifications.length === LIMIT ? nextCursorEncoded(decodedCursor) : null, notifications diff --git a/components/comment.js b/components/comment.js index 5620cb2b..829aed1f 100644 --- a/components/comment.js +++ b/components/comment.js @@ -38,7 +38,7 @@ function Parent ({ item, rootText }) { ) } -export default function Comment ({ item, children, replyOpen, includeParent, rootText, noComments, noReply, clickToContext }) { +export default function Comment ({ item, children, replyOpen, includeParent, rootText, noComments, noReply }) { const [reply, setReply] = useState(replyOpen) const [edit, setEdit] = useState() const [collapse, setCollapse] = useState(false) @@ -50,28 +50,16 @@ export default function Comment ({ item, children, replyOpen, includeParent, roo const [canEdit, setCanEdit] = useState(mine && (Date.now() < editThreshold)) - console.log('wtf router', router, item.id, ref.current) - useEffect(() => { if (Number(router.query.commentId) === Number(item.id)) { - console.log(ref.current.scrollTop) ref.current.scrollIntoView() - // ref.current.classList.add('flash-it') + ref.current.classList.add('flash-it') } }, [item]) return (
{ - if (clickToContext) { - console.log('pushing') - // router.push(`/items/${item.parentId}?commentId=${item.id}`, `/items/${item.parentId}`, { scroll: false }) - router.push({ - pathname: '/items/[id]', - query: { id: item.parentId, commentId: item.id } - }, `/items/${item.parentId}`) - } - }} className={includeParent ? `${clickToContext ? styles.clickToContext : ''}` : `${styles.comment} ${collapse ? styles.collapsed : ''}`} + ref={ref} className={includeParent ? '' : `${styles.comment} ${collapse ? styles.collapsed : ''}`} >
diff --git a/components/comment.module.css b/components/comment.module.css index e04fd681..1fc0216d 100644 --- a/components/comment.module.css +++ b/components/comment.module.css @@ -81,15 +81,6 @@ padding-left: .2rem; } -.clickToContext { - border-radius: .4rem; - padding: .2rem 0; -} - -.clickToContext:hover { - background-color: rgba(0, 0, 0, 0.03); -} - .comment:not(:last-child) { border-bottom-left-radius: 0; border-bottom-right-radius: 0; @@ -99,9 +90,4 @@ padding-top: .25rem; border-top-left-radius: 0; border-top-right-radius: 0; -} - -.clickToContext { - scroll-behavior: smooth; - cursor: pointer; } \ No newline at end of file diff --git a/components/comments-flat.js b/components/comments-flat.js index f2cf7e7c..1c70b658 100644 --- a/components/comments-flat.js +++ b/components/comments-flat.js @@ -3,8 +3,11 @@ import Button from 'react-bootstrap/Button' import { MORE_FLAT_COMMENTS } from '../fragments/comments' import { useState } from 'react' import Comment, { CommentSkeleton } from './comment' +import styles from './notifications.module.css' +import { useRouter } from 'next/router' export default function CommentsFlat ({ variables, ...props }) { + const router = useRouter() const { loading, error, data, fetchMore } = useQuery(MORE_FLAT_COMMENTS, { variables }) @@ -12,12 +15,22 @@ export default function CommentsFlat ({ variables, ...props }) { if (loading) { return } - const { moreFlatComments: { comments, cursor } } = data return ( <> {comments.map(item => ( - +
{ + router.push({ + pathname: '/items/[id]', + query: { id: item.parentId, commentId: item.id } + }, `/items/${item.parentId}`) + }} + > + +
))} diff --git a/components/header.js b/components/header.js index f76426c8..4b59d2b7 100644 --- a/components/header.js +++ b/components/header.js @@ -14,7 +14,7 @@ import { useEffect } from 'react' import { randInRange } from '../lib/rand' function WalletSummary ({ me }) { - return `[${me.stacked},${me.sats}]` + return `${me.stacked} \\ ${me.sats}` } export default function Header () { @@ -32,20 +32,18 @@ export default function Header () { if (session) { return (
- {me && me.hasNewNotes && - - - } + + +
- + profile { // when it's a fresh click evict old notification cache - client.cache.evict({ id: 'ROOT_QUERY', fieldName: 'moreFlatComments:{}' }) - client.cache.evict({ id: 'ROOT_QUERY', fieldName: 'recentlyStacked' }) + client.cache.evict({ id: 'ROOT_QUERY', fieldName: 'notifications' }) }} > notifications diff --git a/components/notifications.js b/components/notifications.js index ebce1242..809e5c6d 100644 --- a/components/notifications.js +++ b/components/notifications.js @@ -4,8 +4,11 @@ import { useState } from 'react' 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' export default function Notifications ({ variables, ...props }) { + const router = useRouter() const { loading, error, data, fetchMore } = useQuery(NOTIFICATIONS, { variables }) @@ -14,12 +17,26 @@ export default function Notifications ({ variables, ...props }) { return } const { notifications: { notifications, cursor } } = data + return ( <> {/* XXX we shouldn't use the index but we don't have a unique id in this union yet */} {notifications.map((n, i) => ( -
- {n.__typename === 'Votification' && your {n.item.title ? 'post' : 'reply'} stacked {n.earnedSats} sats} +
{ + 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(`items/${n.item.id}`) + } + }} + > + {n.__typename === 'Votification' && your {n.item.title ? 'post' : 'reply'} stacked {n.earnedSats} sats}
{n.item.title ? diff --git a/components/notifications.module.css b/components/notifications.module.css new file mode 100644 index 00000000..c6ee5b81 --- /dev/null +++ b/components/notifications.module.css @@ -0,0 +1,9 @@ +.clickToContext { + border-radius: .4rem; + padding: .2rem 0; + cursor: pointer; +} + +.clickToContext:hover { + background-color: rgba(0, 0, 0, 0.03); +} \ No newline at end of file diff --git a/pages/[username]/comments.js b/pages/[username]/comments.js index c195b200..bb5fa892 100644 --- a/pages/[username]/comments.js +++ b/pages/[username]/comments.js @@ -39,7 +39,7 @@ export default function UserComments ({ user }) { - + ) } diff --git a/styles/globals.scss b/styles/globals.scss index fe80bd33..38ce80c8 100644 --- a/styles/globals.scss +++ b/styles/globals.scss @@ -191,7 +191,7 @@ footer { } .flash-it { - animation: flash 2s linear 2; + animation: flash 2s linear 1; } @keyframes spin {