fix: copy to Clipboard order (#16299)

* copy to Clipboard order

* centralized copyToClipboard

* fixed table order

* fixed tests

* added colnames to all viz types

* added colnames to all viz types

* added colnames to all viz types
This commit is contained in:
AAfghahi
2021-08-24 17:47:09 -04:00
committed by GitHub
parent e71c6e60e4
commit 631ad02a76
10 changed files with 84 additions and 38 deletions

View File

@@ -55,11 +55,15 @@ const CopyNode = (
export const CopyToClipboardButton = ({
data,
columns,
}: {
data?: Record<string, any>;
columns?: string[];
}) => (
<CopyToClipboard
text={data ? prepareCopyToClipboardTabularData(data) : ''}
text={
data && columns ? prepareCopyToClipboardTabularData(data, columns) : ''
}
wrapped={false}
copyNode={CopyNode}
/>
@@ -113,29 +117,32 @@ export const useFilteredTableData = (
}, [data, filterText]);
export const useTableColumns = (
colnames?: string[],
data?: Record<string, any>[],
moreConfigs?: { [key: string]: Partial<Column> },
) =>
useMemo(
() =>
data?.length
? Object.keys(data[0]).map(
key =>
({
accessor: row => row[key],
Header: key,
Cell: ({ value }) => {
if (value === true) {
return BOOL_TRUE_DISPLAY;
}
if (value === false) {
return BOOL_FALSE_DISPLAY;
}
return String(value);
},
...moreConfigs?.[key],
} as Column),
)
colnames && data?.length
? colnames
.filter((column: string) => Object.keys(data[0]).includes(column))
.map(
key =>
({
accessor: row => row[key],
Header: key,
Cell: ({ value }) => {
if (value === true) {
return BOOL_TRUE_DISPLAY;
}
if (value === false) {
return BOOL_FALSE_DISPLAY;
}
return String(value);
},
...moreConfigs?.[key],
} as Column),
)
: [],
[data, moreConfigs],
);

View File

@@ -42,9 +42,10 @@ const data = [
[unicodeKey]: unicodeKey,
},
];
const all_columns = ['col01', 'col02', 'col03', asciiKey, unicodeKey];
test('useTableColumns with no options', () => {
const hook = renderHook(() => useTableColumns(data));
const hook = renderHook(() => useTableColumns(all_columns, data));
expect(hook.result.current).toEqual([
{
Cell: expect.any(Function),
@@ -83,7 +84,7 @@ test('useTableColumns with no options', () => {
test('use only the first record columns', () => {
const newData = [data[3], data[0]];
const hook = renderHook(() => useTableColumns(newData));
const hook = renderHook(() => useTableColumns(all_columns, newData));
expect(hook.result.current).toEqual([
{
Cell: expect.any(Function),
@@ -134,7 +135,9 @@ test('use only the first record columns', () => {
});
test('useTableColumns with options', () => {
const hook = renderHook(() => useTableColumns(data, { col01: { id: 'ID' } }));
const hook = renderHook(() =>
useTableColumns(all_columns, data, { col01: { id: 'ID' } }),
);
expect(hook.result.current).toEqual([
{
Cell: expect.any(Function),