Removing the last subscriber of the last page goes to previous page (#…

…85587) * Removing the last subscriber of the last page goes to previous page * Using pages value instead of substracting one
Automattic · Dec 21, 2023 · f7e7eeb · f7e7eeb
1 parent 3acc72d
commit f7e7eeb
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 3 deletions.
diff --git a/...t/my-sites/subscribers/components/subscriber-list-container/subscriber-list-container.tsx b/...t/my-sites/subscribers/components/subscriber-list-container/subscriber-list-container.tsx
@@ -1,4 +1,5 @@
 import { numberFormat, translate } from 'i18n-calypso';
+import { useEffect } from 'react';
 import Pagination from 'calypso/components/pagination';
 import { EmptyListView } from 'calypso/my-sites/subscribers/components/empty-list-view';
 import { NoSearchResults } from 'calypso/my-sites/subscribers/components/no-search-results';
@@ -12,7 +13,6 @@ import isAtomicSite from 'calypso/state/selectors/is-site-automated-transfer';
 import { isSimpleSite } from 'calypso/state/sites/selectors';
 import { useRecordSearch } from '../../tracks';
 import { GrowYourAudience } from '../grow-your-audience';
-
 import './style.scss';
 
 type SubscriberListContainerProps = {
@@ -26,14 +26,29 @@ const SubscriberListContainer = ( {
 	onClickView,
 	onClickUnsubscribe,
 }: SubscriberListContainerProps ) => {
-	const { grandTotal, total, perPage, page, pageChangeCallback, searchTerm, isLoading } =
-		useSubscribersPage();
+	const {
+		grandTotal,
+		total,
+		perPage,
+		page,
+		pageChangeCallback,
+		searchTerm,
+		isLoading,
+		subscribers,
+		pages,
+	} = useSubscribersPage();
 	useRecordSearch();
 
 	const isSimple = useSelector( isSimpleSite );
 	const isAtomic = useSelector( ( state ) => isAtomicSite( state, siteId ) );
 	const EmptyComponent = isSimple || isAtomic ? SubscriberLaunchpad : EmptyListView;
 
+	useEffect( () => {
+		if ( ! isLoading && subscribers.length === 0 && page > 1 ) {
+			pageChangeCallback( pages ?? 0 );
+		}
+	}, [ isLoading, subscribers, page, pageChangeCallback ] );
+
 	return (
 		<section className="subscriber-list-container">
 			{ ! isLoading && ( Boolean( grandTotal ) || searchTerm ) && (

diff --git a/client/my-sites/subscribers/components/subscribers-page/subscribers-page-context.tsx b/client/my-sites/subscribers/components/subscribers-page/subscribers-page-context.tsx
@@ -49,6 +49,7 @@ type SubscribersPageContextProps = {
 	closeAllModals: typeof closeAllModals;
 	siteId: number | null;
 	isLoading: boolean;
+	pages?: number;
 };
 
 const SubscribersPageContext = createContext< SubscribersPageContextProps | undefined >(
@@ -112,6 +113,7 @@ export const SubscribersPageProvider = ( {
 		filterOption: subscriberType,
 	} );
 	const grandTotal = subscribersQueryResult.data?.total || 0;
+	const pages = subscribersQueryResult.data?.pages || 0;
 
 	const { pageChangeCallback } = usePagination(
 		pageNumber,
@@ -220,6 +222,7 @@ export const SubscribersPageProvider = ( {
 				migrateSubscribersCallback,
 				siteId,
 				isLoading: subscribersQueryResult.isLoading,
+				pages,
 			} }
 		>
 			{ children }