diff --git a/packages/dataviews/src/components/dataviews-item-actions/index.tsx b/packages/dataviews/src/components/dataviews-item-actions/index.tsx
index 20e58a2c6bb1fb..c1a1f84b99e624 100644
--- a/packages/dataviews/src/components/dataviews-item-actions/index.tsx
+++ b/packages/dataviews/src/components/dataviews-item-actions/index.tsx
@@ -59,6 +59,12 @@ interface CompactItemActionsProps< Item > {
actions: Action< Item >[];
}
+interface PrimaryActionsProps< Item > {
+ item: Item;
+ actions: Action< Item >[];
+ registry: ReturnType< typeof useRegistry >;
+}
+
function ButtonTrigger< Item >( {
action,
onClick,
@@ -179,6 +185,13 @@ export function ActionsMenuGroup< Item >( {
);
}
+function hasOnlyOneActionAndIsPrimary< Item >(
+ primaryActions: Action< Item >[],
+ actions: Action< Item >[]
+) {
+ return primaryActions.length === 1 && actions.length;
+}
+
export default function ItemActions< Item >( {
item,
actions,
@@ -199,9 +212,21 @@ export default function ItemActions< Item >( {
eligibleActions: _eligibleActions,
};
}, [ actions, item ] );
+
if ( isCompact ) {
return ;
}
+
+ if ( hasOnlyOneActionAndIsPrimary( primaryActions, actions ) ) {
+ return (
+
+ );
+ }
+
return (
( {
width: 'auto',
} }
>
- { !! primaryActions.length &&
- primaryActions.map( ( action ) => {
- if ( 'RenderModal' in action ) {
- return (
-
- );
- }
- return (
- {
- action.callback( [ item ], { registry } );
- } }
- items={ [ item ] }
- />
- );
- } ) }
+
);
@@ -262,3 +269,36 @@ function CompactItemActions< Item >( {
);
}
+
+function PrimaryActions< Item >( {
+ item,
+ actions,
+ registry,
+}: PrimaryActionsProps< Item > ) {
+ if ( ! Array.isArray( actions ) || actions.length === 0 ) {
+ return null;
+ }
+
+ return actions.map( ( action ) => {
+ if ( 'RenderModal' in action ) {
+ return (
+
+ );
+ }
+ return (
+ {
+ action.callback( [ item ], { registry } );
+ } }
+ items={ [ item ] }
+ />
+ );
+ } );
+}