diff --git a/packages/atlas/src/api/hooks/notifications.ts b/packages/atlas/src/api/hooks/notifications.ts index b6e9b2e2d3..0d479d2290 100644 --- a/packages/atlas/src/api/hooks/notifications.ts +++ b/packages/atlas/src/api/hooks/notifications.ts @@ -1,4 +1,5 @@ import { QueryHookOptions } from '@apollo/client' +import { useRef } from 'react' import { GetNftActivitiesCountQuery, @@ -10,6 +11,7 @@ import { useGetNotificationsConnectionQuery, useMarkNotificationsAsReadMutation, } from '@/api/queries/__generated__/notifications.generated' +import { useJoystreamStore } from '@/providers/joystream/joystream.store' import { NftActivityOrderByInput, RecipientTypeWhereInput } from '../queries/__generated__/baseTypes.generated' @@ -17,8 +19,13 @@ export const useRawNotifications = ( recipient: RecipientTypeWhereInput | undefined, opts?: Pick ) => { + const currentBlockRef = useRef(useJoystreamStore((store) => store.currentBlock)) const { data, ...rest } = useGetNotificationsConnectionQuery({ - variables: { first: 10, recipient: recipient as RecipientTypeWhereInput }, + variables: { + first: 10, + recipient: recipient as RecipientTypeWhereInput, + dispatchBlock: currentBlockRef.current ?? 0, + }, ...opts, skip: !recipient, }) diff --git a/packages/atlas/src/api/queries/__generated__/notifications.generated.tsx b/packages/atlas/src/api/queries/__generated__/notifications.generated.tsx index aab739006e..eb8e5eca80 100644 --- a/packages/atlas/src/api/queries/__generated__/notifications.generated.tsx +++ b/packages/atlas/src/api/queries/__generated__/notifications.generated.tsx @@ -22,6 +22,7 @@ export type GetNotificationsConnectionQueryVariables = Types.Exact<{ recipient: Types.RecipientTypeWhereInput first: Types.Scalars['Int'] after?: Types.InputMaybe + dispatchBlock: Types.Scalars['Int'] }> export type GetNotificationsConnectionQuery = { @@ -3183,12 +3184,17 @@ export type GetNotificationsCountQueryResult = Apollo.QueryResult< GetNotificationsCountQueryVariables > export const GetNotificationsConnectionDocument = gql` - query GetNotificationsConnection($recipient: RecipientTypeWhereInput!, $first: Int!, $after: String) { + query GetNotificationsConnection( + $recipient: RecipientTypeWhereInput! + $first: Int! + $after: String + $dispatchBlock: Int! + ) { notificationsConnection( first: $first after: $after - orderBy: createdAt_DESC - where: { inApp_eq: true, recipient: $recipient } + orderBy: [dispatchBlock_DESC, id_DESC] + where: { inApp_eq: true, recipient: $recipient, dispatchBlock_lte: $dispatchBlock } ) { pageInfo { hasNextPage @@ -3412,6 +3418,7 @@ export const GetNotificationsConnectionDocument = gql` * recipient: // value for 'recipient' * first: // value for 'first' * after: // value for 'after' + * dispatchBlock: // value for 'dispatchBlock' * }, * }); */ diff --git a/packages/atlas/src/api/queries/notifications.graphql b/packages/atlas/src/api/queries/notifications.graphql index 7e53ebb68c..56915957e7 100644 --- a/packages/atlas/src/api/queries/notifications.graphql +++ b/packages/atlas/src/api/queries/notifications.graphql @@ -4,12 +4,17 @@ query GetNotificationsCount($where: NotificationWhereInput!) { } } -query GetNotificationsConnection($recipient: RecipientTypeWhereInput!, $first: Int!, $after: String) { +query GetNotificationsConnection( + $recipient: RecipientTypeWhereInput! + $first: Int! + $after: String + $dispatchBlock: Int! +) { notificationsConnection( first: $first after: $after - orderBy: createdAt_DESC - where: { inApp_eq: true, recipient: $recipient } + orderBy: [dispatchBlock_DESC, id_DESC] + where: { inApp_eq: true, recipient: $recipient, dispatchBlock_lte: $dispatchBlock } ) { pageInfo { hasNextPage diff --git a/packages/atlas/src/providers/notifications/notifications.manager.tsx b/packages/atlas/src/providers/notifications/notifications.manager.tsx index c1fe05bb97..a7f62f3a59 100644 --- a/packages/atlas/src/providers/notifications/notifications.manager.tsx +++ b/packages/atlas/src/providers/notifications/notifications.manager.tsx @@ -1,11 +1,21 @@ -import { FC, useEffect } from 'react' +import { FC, useEffect, useRef } from 'react' import { atlasConfig } from '@/config' import { useNotifications } from './notifications.hooks' +import { useJoystreamStore } from '../joystream/joystream.store' + export const NotificationsManager: FC = () => { const { fetchMore, unseenNotificationsCounts, recipient } = useNotifications() + const { currentBlock } = useJoystreamStore() + const currentBlockRef = useRef(currentBlock) + + useEffect(() => { + if (currentBlock) { + currentBlockRef.current = currentBlock + } + }, [currentBlock]) useEffect(() => { const id = setInterval(() => { @@ -15,6 +25,9 @@ export const NotificationsManager: FC = () => { unseenNotificationsCounts.fetchMore() fetchMore({ + variables: { + dispatchBlock: currentBlockRef.current, + }, updateQuery: (prev, { fetchMoreResult }) => { if (!Object.keys(prev).length) { return fetchMoreResult