Reader: Update action button link of an empty list of a user profile

client/reader/list-stream/empty.tsx

@@ -0,0 +1,50 @@
+import DOMPurify from 'dompurify';
+import { useTranslate } from 'i18n-calypso';
+import { useEffect } from 'react';
+import EmptyContent from 'calypso/components/empty-content';
+
+export default function ListEmptyContent(): JSX.Element {
+	const translate = useTranslate();
+	const queryParams = new URLSearchParams( location.search );
+	const lastPageLink = DOMPurify.sanitize( queryParams.get( 'last_page' ) ?? '' );
+
+	useEffect( (): void => {
+		// For clean URL remove last_page query param.
+		if ( lastPageLink ) {
+			const url = new URL( window.location.href );
+
+			url.searchParams.delete( 'last_page' );
+			history.replaceState( null, '', url );
+		}
+	}, [ lastPageLink ] );
+
+	function lastPageIsUserProfileLists(): boolean {
+		return /^\/read\/users\/[a-z0-9]+\/lists$/.test( lastPageLink );
+	}
+
+	function getActionBtnLink(): string {
+		return lastPageIsUserProfileLists() ? lastPageLink : '/read';
+	}
+
+	function getActionBtnText(): string {
+		return lastPageIsUserProfileLists()
+			? translate( 'Back to User Profile' )
+			: translate( 'Back to Following' );
+	}
+
+	const action = (
+		<a className="empty-content__action button is-primary" href={ getActionBtnLink() }>
+			{ getActionBtnText() }
+		</a>
+	);
+
+	return (
+		<EmptyContent
+			title={ translate( 'No recent posts' ) }
+			line={ translate( 'The sites in this list have not posted anything recently.' ) }
+			action={ action }
+			illustration="/calypso/images/illustrations/illustration-empty-results.svg"
+			illustrationWidth={ 400 }
+		/>
+	);
+}

client/reader/user-profile/views/lists.tsx

@@ -6,6 +6,7 @@ import EmptyContent from 'calypso/components/empty-content';
 import { UserData } from 'calypso/lib/user/user';
 import { List } from 'calypso/reader/list-manage/types';
 import UserProfileHeader from 'calypso/reader/user-profile/components/user-profile-header';
+import { getUserProfileUrl } from 'calypso/reader/user-profile/user-profile.utils';
 import { requestUserLists } from 'calypso/state/reader/lists/actions';
 
 interface AppState {
@@ -54,14 +55,16 @@ const UserLists = ( { user, requestUserLists, lists, isLoading }: UserListsProps
 		);
 	}
 
+	const userProfileListsUrl = `${ getUserProfileUrl( user.ID ) }/lists`;
+
 	return (
 		<div className="user-profile__lists">
 			<UserProfileHeader user={ user } />
 			<div className="user-profile__lists-body">
 				{ lists.map( ( list: List ) => (
 					<a
 						className="user-profile__lists-body-link"
-						href={ `/read/list/${ list.owner }/${ list.slug }` }
+						href={ `/read/list/${ list.owner }/${ list.slug }?last_page=${ userProfileListsUrl }` }
 						key={ list.ID }
 					>
 						<div className="card reader-post-card is-compact is-clickable">