Only show card placeholder for item that is updating, not the whole list (https://github.com/woocommerce/woocommerce-admin/pull/5845)

* Only show card placeholder for item that is updating, not the whole list

* Always merge reviews

plugins/woocommerce-admin/client/homescreen/activity-panel/reviews/index.js

@@ -149,7 +149,7 @@ class ReviewsPanel extends Component {
 				review._embedded.up[ 0 ] ) ||
 			null;
 
-		if ( review.isUpdating || this.props.isRequesting ) {
+		if ( review.isUpdating ) {
 			return (
 				<ActivityCardPlaceholder
 					key={ review.id }
@@ -160,7 +160,7 @@ class ReviewsPanel extends Component {
 				/>
 			);
 		}
-		if ( isNull( product ) ) {
+		if ( isNull( product ) || review.status !== reviewsQuery.status ) {
 			return null;
 		}
 
@@ -292,14 +292,15 @@ class ReviewsPanel extends Component {
 	}
 
 	renderReviews( reviews ) {
-		if ( reviews.length === 0 ) {
+		const renderedReviews = reviews.map( ( review ) =>
+			this.renderReview( review, this.props )
+		);
+		if ( renderedReviews.filter( Boolean ).length === 0 ) {
 			return <></>;
 		}
 		return (
 			<>
-				{ reviews.map( ( review ) =>
-					this.renderReview( review, this.props )
-				) }
+				{ renderedReviews }
 				<Link
 					href={ getAdminLink(
 						'edit-comments.php?comment_type=review'
@@ -351,7 +352,7 @@ class ReviewsPanel extends Component {
 							lines={ 1 }
 						/>
 					) : (
-						<>{ this.renderReviews( reviews, this.props ) }</>
+						<>{ this.renderReviews( reviews ) }</>
 					) }
 				</Section>
 			</Fragment>

plugins/woocommerce-admin/packages/data/src/reviews/reducer.js

@@ -25,7 +25,10 @@ const reducer = (
 			const ids = [];
 			const nextReviews = reviews.reduce( ( result, review ) => {
 				ids.push( review.id );
-				result[ review.id ] = review;
+				result[ review.id ] = {
+					...( state.data[ review.id ] || {} ),
+					...review,
+				};
 				return result;
 			}, {} );
 			return {

plugins/woocommerce-admin/packages/data/src/reviews/test/reducer.js

@@ -46,8 +46,43 @@ describe( 'reviews reducer', () => {
 		).toBeTruthy();
 
 		expect( state.reviews[ stringifiedQuery ].totalCount ).toBe( 45 );
-		expect( state.data[ '1' ] ).toBe( reviews[ 0 ] );
-		expect( state.data[ '2' ] ).toBe( reviews[ 1 ] );
+		expect( state.data[ '1' ] ).toEqual( reviews[ 0 ] );
+		expect( state.data[ '2' ] ).toEqual( reviews[ 1 ] );
+	} );
+
+	it( 'should handle UPDATE_REVIEWS with _fields, only update updated fields', () => {
+		const reviews = [ { id: 1 }, { id: 2 } ];
+		const totalCount = 45;
+		const query = { status: 'flavortown', _fields: [ 'id' ] };
+		const state = reducer(
+			{
+				...defaultState,
+				data: {
+					1: { id: 1, review: 'Yum!' },
+					2: { id: 2, review: 'Dynamite!' },
+				},
+			},
+			{
+				type: TYPES.UPDATE_REVIEWS,
+				reviews,
+				query,
+				totalCount,
+			}
+		);
+
+		const stringifiedQuery = JSON.stringify( query );
+
+		expect( state.reviews[ stringifiedQuery ].data ).toHaveLength( 2 );
+		expect(
+			state.reviews[ stringifiedQuery ].data.includes( 1 )
+		).toBeTruthy();
+		expect(
+			state.reviews[ stringifiedQuery ].data.includes( 2 )
+		).toBeTruthy();
+
+		expect( state.reviews[ stringifiedQuery ].totalCount ).toBe( 45 );
+		expect( state.data[ '1' ].review ).toEqual( 'Yum!' );
+		expect( state.data[ '2' ].review ).toEqual( 'Dynamite!' );
 	} );
 
 	it( 'should handle SET_ERROR', () => {