diff --git a/package.json b/package.json index bea99e80..0c4a39bb 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "ka-table", - "version": "7.11.1", + "version": "7.12.0", "license": "MIT", "repository": "github:komarovalexander/ka-table", "homepage": "https://komarovalexander.github.io/ka-table/#/overview", diff --git a/src/Demos/SearchDemo/SearchDemo.tsx b/src/Demos/SearchDemo/SearchDemo.tsx index 0ff1a904..01d8531f 100644 --- a/src/Demos/SearchDemo/SearchDemo.tsx +++ b/src/Demos/SearchDemo/SearchDemo.tsx @@ -31,10 +31,8 @@ const SearchDemo: React.FC = () => { }} rowKeyField={'id'} searchText={searchText} - childComponents={{ - noDataRow: { - content: () => 'No Data Found' - } + noData={{ + text: 'No Data Found' }} /> diff --git a/src/lib/Components/NoDataRow/NoDataRow.tsx b/src/lib/Components/NoDataRow/NoDataRow.tsx index 26c56a76..6ab26be7 100644 --- a/src/lib/Components/NoDataRow/NoDataRow.tsx +++ b/src/lib/Components/NoDataRow/NoDataRow.tsx @@ -7,6 +7,7 @@ const NoDataRow: React.FunctionComponent = (props) => { childComponents, columns, groupColumnsCount, + noData } = props; const { elementAttributes, content } = getElementCustomization({ className: 'ka-tr ka-no-data-row' @@ -17,7 +18,7 @@ const NoDataRow: React.FunctionComponent = (props) => { return ( - {content || cellContent} + {content || cellContent || noData?.text} ); diff --git a/src/lib/Components/Table/Table.tsx b/src/lib/Components/Table/Table.tsx index d7c8f558..51a3f5d5 100644 --- a/src/lib/Components/Table/Table.tsx +++ b/src/lib/Components/Table/Table.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import * as actionCreators from '../../actionCreators'; -import { ControlledPropsKeys, DispatchFunc, FilterFunc, FormatFunc, OnDispatchFunc, SearchFunc, SortFunc, ValidationFunc } from '../../types'; +import { ControlledPropsKeys, DispatchFunc, FilterFunc, FormatFunc, NoData, OnDispatchFunc, SearchFunc, SortFunc, ValidationFunc } from '../../types'; import { EditableCell, PagingOptions } from '../../models'; import { EditingMode, FilteringMode, SortingMode } from '../../enums'; @@ -52,6 +52,7 @@ export interface ITableProps { selectedRows?: any[]; singleAction?: any; sort?: SortFunc; + noData?: NoData, sortingMode?: SortingMode; validation?: ValidationFunc; virtualScrolling?: VirtualScrolling; diff --git a/src/lib/Components/TableWrapper/TableWrapper.test.tsx b/src/lib/Components/TableWrapper/TableWrapper.test.tsx index 91169383..5617aeac 100644 --- a/src/lib/Components/TableWrapper/TableWrapper.test.tsx +++ b/src/lib/Components/TableWrapper/TableWrapper.test.tsx @@ -1,10 +1,9 @@ import Enzyme, { mount } from 'enzyme'; -import React from 'react'; -import ReactDOM from 'react-dom'; - -import Adapter from '@wojtekmaj/enzyme-adapter-react-17'; import { ActionType } from '../../enums'; +import Adapter from '@wojtekmaj/enzyme-adapter-react-17'; +import React from 'react'; +import ReactDOM from 'react-dom'; import { TableWrapper } from './TableWrapper'; Enzyme.configure({ adapter: new Adapter() }); @@ -60,6 +59,30 @@ describe('TableWrapper', () => { expect(wrapper.find('tfoot').length).toBe(0); }); + describe('header', () => { + it('hides table header in case of noData.hideHeader=true and data is empty', () => { + const wrapper = mount(( + + )); + + expect(wrapper.find('thead').length).toBe(0); + }); + it('shows table header in case of noData.hideHeader=true and data has values', () => { + const wrapper = mount(( + + )); + + expect(wrapper.find('thead').length).toBe(1); + }); + it('shows table header in case of noData.hideHeader=false and data is empty', () => { + const wrapper = mount(( + + )); + + expect(wrapper.find('thead').length).toBe(1); + }); + }); + it('shows table foot in case of tableFoot to be set', () => { const wrapper = mount(( = (props) => { const { @@ -26,7 +27,8 @@ export const TableWrapper: React.FunctionComponent = (props) => rowReordering = false, selectedRows = [], sortingMode = SortingMode.None, - virtualScrolling + virtualScrolling, + noData } = props; let { groupsExpanded, @@ -52,6 +54,7 @@ export const TableWrapper: React.FunctionComponent = (props) => const { elementAttributes, content } = getElementCustomization({ className: defaultOptions.css.table, }, props, childComponents.table); + return (
{content || tableWrapper.content || ( @@ -60,7 +63,7 @@ export const TableWrapper: React.FunctionComponent = (props) => columns={preparedOptions.columns} groupColumnsCount={preparedOptions.groupColumnsCount} /> - = (props) => filteringMode={filteringMode} groupColumnsCount={preparedOptions.groupColumnsCount} sortingMode={sortingMode} - /> + />} = -T extends (e: infer E) => void ? ( +export interface NoData { + text?: string; + hideHeader?: boolean; +} + +type AddParameters = T extends (e: infer E) => void ? ( (e: E, extendedEvent: AttributeTableData) => void ) : T; type WithExtraParameters = {