diff --git a/app/components/notifications/bulletins.tsx b/app/components/notifications/bulletins.tsx index 55cb9f6122..25f7ec6709 100644 --- a/app/components/notifications/bulletins.tsx +++ b/app/components/notifications/bulletins.tsx @@ -1,65 +1,27 @@ +import React from "react" import { Linking } from "react-native" -import { gql } from "@apollo/client" import { useNotifications } from "." import { NotificationCardUI } from "./notification-card-ui" import { BulletinsDocument, - useBulletinsQuery, + BulletinsQuery, useStatefulNotificationAcknowledgeMutation, } from "@app/graphql/generated" import { BLINK_DEEP_LINK_PREFIX } from "@app/config" -gql` - query Bulletins($first: Int!, $after: String) { - me { - unacknowledgedStatefulNotificationsWithBulletinEnabled( - first: $first - after: $after - ) { - pageInfo { - endCursor - hasNextPage - hasPreviousPage - startCursor - } - edges { - node { - id - title - body - createdAt - acknowledgedAt - bulletinEnabled - action { - ... on OpenDeepLinkAction { - deepLink - } - ... on OpenExternalLinkAction { - url - } - } - } - cursor - } - } - } - } -` +type Props = { + loading: boolean + bulletins: BulletinsQuery | undefined +} -export const BulletinsCard: React.FC = () => { +export const BulletinsCard: React.FC = ({ loading, bulletins }) => { const { cardInfo } = useNotifications() const [ack, { loading: ackLoading }] = useStatefulNotificationAcknowledgeMutation({ refetchQueries: [BulletinsDocument], }) - const { data: bulletins, loading } = useBulletinsQuery({ - fetchPolicy: "cache-and-network", - variables: { first: 1 }, - pollInterval: 30000, - }) - if (loading) return null if ( diff --git a/app/graphql/generated.ts b/app/graphql/generated.ts index 4ffc15d8f6..daaf976938 100644 --- a/app/graphql/generated.ts +++ b/app/graphql/generated.ts @@ -2496,14 +2496,6 @@ export type InviteQueryVariables = Exact<{ [key: string]: never; }>; export type InviteQuery = { readonly __typename: 'Query', readonly me?: { readonly __typename: 'User', readonly id: string, readonly username?: string | null } | null }; -export type BulletinsQueryVariables = Exact<{ - first: Scalars['Int']['input']; - after?: InputMaybe; -}>; - - -export type BulletinsQuery = { readonly __typename: 'Query', readonly me?: { readonly __typename: 'User', readonly unacknowledgedStatefulNotificationsWithBulletinEnabled: { readonly __typename: 'StatefulNotificationConnection', readonly pageInfo: { readonly __typename: 'PageInfo', readonly endCursor?: string | null, readonly hasNextPage: boolean, readonly hasPreviousPage: boolean, readonly startCursor?: string | null }, readonly edges: ReadonlyArray<{ readonly __typename: 'StatefulNotificationEdge', readonly cursor: string, readonly node: { readonly __typename: 'StatefulNotification', readonly id: string, readonly title: string, readonly body: string, readonly createdAt: number, readonly acknowledgedAt?: number | null, readonly bulletinEnabled: boolean, readonly action?: { readonly __typename: 'OpenDeepLinkAction', readonly deepLink: string } | { readonly __typename: 'OpenExternalLinkAction', readonly url: string } | null } }> } } | null }; - export type BtcPriceListQueryVariables = Exact<{ range: PriceGraphRange; }>; @@ -2692,6 +2684,14 @@ export type HomeUnauthedQueryVariables = Exact<{ [key: string]: never; }>; export type HomeUnauthedQuery = { readonly __typename: 'Query', readonly globals?: { readonly __typename: 'Globals', readonly network: Network } | null, readonly currencyList: ReadonlyArray<{ readonly __typename: 'Currency', readonly id: string, readonly flag: string, readonly name: string, readonly symbol: string, readonly fractionDigits: number }> }; +export type BulletinsQueryVariables = Exact<{ + first: Scalars['Int']['input']; + after?: InputMaybe; +}>; + + +export type BulletinsQuery = { readonly __typename: 'Query', readonly me?: { readonly __typename: 'User', readonly unacknowledgedStatefulNotificationsWithBulletinEnabled: { readonly __typename: 'StatefulNotificationConnection', readonly pageInfo: { readonly __typename: 'PageInfo', readonly endCursor?: string | null, readonly hasNextPage: boolean, readonly hasPreviousPage: boolean, readonly startCursor?: string | null }, readonly edges: ReadonlyArray<{ readonly __typename: 'StatefulNotificationEdge', readonly cursor: string, readonly node: { readonly __typename: 'StatefulNotification', readonly id: string, readonly title: string, readonly body: string, readonly createdAt: number, readonly acknowledgedAt?: number | null, readonly bulletinEnabled: boolean, readonly action?: { readonly __typename: 'OpenDeepLinkAction', readonly deepLink: string } | { readonly __typename: 'OpenExternalLinkAction', readonly url: string } | null } }> } } | null }; + export type BusinessMapMarkersQueryVariables = Exact<{ [key: string]: never; }>; @@ -3350,76 +3350,6 @@ export type InviteQueryHookResult = ReturnType; export type InviteLazyQueryHookResult = ReturnType; export type InviteSuspenseQueryHookResult = ReturnType; export type InviteQueryResult = Apollo.QueryResult; -export const BulletinsDocument = gql` - query Bulletins($first: Int!, $after: String) { - me { - unacknowledgedStatefulNotificationsWithBulletinEnabled( - first: $first - after: $after - ) { - pageInfo { - endCursor - hasNextPage - hasPreviousPage - startCursor - } - edges { - node { - id - title - body - createdAt - acknowledgedAt - bulletinEnabled - action { - ... on OpenDeepLinkAction { - deepLink - } - ... on OpenExternalLinkAction { - url - } - } - } - cursor - } - } - } -} - `; - -/** - * __useBulletinsQuery__ - * - * To run a query within a React component, call `useBulletinsQuery` and pass it any options that fit your needs. - * When your component renders, `useBulletinsQuery` returns an object from Apollo Client that contains loading, error, and data properties - * you can use to render your UI. - * - * @param baseOptions options that will be passed into the query, supported options are listed on: https://www.apollographql.com/docs/react/api/react-hooks/#options; - * - * @example - * const { data, loading, error } = useBulletinsQuery({ - * variables: { - * first: // value for 'first' - * after: // value for 'after' - * }, - * }); - */ -export function useBulletinsQuery(baseOptions: Apollo.QueryHookOptions & ({ variables: BulletinsQueryVariables; skip?: boolean; } | { skip: boolean; }) ) { - const options = {...defaultOptions, ...baseOptions} - return Apollo.useQuery(BulletinsDocument, options); - } -export function useBulletinsLazyQuery(baseOptions?: Apollo.LazyQueryHookOptions) { - const options = {...defaultOptions, ...baseOptions} - return Apollo.useLazyQuery(BulletinsDocument, options); - } -export function useBulletinsSuspenseQuery(baseOptions?: Apollo.SuspenseQueryHookOptions) { - const options = {...defaultOptions, ...baseOptions} - return Apollo.useSuspenseQuery(BulletinsDocument, options); - } -export type BulletinsQueryHookResult = ReturnType; -export type BulletinsLazyQueryHookResult = ReturnType; -export type BulletinsSuspenseQueryHookResult = ReturnType; -export type BulletinsQueryResult = Apollo.QueryResult; export const BtcPriceListDocument = gql` query btcPriceList($range: PriceGraphRange!) { btcPriceList(range: $range) { @@ -4846,6 +4776,76 @@ export type HomeUnauthedQueryHookResult = ReturnType; export type HomeUnauthedSuspenseQueryHookResult = ReturnType; export type HomeUnauthedQueryResult = Apollo.QueryResult; +export const BulletinsDocument = gql` + query Bulletins($first: Int!, $after: String) { + me { + unacknowledgedStatefulNotificationsWithBulletinEnabled( + first: $first + after: $after + ) { + pageInfo { + endCursor + hasNextPage + hasPreviousPage + startCursor + } + edges { + node { + id + title + body + createdAt + acknowledgedAt + bulletinEnabled + action { + ... on OpenDeepLinkAction { + deepLink + } + ... on OpenExternalLinkAction { + url + } + } + } + cursor + } + } + } +} + `; + +/** + * __useBulletinsQuery__ + * + * To run a query within a React component, call `useBulletinsQuery` and pass it any options that fit your needs. + * When your component renders, `useBulletinsQuery` returns an object from Apollo Client that contains loading, error, and data properties + * you can use to render your UI. + * + * @param baseOptions options that will be passed into the query, supported options are listed on: https://www.apollographql.com/docs/react/api/react-hooks/#options; + * + * @example + * const { data, loading, error } = useBulletinsQuery({ + * variables: { + * first: // value for 'first' + * after: // value for 'after' + * }, + * }); + */ +export function useBulletinsQuery(baseOptions: Apollo.QueryHookOptions & ({ variables: BulletinsQueryVariables; skip?: boolean; } | { skip: boolean; }) ) { + const options = {...defaultOptions, ...baseOptions} + return Apollo.useQuery(BulletinsDocument, options); + } +export function useBulletinsLazyQuery(baseOptions?: Apollo.LazyQueryHookOptions) { + const options = {...defaultOptions, ...baseOptions} + return Apollo.useLazyQuery(BulletinsDocument, options); + } +export function useBulletinsSuspenseQuery(baseOptions?: Apollo.SuspenseQueryHookOptions) { + const options = {...defaultOptions, ...baseOptions} + return Apollo.useSuspenseQuery(BulletinsDocument, options); + } +export type BulletinsQueryHookResult = ReturnType; +export type BulletinsLazyQueryHookResult = ReturnType; +export type BulletinsSuspenseQueryHookResult = ReturnType; +export type BulletinsQueryResult = Apollo.QueryResult; export const BusinessMapMarkersDocument = gql` query businessMapMarkers { businessMapMarkers { diff --git a/app/screens/home-screen/home-screen.tsx b/app/screens/home-screen/home-screen.tsx index ac83dbacb5..7b93b3f1df 100644 --- a/app/screens/home-screen/home-screen.tsx +++ b/app/screens/home-screen/home-screen.tsx @@ -25,6 +25,7 @@ import { TransactionFragment, TxDirection, TxStatus, + useBulletinsQuery, useHasPromptedSetDefaultAccountQuery, useHomeAuthedQuery, useHomeUnauthedQuery, @@ -92,6 +93,41 @@ gql` fractionDigits } } + + query Bulletins($first: Int!, $after: String) { + me { + unacknowledgedStatefulNotificationsWithBulletinEnabled( + first: $first + after: $after + ) { + pageInfo { + endCursor + hasNextPage + hasPreviousPage + startCursor + } + edges { + node { + id + title + body + createdAt + acknowledgedAt + bulletinEnabled + action { + ... on OpenDeepLinkAction { + deepLink + } + ... on OpenExternalLinkAction { + url + } + } + } + cursor + } + } + } + } ` export const HomeScreen: React.FC = () => { @@ -161,6 +197,17 @@ export const HomeScreen: React.FC = () => { nextFetchPolicy: "cache-and-network", }) + // load bulletins on home screen + const { + data: bulletins, + loading: bulletinsLoading, + refetch: refetchBulletins, + } = useBulletinsQuery({ + skip: !isAuthed, + fetchPolicy: "cache-and-network", + variables: { first: 1 }, + }) + const loading = loadingAuthed || loadingPrice || loadingUnauthed || loadingSettings const refetch = React.useCallback(() => { @@ -168,8 +215,9 @@ export const HomeScreen: React.FC = () => { refetchRealtimePrice() refetchAuthed() refetchUnauthed() + refetchBulletins() } - }, [isAuthed, refetchAuthed, refetchRealtimePrice, refetchUnauthed]) + }, [isAuthed, refetchAuthed, refetchBulletins, refetchRealtimePrice, refetchUnauthed]) const pendingIncomingTransactions = dataAuthed?.me?.defaultAccount?.pendingIncomingTransactions @@ -382,7 +430,7 @@ export const HomeScreen: React.FC = () => { ))} - + {recentTransactionsData && ( <>