From a750125b0210b9d906efcec2d807477590e4412f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Andr=C3=A9?= <583546+oandregal@users.noreply.github.com>
Date: Fri, 15 Nov 2024 10:54:05 +0100
Subject: [PATCH] DataViews list layout: hide actions menu when there is only
 one action and is primary (#67015)

Co-authored-by: oandregal <oandregal@git.wordpress.org>
Co-authored-by: Mamaduka <mamaduka@git.wordpress.org>
---
 .../src/dataviews-layouts/list/index.tsx      | 58 ++++++++++---------
 1 file changed, 31 insertions(+), 27 deletions(-)

diff --git a/packages/dataviews/src/dataviews-layouts/list/index.tsx b/packages/dataviews/src/dataviews-layouts/list/index.tsx
index a4f94e482c69b3..47b9961d97df18 100644
--- a/packages/dataviews/src/dataviews-layouts/list/index.tsx
+++ b/packages/dataviews/src/dataviews-layouts/list/index.tsx
@@ -170,11 +170,13 @@ function ListItem< Item >( {
 			( action ) => action.isPrimary && !! action.icon
 		);
 		return {
-			primaryAction: _primaryActions?.[ 0 ],
+			primaryAction: _primaryActions[ 0 ],
 			eligibleActions: _eligibleActions,
 		};
 	}, [ actions, item ] );
 
+	const hasOnlyOnePrimaryAction = primaryAction && actions.length === 1;
+
 	const renderedMediaField = mediaField?.render ? (
 		<div className="dataviews-view-list__media-wrapper">
 			<mediaField.render item={ item } />
@@ -194,33 +196,35 @@ function ListItem< Item >( {
 					item={ item }
 				/>
 			) }
-			<div role="gridcell">
-				<Menu
-					trigger={
-						<Composite.Item
-							id={ generateDropdownTriggerCompositeId(
-								idPrefix
-							) }
-							render={
-								<Button
-									size="small"
-									icon={ moreVertical }
-									label={ __( 'Actions' ) }
-									accessibleWhenDisabled
-									disabled={ ! actions.length }
-									onKeyDown={ onDropdownTriggerKeyDown }
-								/>
-							}
+			{ ! hasOnlyOnePrimaryAction && (
+				<div role="gridcell">
+					<Menu
+						trigger={
+							<Composite.Item
+								id={ generateDropdownTriggerCompositeId(
+									idPrefix
+								) }
+								render={
+									<Button
+										size="small"
+										icon={ moreVertical }
+										label={ __( 'Actions' ) }
+										accessibleWhenDisabled
+										disabled={ ! actions.length }
+										onKeyDown={ onDropdownTriggerKeyDown }
+									/>
+								}
+							/>
+						}
+						placement="bottom-end"
+					>
+						<ActionsMenuGroup
+							actions={ eligibleActions }
+							item={ item }
 						/>
-					}
-					placement="bottom-end"
-				>
-					<ActionsMenuGroup
-						actions={ eligibleActions }
-						item={ item }
-					/>
-				</Menu>
-			</div>
+					</Menu>
+				</div>
+			) }
 		</HStack>
 	);