From 61cd83f3d5a3a26d208599053ea8de06f2e7d64a Mon Sep 17 00:00:00 2001
From: vbersch <viktor.bersch@sap.com>
Date: Wed, 18 Sep 2019 16:56:12 +0200
Subject: [PATCH] feat(AnalyticalTable): enable passing additional props to
 react-table (#131)

---
 .../src/components/AnalyticalTable/index.tsx  | 20 ++++++++++++++-----
 1 file changed, 15 insertions(+), 5 deletions(-)

diff --git a/packages/main/src/components/AnalyticalTable/index.tsx b/packages/main/src/components/AnalyticalTable/index.tsx
index e456d4608f3..c95e9794569 100644
--- a/packages/main/src/components/AnalyticalTable/index.tsx
+++ b/packages/main/src/components/AnalyticalTable/index.tsx
@@ -22,7 +22,6 @@ export interface ColumnConfiguration {
   vAlign?: VerticalAlign;
   canResize?: boolean;
   minWidth?: number;
-
   [key: string]: any;
 }
 
@@ -65,6 +64,11 @@ export interface TableProps extends CommonProps {
   noDataText?: string;
   stickyHeader?: boolean;
   onSort?: (e?: Event) => void;
+  /**
+   * additional options which will be passed to [react-table´s useTable hook](https://github.com/tannerlinsley/react-table/blob/master/docs/api.md#table-options)
+   */
+  reactTableOptions?: object;
+  tableHooks?: Array<() => any>;
 }
 
 const useStyles = createUseStyles<JSSTheme, keyof ReturnType<typeof styles>>(styles);
@@ -100,7 +104,9 @@ export const AnalyticalTable: FC<TableProps> = forwardRef((props: TableProps, re
     selectable,
     onRowSelected,
     stickyHeader,
-    onSort
+    onSort,
+    reactTableOptions,
+    tableHooks
   } = props;
 
   const [selectedRow, setSelectedRow] = useState(null);
@@ -188,13 +194,15 @@ export const AnalyticalTable: FC<TableProps> = forwardRef((props: TableProps, re
       columns,
       data,
       defaultColumn,
-      state: tableState
+      state: tableState,
+      ...reactTableOptions
     },
     useFilters,
     useGroupBy,
     useSortBy,
     useExpanded,
-    useTableStyling
+    useTableStyling,
+    ...tableHooks
   );
 
   const minimumRows = useMemo(() => {
@@ -333,5 +341,7 @@ AnalyticalTable.defaultProps = {
   pivotBy: [],
   NoDataComponent: DefaultNoDataComponent,
   noDataText: 'No Data',
-  stickyHeader: true
+  stickyHeader: true,
+  reactTableOptions: {},
+  tableHooks: []
 };