diff --git a/packages/react-table/src/demos/examples/TableColumnManagement.tsx b/packages/react-table/src/demos/examples/TableColumnManagement.tsx index 6d129e5c36d..518bbef4033 100644 --- a/packages/react-table/src/demos/examples/TableColumnManagement.tsx +++ b/packages/react-table/src/demos/examples/TableColumnManagement.tsx @@ -137,14 +137,14 @@ export const TableColumnManagement: React.FunctionComponent = () => { // Filters columns out of table that are not selected in the column management modal const filterData = (checked: boolean, name: string) => { - const selectedColumn: string = matchSelectedColumnNameToAttr(name); + const selectedColumn = matchSelectedColumnNameToAttr(name); - const filteredRows: any[] = []; + const filteredRows: SampleDataRow[] = []; if (checked) { - const updatedFilters: string[] = filters.filter((item) => item !== selectedColumn); + const updatedFilters = filters.filter((item) => item !== selectedColumn); // Only show the names of columns that were selected in the modal - const filteredColumns: string[] = defaultColumns.filter( + const filteredColumns = defaultColumns.filter( (column) => !updatedFilters.includes(matchSelectedColumnNameToAttr(column)) ); @@ -155,11 +155,11 @@ export const TableColumnManagement: React.FunctionComponent = () => { setFilteredColumns(filteredColumns); setFilteredRows(filteredRows); } else { - const updatedFilters: string[] = [...filters]; + const updatedFilters = filters; updatedFilters.push(selectedColumn); // Only show the names of columns that were selected in the modal - const filteredColumns: string[] = managedColumns.filter( + const filteredColumns = managedColumns.filter( (column) => !filters.includes(matchSelectedColumnNameToAttr(column)) ); diff --git a/packages/react-table/src/demos/examples/TableColumnManagementWithDraggable.tsx b/packages/react-table/src/demos/examples/TableColumnManagementWithDraggable.tsx index e3c8c08cccc..41123b47396 100644 --- a/packages/react-table/src/demos/examples/TableColumnManagementWithDraggable.tsx +++ b/packages/react-table/src/demos/examples/TableColumnManagementWithDraggable.tsx @@ -16,8 +16,6 @@ import { OverflowMenu, OverflowMenuGroup, OverflowMenuItem, - Pagination, - PaginationVariant, Text, TextContent, TextVariants, @@ -321,7 +319,6 @@ export const TableColumnManagementWithDraggable: React.FunctionComponent = () => const [check3, setCheck3] = React.useState(true); const [check4, setCheck4] = React.useState(true); const [check5, setCheck5] = React.useState(true); - const canSelectAll = true; const matchCheckboxNameToColumn = (name: string) => { switch (name) { @@ -424,19 +421,6 @@ export const TableColumnManagementWithDraggable: React.FunctionComponent = () => setCheck5(true); }; - const onSelect = (event: React.FormEvent, isSelected: boolean, rowId: number) => { - let rows; - if (rowId === -1) { - rows = rows.map((oneRow) => { - oneRow.selected = isSelected; - return oneRow; - }); - } else { - rows = [...rows]; - rows[rowId] = { ...rows[rowId], selected: isSelected }; - } - }; - const renderModal = () => ( - - - ); @@ -655,27 +627,14 @@ export const TableColumnManagementWithDraggable: React.FunctionComponent = () => {toolbarItems} } - aria-label="This is a table with checkboxes" - onSelect={onSelect} + aria-label="Column Management with Draggable Table" cells={columns} rows={rows} actions={actions} - canSelectAll={canSelectAll} > - {renderModal()} );