feat(actions): Add actions support

Author: fhlavac

package-lock.json

@@ -37,7 +37,7 @@
     "@patternfly/react-core": "^5.4.0",
     "@patternfly/react-icons": "^5.4.0",
     "@patternfly/react-table": "^5.4.0",
-    "@patternfly/react-component-groups": "^5.3.0-prerelease.2",
+    "@patternfly/react-component-groups": "^5.5.1",
     "@babel/core": "^7.24.7",
     "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
     "@babel/preset-env": "^7.24.7",

package.json

@@ -14,15 +14,19 @@ export interface DataViewToolbarProps extends PropsWithChildren {
   actions?: React.ReactNode;
 }
 
-export const DataViewToolbar: React.FC<DataViewToolbarProps> = ({ className, ouiaId = 'DataViewToolbar', bulkSelect, actions = null, pagination, children, ...props }: DataViewToolbarProps) => (
+export const DataViewToolbar: React.FC<DataViewToolbarProps> = ({ className, ouiaId = 'DataViewToolbar', bulkSelect, actions, pagination, children, ...props }: DataViewToolbarProps) => (
   <Toolbar ouiaId={ouiaId} className={className} {...props}>
     <ToolbarContent>
       {bulkSelect && (
         <ToolbarItem data-ouia-component-id={`${ouiaId}-bulk-select`}>
           {bulkSelect}
         </ToolbarItem>
       )}
-      {actions}
+      {actions && (
+        <ToolbarItem variant={ToolbarItemVariant['overflow-menu']}>
+          {actions}
+        </ToolbarItem>
+      )}
       {pagination && (
         <ToolbarItem variant={ToolbarItemVariant.pagination} data-ouia-component-id={`${ouiaId}-pagination`}>
           {pagination}
@@ -31,7 +35,7 @@ export const DataViewToolbar: React.FC<DataViewToolbarProps> = ({ className, oui
       {children}
     </ToolbarContent>
   </Toolbar>
-);
+)
 
 export default DataViewToolbar;