feat(explore): Allow using time formatter on temporal columns in data table (#18569)

* feat(explore): Allow using time formatter on temporal columns in data table

* Fix data table loading

* Return colnames and coltypes from results request

* Fix types

* Fix tests

* Fix copy button

* Fix df is none

* Fix test

* Address comments

* Move useTimeFormattedColumns out of useTableColumns

* Make reducer more readable
This commit is contained in:
Kamil Gabryjelski
2022-02-09 10:29:11 +01:00
committed by GitHub
parent 28e729b835
commit 830f2e71d3
14 changed files with 475 additions and 88 deletions

View File

@@ -16,6 +16,7 @@
* specific language governing permissions and limitations
* under the License.
*/
import { GenericDataType } from '@superset-ui/core';
import { renderHook } from '@testing-library/react-hooks';
import { BOOL_FALSE_DISPLAY, BOOL_TRUE_DISPLAY } from 'src/constants';
import { useTableColumns } from '.';
@@ -43,29 +44,39 @@ const data = [
},
];
const all_columns = ['col01', 'col02', 'col03', asciiKey, unicodeKey];
const coltypes = [
GenericDataType.BOOLEAN,
GenericDataType.BOOLEAN,
GenericDataType.STRING,
GenericDataType.STRING,
];
test('useTableColumns with no options', () => {
const hook = renderHook(() => useTableColumns(all_columns, data));
const hook = renderHook(() => useTableColumns(all_columns, coltypes, data));
expect(hook.result.current).toEqual([
{
Cell: expect.any(Function),
Header: 'col01',
accessor: expect.any(Function),
id: 'col01',
},
{
Cell: expect.any(Function),
Header: 'col02',
accessor: expect.any(Function),
id: 'col02',
},
{
Cell: expect.any(Function),
Header: asciiKey,
accessor: expect.any(Function),
id: asciiKey,
},
{
Cell: expect.any(Function),
Header: unicodeKey,
accessor: expect.any(Function),
id: unicodeKey,
},
]);
hook.result.current.forEach((col: JsonObject) => {
@@ -84,32 +95,39 @@ test('useTableColumns with no options', () => {
test('use only the first record columns', () => {
const newData = [data[3], data[0]];
const hook = renderHook(() => useTableColumns(all_columns, newData));
const hook = renderHook(() =>
useTableColumns(all_columns, coltypes, newData),
);
expect(hook.result.current).toEqual([
{
Cell: expect.any(Function),
Header: 'col01',
accessor: expect.any(Function),
id: 'col01',
},
{
Cell: expect.any(Function),
Header: 'col02',
accessor: expect.any(Function),
id: 'col02',
},
{
Cell: expect.any(Function),
Header: 'col03',
accessor: expect.any(Function),
id: 'col03',
},
{
Cell: expect.any(Function),
Header: asciiKey,
accessor: expect.any(Function),
id: asciiKey,
},
{
Cell: expect.any(Function),
Header: unicodeKey,
accessor: expect.any(Function),
id: unicodeKey,
},
]);
@@ -136,7 +154,9 @@ test('use only the first record columns', () => {
test('useTableColumns with options', () => {
const hook = renderHook(() =>
useTableColumns(all_columns, data, { col01: { id: 'ID' } }),
useTableColumns(all_columns, coltypes, data, undefined, [], {
col01: { id: 'ID' },
}),
);
expect(hook.result.current).toEqual([
{
@@ -149,16 +169,19 @@ test('useTableColumns with options', () => {
Cell: expect.any(Function),
Header: 'col02',
accessor: expect.any(Function),
id: 'col02',
},
{
Cell: expect.any(Function),
Header: asciiKey,
accessor: expect.any(Function),
id: asciiKey,
},
{
Cell: expect.any(Function),
Header: unicodeKey,
accessor: expect.any(Function),
id: unicodeKey,
},
]);
hook.result.current.forEach((col: JsonObject) => {