Summary: Changelog: Updated Network plugin to Sandy UI, including several UI improvements Converted UI to Sandy, and some minor code cleanups Moved all mock related logic to its own dir Fixes https://github.com/facebook/flipper/issues/2267 Reviewed By: passy Differential Revision: D27966606 fbshipit-source-id: a64e20276d7f0966ce7a95b22557762a32c184cd
47 lines
974 B
TypeScript
47 lines
974 B
TypeScript
/**
|
|
* Copyright (c) Facebook, Inc. and its 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}
|
|
/>
|
|
);
|
|
}
|