79023ee190
Reviewed By: bhamodi Differential Revision: D33331422 fbshipit-source-id: 016e8dcc0c0c7f1fc353a348b54fda0d5e2ddc01
47 lines
976 B
TypeScript
47 lines
976 B
TypeScript
/**
|
|
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
*
|
|
* This source code is licensed under the MIT license found in the
|
|
* LICENSE file in the root directory of this source tree.
|
|
*
|
|
* @format
|
|
*/
|
|
|
|
import * as React from 'react';
|
|
import {DataTable, DataTableColumn} from 'flipper-plugin';
|
|
import {useCallback} from 'react';
|
|
|
|
export type KeyValueItem = {
|
|
key: string;
|
|
value: string;
|
|
};
|
|
|
|
const columns: DataTableColumn<KeyValueItem>[] = [
|
|
{
|
|
key: 'key',
|
|
width: 160,
|
|
title: 'Key',
|
|
},
|
|
{
|
|
key: 'value',
|
|
title: 'Value',
|
|
wrap: true,
|
|
},
|
|
];
|
|
|
|
export function KeyValueTable({items}: {items: KeyValueItem[]}) {
|
|
const handleCopyRows = useCallback((rows: KeyValueItem[]) => {
|
|
return rows.map(({key, value}) => `${key}: ${value}`).join('\n');
|
|
}, []);
|
|
|
|
return (
|
|
<DataTable<KeyValueItem>
|
|
columns={columns}
|
|
records={items}
|
|
enableSearchbar={false}
|
|
scrollable={false}
|
|
onCopyRows={handleCopyRows}
|
|
/>
|
|
);
|
|
}
|