feat(Table): pass click event to action handler (#461)

gravity-ui · Jan 10, 2023 · 620c0e1 · 620c0e1
1 parent cf898d4
commit 620c0e1
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 5 deletions.
diff --git a/src/components/Table/__stories__/Table.stories.tsx b/src/components/Table/__stories__/Table.stories.tsx
@@ -13,6 +13,7 @@ import {
     DataItem,
 } from './utils';
 import {TableAction, TableSettingsData} from '..';
+import {action} from '@storybook/addon-actions';
 
 export default {
     title: 'Components/Table',
@@ -79,7 +80,10 @@ const WithTableActionsTemplate: Story<TableProps<DataItem>> = (args) => {
     const getRowActions = (item: DataItem, index: number): TableAction<DataItem>[] => [
         {
             text: 'default',
-            handler: () => alert(JSON.stringify(item)),
+            handler: (...handlerArgs) => {
+                alert(JSON.stringify(item));
+                action('default')(handlerArgs);
+            },
         },
         {
             text: 'disabled',
@@ -89,7 +93,10 @@ const WithTableActionsTemplate: Story<TableProps<DataItem>> = (args) => {
         {
             text: 'danger theme',
             theme: 'danger',
-            handler: () => alert(index),
+            handler: (...handlerArgs) => {
+                alert(index);
+                action('danger')(handlerArgs);
+            },
         },
     ];
     return <TableWithAction {...args} getRowActions={getRowActions} />;

diff --git a/src/components/Table/hoc/withTableActions/withTableActions.tsx b/src/components/Table/hoc/withTableActions/withTableActions.tsx
@@ -35,7 +35,11 @@ interface PopupData<I> {
 
 export interface TableAction<I> {
     text: string;
-    handler: (item: I, index: number) => void;
+    handler: (
+        item: I,
+        index: number,
+        event: React.MouseEvent<HTMLDivElement | HTMLAnchorElement, MouseEvent>,
+    ) => void;
     disabled?: boolean;
     theme?: MenuItemProps['theme'];
 }
@@ -183,8 +187,12 @@ export function withTableActions<I extends TableDataItem, E extends {} = {}>(
             }
         };
 
-        private handleActionClick = (action: TableAction<I>, data: PopupData<I>) => {
-            action.handler(data.item, data.index);
+        private handleActionClick = (
+            action: TableAction<I>,
+            data: PopupData<I>,
+            event: React.MouseEvent<HTMLDivElement | HTMLAnchorElement, MouseEvent>,
+        ) => {
+            action.handler(data.item, data.index, event);
             this.closePopup();
         };