-
+
{
+ const viewedAt = commentsViewedAt(item)
+ if (viewedAt) {
+ e.preventDefault()
+ router.push(
+ `/items/${item.id}?commentsViewedAt=${viewedAt}`,
+ `/items/${item.id}`)
+ }
+ }} ref={titleRef} className={`${styles.title} text-reset me-2`}
+ >
{item.searchTitle ?
: item.title}
{item.pollCost &&
}
{item.bounty > 0 &&
diff --git a/components/item.module.css b/components/item.module.css
index d90d2692..bdbcbffb 100644
--- a/components/item.module.css
+++ b/components/item.module.css
@@ -7,6 +7,15 @@
padding-bottom: .15rem;
}
+.notification {
+ position: absolute;
+ padding: 3px;
+ background-color: var(--bs-info);
+ top: -3px;
+ right: -4px;
+ border: 1px solid var(--bs-body-bg);
+}
+
.icon {
display: inline-block;
}
diff --git a/components/items.js b/components/items.js
index 7a7a38b2..547b2986 100644
--- a/components/items.js
+++ b/components/items.js
@@ -8,19 +8,21 @@ import { CommentFlat } from './comment'
import { SUB_ITEMS } from '../fragments/subs'
import { LIMIT } from '../lib/cursor'
import ItemFull from './item-full'
+import { useData } from './use-data'
export default function Items ({ ssrData, variables = {}, query, destructureData, rank, noMoreText, Footer, filter = () => true }) {
const { data, fetchMore } = useQuery(query || SUB_ITEMS, { variables })
const Foooter = Footer || MoreFooter
+ const dat = useData(data, ssrData)
const { items, pins, cursor } = useMemo(() => {
- if (!data && !ssrData) return {}
+ if (!dat) return {}
if (destructureData) {
- return destructureData(data || ssrData)
+ return destructureData(dat)
} else {
- return data?.items || ssrData?.items
+ return dat?.items
}
- }, [data, ssrData])
+ }, [dat])
const pinMap = useMemo(() =>
pins?.reduce((a, p) => { a[p.position] = p; return a }, {}), [pins])
@@ -28,7 +30,7 @@ export default function Items ({ ssrData, variables = {}, query, destructureData
const Skeleton = useCallback(() =>
, [rank, items])
- if (!ssrData && !data) {
+ if (!dat) {
return
}
diff --git a/components/lightning-auth.js b/components/lightning-auth.js
index dbb1860e..8cb07e47 100644
--- a/components/lightning-auth.js
+++ b/components/lightning-auth.js
@@ -9,6 +9,7 @@ import Qr, { QrSkeleton } from './qr'
import styles from './lightning-auth.module.css'
import BackIcon from '../svgs/arrow-left-line.svg'
import { useRouter } from 'next/router'
+import { SSR } from '../lib/constants'
function QrAuth ({ k1, encodedUrl, slashtagUrl, callbackUrl }) {
const query = gql`
@@ -18,7 +19,7 @@ function QrAuth ({ k1, encodedUrl, slashtagUrl, callbackUrl }) {
k1
}
}`
- const { data } = useQuery(query, { pollInterval: 1000, nextFetchPolicy: 'cache-and-network' })
+ const { data } = useQuery(query, SSR ? {} : { pollInterval: 1000, nextFetchPolicy: 'cache-and-network' })
useEffect(() => {
if (data?.lnAuth?.pubkey) {
diff --git a/components/login.js b/components/login.js
index 1d9fd5b7..bd85815d 100644
--- a/components/login.js
+++ b/components/login.js
@@ -43,7 +43,7 @@ const authErrorMessages = {
default: 'Auth failed. Try again or choose a different method.'
}
-export function authErrorMessage(error) {
+export function authErrorMessage (error) {
return error && (authErrorMessages[error] ?? authErrorMessages.default)
}
@@ -85,10 +85,13 @@ export default function Login ({ providers, callbackUrl, error, text, Header, Fo
className={`mt-2 ${styles.providerButton}`}
key={provider.id}
type={provider.id.toLowerCase()}
- onClick={() => router.push({
- pathname: router.pathname,
- query: { callbackUrl: router.query.callbackUrl, type: provider.name.toLowerCase() }
- })}
+ onClick={() => {
+ const { nodata, ...query } = router.query
+ router.push({
+ pathname: router.pathname,
+ query: { ...query, type: provider.name.toLowerCase() }
+ })
+ }}
text={`${text || 'Login'} with`}
/>
)
diff --git a/components/me.js b/components/me.js
index be5360ef..4b9b4121 100644
--- a/components/me.js
+++ b/components/me.js
@@ -1,13 +1,14 @@
import React, { useContext } from 'react'
import { useQuery } from '@apollo/client'
import { ME } from '../fragments/users'
+import { SSR } from '../lib/constants'
export const MeContext = React.createContext({
me: null
})
export function MeProvider ({ me, children }) {
- const { data } = useQuery(ME, { pollInterval: 1000, nextFetchPolicy: 'cache-and-network' })
+ const { data } = useQuery(ME, SSR ? {} : { pollInterval: 1000, nextFetchPolicy: 'cache-and-network' })
const contextValue = {
me: data?.me || me
diff --git a/components/notifications.js b/components/notifications.js
index 7e264492..37484712 100644
--- a/components/notifications.js
+++ b/components/notifications.js
@@ -1,9 +1,9 @@
import { useState, useEffect, useMemo } from 'react'
-import { useApolloClient, useQuery } from '@apollo/client'
+import { useQuery } from '@apollo/client'
import Comment, { CommentSkeleton } from './comment'
import Item from './item'
import ItemJob from './item-job'
-import { HAS_NOTIFICATIONS, NOTIFICATIONS } from '../fragments/notifications'
+import { NOTIFICATIONS } from '../fragments/notifications'
import MoreFooter from './more-footer'
import Invite from './invite'
import { ignoreClick } from '../lib/clicks'
@@ -20,29 +20,47 @@ import styles from './notifications.module.css'
import { useServiceWorker } from './serviceworker'
import { Checkbox, Form } from './form'
import { useRouter } from 'next/router'
+import { useData } from './use-data'
-function Notification ({ n }) {
- switch (n.__typename) {
- case 'Earn': return
- case 'Invitification': return
- case 'InvoicePaid': return
- case 'Referral': return
- case 'Streak': return
- case 'Votification': return
- case 'Mention': return
- case 'JobChanged': return
- case 'Reply': return
- }
- console.error('__typename not supported:', n.__typename)
- return null
+function Notification ({ n, fresh }) {
+ const type = n.__typename
+
+ return (
+
+ {
+ (type === 'Earn' &&
+ )
}
-function NotificationLayout ({ children, href, as }) {
+function NotificationLayout ({ children, nid, href, as, fresh }) {
const router = useRouter()
+ if (!href) return
{children}
return (
!ignoreClick(e) && router.push(href, as)}
+ className={
+ `clickToContext ${fresh ? styles.fresh : ''} ${router?.query?.nid === nid ? 'outline-it' : ''}`
+ }
+ onClick={async (e) => {
+ if (ignoreClick(e)) return
+ nid && await router.replace({
+ pathname: router.pathname,
+ query: {
+ ...router.query,
+ nid
+ }
+ }, router.asPath, { ...router.options, shallow: true })
+ router.push(href, as)
+ }}
>
{children}
@@ -50,6 +68,14 @@ function NotificationLayout ({ children, href, as }) {
}
const defaultOnClick = n => {
+ const type = n.__typename
+ if (type === 'Earn') return {}
+ if (type === 'Invitification') return { href: '/invites' }
+ if (type === 'InvoicePaid') return { href: `/invoices/${n.invoice.id}` }
+ if (type === 'Referral') return { href: '/referrals/month' }
+ if (type === 'Streak') return {}
+
+ // Votification, Mention, JobChanged, Reply all have item
if (!n.item.title) {
const path = n.item.path.split('.')
if (path.length > COMMENT_DEPTH_LIMIT + 1) {
@@ -126,7 +152,7 @@ function EarnNotification ({ n }) {
- you stacked {n.earnedSats} sats in rewards{timeSince(new Date(n.sortTime))}
+ you stacked {n.earnedSats} sats in rewards{timeSince(new Date(n.sortTime))}
{n.sources &&
@@ -145,7 +171,7 @@ function EarnNotification ({ n }) {
function Invitification ({ n }) {
return (
-
+ <>
your invite has been redeemed by {n.invite.invitees.length} stackers
@@ -157,35 +183,31 @@ function Invitification ({ n }) {
}
/>
-
+
)
}
function InvoicePaid ({ n }) {
return (
-
-
- {timeSince(new Date(n.sortTime))}
-
-
+
+ {timeSince(new Date(n.sortTime))}
+
)
}
function Referral ({ n }) {
return (
-
-
- someone joined via one of your {timeSince(new Date(n.sortTime))}
-
-
+
+ someone joined via one of your referral links
+ {timeSince(new Date(n.sortTime))}
+
)
}
function Votification ({ n }) {
return (
-
+ <>
your {n.item.title ? 'post' : 'reply'} {n.item.fwdUser ? 'forwarded' : 'stacked'} {n.earnedSats} sats{n.item.fwdUser && ` to @${n.item.fwdUser.name}`}
@@ -200,13 +222,13 @@ function Votification ({ n }) {
)}