Fixed lint errors

project44 · Aug 26, 2024 · 63189ab · 63189ab
1 parent be2eba5
commit 63189ab
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 8 deletions.
diff --git a/packages/react/src/components/DataTable/DataTable.tsx b/packages/react/src/components/DataTable/DataTable.tsx
@@ -82,7 +82,7 @@ export function DataTable<TData extends RowData>(props: DataTableProps<TData>) {
             enableExpandAll && <DataTableExpandAllButton table={table} />,
           // eslint-disable-next-line react/no-unstable-nested-components
           cell: ({ row, table }: { row: Row<TData>; table: DataTable<TData> }) => (
-            <DataTableExpandButton row={row} table={table} isCanExpandIconVisible={isCanExpandIconVisible} expandIconFunction={expandIconFunction} />
+            <DataTableExpandButton expandIconFunction={expandIconFunction} isCanExpandIconVisible={isCanExpandIconVisible} row={row} table={table} />
           ),
           size: 40,
         },
@@ -99,7 +99,7 @@ export function DataTable<TData extends RowData>(props: DataTableProps<TData>) {
         },
         ...columnsProp,
       ].filter(Boolean) as ColumnDef<TData>[],
-    [columnsProp, enableExpandAll, enableExpanding, enableRowSelection, enableSelectAll],
+    [columnsProp, enableExpandAll, enableExpanding, enableRowSelection, enableSelectAll, isCanExpandIconVisible, expandIconFunction],
   );
 
   const data: TData[] = React.useMemo(

diff --git a/...react/src/components/DataTable/components/DataTableExpandButton/DataTableExpandButton.tsx b/...react/src/components/DataTable/components/DataTableExpandButton/DataTableExpandButton.tsx
@@ -31,11 +31,11 @@ export function DataTableExpandButton<TData extends RowData>(
   return (
     <IconButton
       {...parsedProps}
+      css={{ display: canExpand || isCanExpandIconVisible ? 'block' : 'none'  }}
       isDisabled={isLoading || !canExpand}
       size="small"
       variant="tertiary"
       onPress={handleToggleExpand}
-      css={{ display: canExpand || isCanExpandIconVisible ? 'block' : 'none'  }}
     >
       <ChevronDown
         style={{

diff --git a/packages/react/src/components/DataTable/story/DataTable.stories.tsx b/packages/react/src/components/DataTable/story/DataTable.stories.tsx
@@ -1,10 +1,10 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
+import React from 'react';
 import { faker } from '@faker-js/faker';
 import { ClipboardWithCheck, Clock } from '@project44-manifest/react-icons';
+import { RowSelectionState } from '@tanstack/react-table';
 import { createDataTableColumnHelper, DataTable, DataTableColumnDef, Link, Pill } from '../../..';
 import { TotalsDataObj } from '../DataTable.types';
-import React from 'react';
-import { RowSelectionState } from '@tanstack/react-table';
 
 export default {
   title: 'Components/DataTable',
@@ -408,17 +408,18 @@ export const RowExpandingAndSelection = () => {
     [],
   );
   const [rowSelection, setRowSelection] = React.useState<RowSelectionState>({});
+  const expandFn = React.useMemo( () => (isExpanded: boolean) => isExpanded ? 0 : -90, []);
 
   return (
     <DataTable
-      isCanExpandIconVisible={false}
       enableExpanding
+      enableRowSelection
       columns={columns}
       data={data}
-      enableRowSelection
+      expandIconFunction={expandFn}
+      isCanExpandIconVisible={false}
       state={{ rowSelection }}
       onRowSelectionChange={setRowSelection}
-      expandIconFunction={(isExpanded) => isExpanded ? 0 : -90}
     />
   );
 };