@automattic/data-stores 3.2.0 → 3.2.1

package/src/queries/use-bulk-domain-update-status-query.ts

@@ -1,130 +1,29 @@
+import {
+	type BulkDomainUpdateStatusQueryFnData,
+	type BulkDomainUpdateStatusResult,
+} from '@automattic/api-core';
+import { bulkDomainUpdateStatusQuery } from '@automattic/api-queries';
 import { type UseQueryOptions, useQuery } from '@tanstack/react-query';
-import wpcomRequest from 'wpcom-proxy-request';
-
-export interface BulkDomainUpdateStatus {
-	results: {
-		[ key: string ]: '' | 'success' | 'failed';
-	};
-	action: 'set_auto_renew' | 'update_contact_info';
-	created_at: number;
-	auto_renew?: boolean;
-	whois?: unknown;
-	transfer_lock?: boolean;
-}
-
-export interface BulkDomainUpdateStatusQueryFnData {
-	[ key: string ]: BulkDomainUpdateStatus;
-}
-
-export interface JobStatus {
-	id: string;
-	action: 'set_auto_renew' | 'update_contact_info';
-	created_at: number;
-	success: string[];
-	failed: string[];
-	pending: string[];
-	complete: boolean;
-	params: {
-		auto_renew?: boolean;
-		whois?: unknown;
-		transfer_lock?: boolean;
-	};
-}
-
-interface DomainUpdateRemoteStatus {
-	status: '' | 'success' | 'failed';
-	action: 'set_auto_renew' | 'update_contact_info';
-	created_at: number;
-	auto_renew?: boolean;
-	whois?: unknown;
-	transfer_lock?: boolean;
-}
-
-interface DomainUpdateDerivedStatus {
-	status: '';
-	message: string;
-	created_at: number;
-}
-
-export type DomainUpdateStatus = DomainUpdateRemoteStatus | DomainUpdateDerivedStatus;
 
 export const getBulkDomainUpdateStatusQueryKey = () => {
-	return [ 'domains', 'bulk-actions' ];
+	return bulkDomainUpdateStatusQuery().queryKey;
 };
 
-export interface BulkDomainUpdateStatusResult {
-	domainResults: Map< string, DomainUpdateStatus[] >;
-	completedJobs: JobStatus[];
-}
-
-export function useBulkDomainUpdateStatusQuery< TError = unknown >(
+export function useBulkDomainUpdateStatusQuery(
 	pollingInterval: number,
 	options: Omit<
-		UseQueryOptions< BulkDomainUpdateStatusQueryFnData, TError, BulkDomainUpdateStatusResult >,
+		UseQueryOptions<
+			BulkDomainUpdateStatusQueryFnData,
+			Error,
+			BulkDomainUpdateStatusResult,
+			string[]
+		>,
 		'queryKey'
 	> = {}
 ) {
 	return useQuery( {
-		queryFn: () =>
-			wpcomRequest< BulkDomainUpdateStatusQueryFnData >( {
-				path: '/domains/bulk-actions',
-				apiNamespace: 'wpcom/v2',
-			} ),
-		select: ( data ): BulkDomainUpdateStatusResult => {
-			// get top-level info about recent jobs
-			const allJobs: JobStatus[] = Object.keys( data ).map( ( jobId ) => {
-				const { action, created_at, results, ...rest } = data[ jobId ];
-				const success: string[] = [];
-				const failed: string[] = [];
-				const pending: string[] = [];
-
-				Object.entries( results ).forEach( ( entry ) => {
-					if ( entry[ 1 ] === 'success' ) {
-						success.push( entry[ 0 ] );
-					} else if ( entry[ 1 ] === 'failed' ) {
-						failed.push( entry[ 0 ] );
-					} else {
-						pending.push( entry[ 0 ] );
-					}
-				} );
-
-				return {
-					id: jobId,
-					action: action,
-					created_at: created_at,
-					success,
-					failed,
-					pending,
-					complete: pending.length === 0,
-					params: rest,
-				};
-			} );
-
-			// get domain-level updates that can be shown inline in the table rows
-			const domainResults = new Map< string, DomainUpdateStatus[] >();
-
-			Object.keys( data ).forEach( ( jobId ) => {
-				// only create domain-level results for jobs that
-				// are still running
-				if ( ! allJobs.find( ( job ) => job.id === jobId )?.complete ) {
-					const entry = data[ jobId ] as BulkDomainUpdateStatus;
-					const { results, ...rest } = entry;
-					Object.keys( results ).forEach( ( domain ) => {
-						if ( ! domainResults.has( domain ) ) {
-							domainResults.set( domain, [] );
-						}
-						const status = results[ domain ];
-						domainResults.get( domain )?.push( { ...rest, status } );
-					} );
-				}
-			} );
-
-			const completedJobs = allJobs.filter( ( job ) => job.complete );
-
-			return { domainResults, completedJobs };
-		},
+		...bulkDomainUpdateStatusQuery(),
 		refetchInterval: pollingInterval,
 		...options,
-		queryKey: getBulkDomainUpdateStatusQueryKey(),
 	} );
 }

package/src/queries/use-happiness-engineers-query.ts

@@ -1,5 +1,5 @@
 import { useQuery } from '@tanstack/react-query';
-import wpcomRequest from 'wpcom-proxy-request';
+import wpcomRequest from '../wpcom-request';
 
 export const useHappinessEngineersQuery = () =>
 	useQuery<

package/src/queries/use-launchpad.ts

@@ -3,7 +3,7 @@ import * as oauthToken from '@automattic/oauth-token';
 import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
 import apiFetch from '@wordpress/api-fetch';
 import { addQueryArgs } from '@wordpress/url';
-import wpcomRequest, { canAccessWpcomApis } from 'wpcom-proxy-request';
+import wpcomRequest, { canAccessWpcomApis } from '../wpcom-request';
 
 interface APIFetchOptions {
 	global: boolean;

package/src/queries/use-site-domains-query.ts

@@ -1,5 +1,5 @@
 import { UseQueryOptions, useQuery } from '@tanstack/react-query';
-import wpcomRequest from 'wpcom-proxy-request';
+import wpcomRequest from '../wpcom-request';
 
 interface DnssecRecords {
 	dnskey?: string;

package/src/queries/use-site-intent.ts

@@ -1,6 +1,6 @@
 import { useQuery } from '@tanstack/react-query';
-import wpcomRequest from 'wpcom-proxy-request';
 import { SiteIntent } from '../onboard';
+import wpcomRequest from '../wpcom-request';
 
 export function useSiteIntent( siteId: string | number | undefined ) {
 	return useQuery< {

package/src/queries/use-site-query.ts

@@ -1,6 +1,6 @@
 import { SiteDetails } from '@automattic/data-stores/src/site';
 import { UseQueryOptions, useQuery } from '@tanstack/react-query';
-import wpcomRequest from 'wpcom-proxy-request';
+import wpcomRequest from '../wpcom-request';
 
 export function useSiteQuery< TError = unknown, TData = SiteDetails >(
 	sourceSiteSlug: string | number | null | undefined,

package/src/reader/contexts/index.ts

@@ -1,7 +1,3 @@
-export {
-	UnsubscribedFeedsSearchProvider,
-	useUnsubscribedFeedsSearch,
-} from './unsubscribed-feeds-search';
 export {
 	SiteSubscriptionsQueryPropsProvider,
 	useSiteSubscriptionsQueryProps,

package/src/reader/helpers/index.ts

@@ -1,5 +1,5 @@
 import apiFetch, { APIFetchOptions } from '@wordpress/api-fetch';
-import wpcomRequest from 'wpcom-proxy-request';
+import wpcomRequest from '../../wpcom-request';
 import isValidId from './validators';
 
 type callApiParams = {
@@ -47,7 +47,7 @@ async function callApi< ReturnType >( {
 			? `https://public-api.wordpress.com/wpcom/v2${ path }`
 			: `https://public-api.wordpress.com/rest/v${ apiVersion }${ path }`;
 
-	return apiFetch( {
+	const res = await apiFetch( {
 		global: true,
 		path: apiPath,
 		apiVersion,
@@ -59,6 +59,7 @@ async function callApi< ReturnType >( {
 			'Content-Type': 'application/json',
 		},
 	} as APIFetchOptions );
+	return res as ReturnType;
 }
 
 interface PagedResult< T > {

package/src/reader/helpers/optimistic-update.ts

@@ -1,3 +1,4 @@
+import { getSiteSubscriptionsQueryKey } from '@automattic/api-queries';
 import { QueryClient } from '@tanstack/react-query';
 import { SiteSubscriptionDetails } from '../types';
 import { buildQueryKey } from './index';
@@ -66,7 +67,7 @@ const invalidateSiteSubscriptionDetails = (
 	queryClient: QueryClient,
 	{ blogId, subscriptionId, isLoggedIn, id }: SiteSubScriptionDetailsParameters
 ) => {
-	queryClient.invalidateQueries( { queryKey: [ 'read', 'site-subscriptions' ] } );
+	queryClient.invalidateQueries( { queryKey: getSiteSubscriptionsQueryKey() } );
 	queryClient.invalidateQueries( {
 		queryKey: buildQueryKey( [ 'read', 'site-subscription-details', blogId ], isLoggedIn, id ),
 	} );

package/src/reader/index.ts

@@ -17,6 +17,7 @@ import {
 } from './mutations';
 import {
 	siteSubscriptionsQueryKeyPrefix,
+	subscriptionsCountQueryKeyPrefix,
 	usePendingPostSubscriptionsQuery,
 	usePendingSiteSubscriptionsQuery,
 	usePostSubscriptionsQuery,
@@ -29,6 +30,7 @@ import {
 export const SubscriptionManager = {
 	SiteSubscriptionsQueryPropsProvider,
 	siteSubscriptionsQueryKeyPrefix,
+	subscriptionsCountQueryKeyPrefix,
 	useCacheKey,
 	useIsLoggedIn,
 	usePendingPostConfirmMutation,
@@ -63,8 +65,4 @@ export {
 	SiteSubscriptionsSortBy,
 } from './constants';
 export { callApi, isErrorResponse, isSiteSubscriptionDetails, isValidId } from './helpers';
-export { UnsubscribedFeedsSearchProvider, useUnsubscribedFeedsSearch } from './contexts';
-export { useReadFeedSearchQuery, useReadFeedSiteQuery, useReadFeedQuery } from './queries';
-
 export * from './types';
-export type { FeedItem } from './queries';

package/src/reader/mutations/test/use-site-subscription-mutations.test.tsx

@@ -0,0 +1,208 @@
+/**
+ * @jest-environment jsdom
+ */
+import {
+	getSiteSubscriptionsQueryKey,
+	type SiteSubscriptionsInfiniteData,
+} from '@automattic/api-queries';
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+import { act, renderHook, waitFor } from '@testing-library/react';
+import React from 'react';
+import { callApi } from '../../helpers';
+import useSiteSubscribeMutation from '../../mutations/use-site-subscribe-mutation';
+import useSiteUnsubscribeMutation from '../../mutations/use-site-unsubscribe-mutation';
+import type { SiteSubscriptionItem } from '../../types';
+import type { ReactNode } from 'react';
+
+jest.mock( '../../hooks', () => ( {
+	useIsLoggedIn: jest.fn().mockReturnValue( { isLoggedIn: true, id: 1 } ),
+	useCacheKey: jest.fn( ( key ) => [ ...key, true, 1 ] ),
+} ) );
+
+jest.mock( '../../helpers', () => ( {
+	...jest.requireActual( '../../helpers' ),
+	callApi: jest.fn(),
+} ) );
+
+const makeQueryClient = () => new QueryClient( { defaultOptions: { queries: { retry: false } } } );
+
+const makeWrapper = ( queryClient: QueryClient ) =>
+	function Wrapper( { children }: { children: ReactNode } ) {
+		return <QueryClientProvider client={ queryClient }>{ children }</QueryClientProvider>;
+	};
+
+const makeSubscription = (
+	overrides: Partial< SiteSubscriptionItem > = {}
+): SiteSubscriptionItem => ( {
+	ID: 123,
+	URL: 'https://example.com',
+	feed_URL: 'https://example.com/feed',
+	blog_ID: 123,
+	feed_ID: 456,
+	is_following: true,
+	isDeleted: false,
+	...overrides,
+} );
+
+const makeSiteSubscriptionsData = (
+	subscriptions: SiteSubscriptionItem[],
+	totalCount = subscriptions.length
+): SiteSubscriptionsInfiniteData => ( {
+	pages: [
+		{
+			subscriptions,
+			totalCount,
+			page: 1,
+			number: 200,
+		},
+	],
+	pageParams: [ 1 ],
+} );
+
+const getCachedSubscriptions = ( queryClient: QueryClient ) =>
+	queryClient.getQueryData< SiteSubscriptionsInfiniteData >( getSiteSubscriptionsQueryKey() )
+		?.pages[ 0 ];
+
+describe( 'site subscription mutations', () => {
+	beforeEach( () => {
+		jest.clearAllMocks();
+	} );
+
+	it( 'optimistically restores a deleted site subscription and increments total count', async () => {
+		const queryClient = makeQueryClient();
+		queryClient.setQueryData(
+			getSiteSubscriptionsQueryKey(),
+			makeSiteSubscriptionsData(
+				[ makeSubscription( { is_following: false, isDeleted: true } ) ],
+				0
+			)
+		);
+		( callApi as jest.Mock ).mockResolvedValue( { subscribed: true } );
+
+		const { result } = renderHook( () => useSiteSubscribeMutation(), {
+			wrapper: makeWrapper( queryClient ),
+		} );
+
+		act( () => {
+			result.current.mutate( {
+				blog_id: 123,
+				url: 'https://example.com/feed',
+				doNotInvalidateSiteSubscriptions: true,
+			} );
+		} );
+
+		await waitFor( () => expect( callApi ).toHaveBeenCalled() );
+		const page = getCachedSubscriptions( queryClient );
+		expect( page?.totalCount ).toBe( 1 );
+		expect( page?.subscriptions[ 0 ] ).toMatchObject( {
+			is_following: true,
+			isDeleted: false,
+		} );
+	} );
+
+	it( 'rolls back site subscription restore when subscribe fails', async () => {
+		const queryClient = makeQueryClient();
+		const previousData = makeSiteSubscriptionsData(
+			[ makeSubscription( { is_following: false, isDeleted: true } ) ],
+			0
+		);
+		queryClient.setQueryData( getSiteSubscriptionsQueryKey(), previousData );
+		( callApi as jest.Mock ).mockRejectedValue( new Error( 'subscribe failed' ) );
+
+		const { result } = renderHook( () => useSiteSubscribeMutation(), {
+			wrapper: makeWrapper( queryClient ),
+		} );
+
+		act( () => {
+			result.current.mutate( {
+				blog_id: 123,
+				url: 'https://example.com/feed',
+				doNotInvalidateSiteSubscriptions: true,
+			} );
+		} );
+
+		await waitFor( () => expect( result.current.isError ).toBe( true ) );
+		expect( queryClient.getQueryData( getSiteSubscriptionsQueryKey() ) ).toEqual( previousData );
+	} );
+
+	it( 'optimistically marks a site subscription deleted and decrements total count', async () => {
+		const queryClient = makeQueryClient();
+		queryClient.setQueryData(
+			getSiteSubscriptionsQueryKey(),
+			makeSiteSubscriptionsData( [ makeSubscription() ], 1 )
+		);
+		( callApi as jest.Mock ).mockResolvedValue( { subscribed: false } );
+
+		const { result } = renderHook( () => useSiteUnsubscribeMutation(), {
+			wrapper: makeWrapper( queryClient ),
+		} );
+
+		act( () => {
+			result.current.mutate( {
+				subscriptionId: 123,
+				blog_id: 123,
+				doNotInvalidateSiteSubscriptions: true,
+			} );
+		} );
+
+		await waitFor( () => expect( callApi ).toHaveBeenCalled() );
+		const page = getCachedSubscriptions( queryClient );
+		expect( page?.totalCount ).toBe( 0 );
+		expect( page?.subscriptions[ 0 ] ).toMatchObject( {
+			is_following: false,
+			isDeleted: true,
+			resubscribed: false,
+		} );
+	} );
+
+	it( 'does not decrement total count when unsubscribe cannot match a cached subscription', async () => {
+		const queryClient = makeQueryClient();
+		queryClient.setQueryData(
+			getSiteSubscriptionsQueryKey(),
+			makeSiteSubscriptionsData( [ makeSubscription( { ID: 456, blog_ID: 456 } ) ], 1 )
+		);
+		( callApi as jest.Mock ).mockResolvedValue( { subscribed: false } );
+
+		const { result } = renderHook( () => useSiteUnsubscribeMutation(), {
+			wrapper: makeWrapper( queryClient ),
+		} );
+
+		act( () => {
+			result.current.mutate( {
+				subscriptionId: 123,
+				blog_id: 123,
+				doNotInvalidateSiteSubscriptions: true,
+			} );
+		} );
+
+		await waitFor( () => expect( callApi ).toHaveBeenCalled() );
+		const page = getCachedSubscriptions( queryClient );
+		expect( page?.totalCount ).toBe( 1 );
+		expect( page?.subscriptions[ 0 ] ).toMatchObject( {
+			is_following: true,
+			isDeleted: false,
+		} );
+	} );
+
+	it( 'rolls back site subscription delete when unsubscribe fails', async () => {
+		const queryClient = makeQueryClient();
+		const previousData = makeSiteSubscriptionsData( [ makeSubscription() ], 1 );
+		queryClient.setQueryData( getSiteSubscriptionsQueryKey(), previousData );
+		( callApi as jest.Mock ).mockRejectedValue( new Error( 'unsubscribe failed' ) );
+
+		const { result } = renderHook( () => useSiteUnsubscribeMutation(), {
+			wrapper: makeWrapper( queryClient ),
+		} );
+
+		act( () => {
+			result.current.mutate( {
+				subscriptionId: 123,
+				blog_id: 123,
+				doNotInvalidateSiteSubscriptions: true,
+			} );
+		} );
+
+		await waitFor( () => expect( result.current.isError ).toBe( true ) );
+		expect( queryClient.getQueryData( getSiteSubscriptionsQueryKey() ) ).toEqual( previousData );
+	} );
+} );

package/src/reader/mutations/use-pending-site-confirm-mutation.ts

@@ -1,7 +1,7 @@
+import { getSiteSubscriptionsQueryKey } from '@automattic/api-queries';
 import { useMutation, useQueryClient } from '@tanstack/react-query';
 import { callApi } from '../helpers';
 import { useCacheKey, useIsLoggedIn } from '../hooks';
-import { siteSubscriptionsQueryKeyPrefix } from '../queries';
 import { subscriptionsCountQueryKeyPrefix } from '../queries/use-subscriptions-count-query';
 import { PendingSiteSubscriptionsResult, SubscriptionManagerSubscriptionsCount } from '../types';
 
@@ -17,7 +17,7 @@ type PendingSiteConfirmResponse = {
 const usePendingSiteConfirmMutation = () => {
 	const { isLoggedIn } = useIsLoggedIn();
 	const queryClient = useQueryClient();
-	const subscriptionsCacheKey = useCacheKey( siteSubscriptionsQueryKeyPrefix );
+	const subscriptionsCacheKey = getSiteSubscriptionsQueryKey();
 	const countCacheKey = useCacheKey( subscriptionsCountQueryKeyPrefix );
 
 	return useMutation( {

package/src/reader/mutations/use-site-delivery-frequency-mutation.ts

@@ -1,16 +1,16 @@
+import {
+	getSiteSubscriptionsQueryKey,
+	type SiteSubscriptionsInfiniteData,
+} from '@automattic/api-queries';
 import { useMutation, useQueryClient } from '@tanstack/react-query';
 import { EmailDeliveryFrequency } from '../constants';
-import { callApi, applyCallbackToPages, buildQueryKey } from '../helpers';
+import { callApi } from '../helpers';
 import {
 	alterSiteSubscriptionDetails,
 	invalidateSiteSubscriptionDetails,
 } from '../helpers/optimistic-update';
 import { useIsLoggedIn } from '../hooks';
-import type {
-	PagedQueryResult,
-	SiteSubscriptionsResponseItem,
-	SiteSubscriptionDetails,
-} from '../types';
+import type { SiteSubscriptionDetails } from '../types';
 
 type SiteSubscriptionDeliveryFrequencyParams = {
 	delivery_frequency: EmailDeliveryFrequency;
@@ -63,39 +63,35 @@ const useSiteDeliveryFrequencyMutation = () => {
 			return response;
 		},
 		onMutate: async ( { blog_id, delivery_frequency, subscriptionId } ) => {
-			const siteSubscriptionsCacheKey = buildQueryKey(
-				[ 'read', 'site-subscriptions' ],
-				isLoggedIn,
-				id
-			);
+			const siteSubscriptionsCacheKey = getSiteSubscriptionsQueryKey();
 
 			await queryClient.cancelQueries( { queryKey: siteSubscriptionsCacheKey } );
 
 			const previousSiteSubscriptions =
-				queryClient.getQueryData<
-					PagedQueryResult< SiteSubscriptionsResponseItem, 'subscriptions' >
-				>( siteSubscriptionsCacheKey );
-			const mutatedSiteSubscriptions = applyCallbackToPages<
-				'subscriptions',
-				SiteSubscriptionsResponseItem
-			>( previousSiteSubscriptions, ( page ) => ( {
-				...page,
-				subscriptions: page.subscriptions.map( ( siteSubscription ) => {
-					if ( siteSubscription.blog_ID === blog_id ) {
-						return {
-							...siteSubscription,
-							delivery_methods: {
-								...siteSubscription.delivery_methods,
-								email: {
-									...( siteSubscription.delivery_methods?.email ?? { send_posts: false } ),
-									post_delivery_frequency: delivery_frequency,
-								},
-							},
-						};
-					}
-					return siteSubscription;
-				} ),
-			} ) );
+				queryClient.getQueryData< SiteSubscriptionsInfiniteData >( siteSubscriptionsCacheKey );
+			const mutatedSiteSubscriptions = previousSiteSubscriptions
+				? {
+						...previousSiteSubscriptions,
+						pages: previousSiteSubscriptions.pages.map( ( page ) => ( {
+							...page,
+							subscriptions: page.subscriptions.map( ( siteSubscription ) => {
+								if ( Number( siteSubscription.blog_ID ) === Number( blog_id ) ) {
+									return {
+										...siteSubscription,
+										delivery_methods: {
+											...siteSubscription.delivery_methods,
+											email: {
+												...( siteSubscription.delivery_methods?.email ?? { send_posts: false } ),
+												post_delivery_frequency: delivery_frequency,
+											},
+										},
+									};
+								}
+								return siteSubscription;
+							} ),
+						} ) ),
+				  }
+				: previousSiteSubscriptions;
 			queryClient.setQueryData( siteSubscriptionsCacheKey, mutatedSiteSubscriptions );
 
 			const previousSiteSubscriptionDetails = await alterSiteSubscriptionDetails(
@@ -122,7 +118,7 @@ const useSiteDeliveryFrequencyMutation = () => {
 		},
 		onError: ( err, _, context ) => {
 			queryClient.setQueryData(
-				buildQueryKey( [ 'read', 'site-subscriptions' ], isLoggedIn, id ),
+				getSiteSubscriptionsQueryKey(),
 				context?.previousSiteSubscriptions
 			);
 			if ( context?.previousSiteSubscriptionDetails ) {

package/src/reader/mutations/use-site-email-me-new-comments-mutation.ts

@@ -1,11 +1,15 @@
+import {
+	getSiteSubscriptionsQueryKey,
+	type SiteSubscriptionsInfiniteData,
+} from '@automattic/api-queries';
 import { useMutation, useQueryClient } from '@tanstack/react-query';
-import { buildQueryKey, callApi } from '../helpers';
+import { callApi } from '../helpers';
 import {
 	alterSiteSubscriptionDetails,
 	invalidateSiteSubscriptionDetails,
 } from '../helpers/optimistic-update';
 import { useIsLoggedIn } from '../hooks';
-import type { SiteSubscriptionsPages, SiteSubscriptionDetails } from '../types';
+import type { SiteSubscriptionDetails } from '../types';
 
 type SiteSubscriptionEmailMeNewCommentsParams = {
 	send_comments: boolean;
@@ -50,16 +54,12 @@ const useSiteEmailMeNewCommentsMutation = () => {
 			return response;
 		},
 		onMutate: async ( { blog_id, send_comments, subscriptionId } ) => {
-			const siteSubscriptionsQueryKey = buildQueryKey(
-				[ 'read', 'site-subscriptions' ],
-				isLoggedIn,
-				id
-			);
+			const siteSubscriptionsQueryKey = getSiteSubscriptionsQueryKey();
 
 			await queryClient.cancelQueries( { queryKey: siteSubscriptionsQueryKey } );
 
 			const previousSiteSubscriptions =
-				queryClient.getQueryData< SiteSubscriptionsPages >( siteSubscriptionsQueryKey );
+				queryClient.getQueryData< SiteSubscriptionsInfiniteData >( siteSubscriptionsQueryKey );
 
 			if ( previousSiteSubscriptions ) {
 				queryClient.setQueryData( siteSubscriptionsQueryKey, {
@@ -68,7 +68,7 @@ const useSiteEmailMeNewCommentsMutation = () => {
 						return {
 							...page,
 							subscriptions: page.subscriptions.map( ( siteSubscription ) => {
-								if ( siteSubscription.blog_ID === blog_id ) {
+								if ( Number( siteSubscription.blog_ID ) === Number( blog_id ) ) {
 									return {
 										...siteSubscription,
 										delivery_methods: {
@@ -112,7 +112,7 @@ const useSiteEmailMeNewCommentsMutation = () => {
 		onError: ( _err, _, context ) => {
 			if ( context?.previousSiteSubscriptions ) {
 				queryClient.setQueryData(
-					buildQueryKey( [ 'read', 'site-subscriptions' ], isLoggedIn, id ),
+					getSiteSubscriptionsQueryKey(),
 					context.previousSiteSubscriptions
 				);
 			}