diff --git a/desktop/plugins/public/databases/DatabaseDetailSidebar.tsx b/desktop/plugins/public/databases/DatabaseDetailSidebar.tsx index f3a77a10e..61e2ac2d4 100644 --- a/desktop/plugins/public/databases/DatabaseDetailSidebar.tsx +++ b/desktop/plugins/public/databases/DatabaseDetailSidebar.tsx @@ -8,15 +8,16 @@ */ import React, {useMemo, useState, useEffect, useReducer} from 'react'; + import { - Input, - DetailSidebar, Panel, - ManagedDataInspector, + DetailSidebar, + DataInspector as ManagedDataInspector, + theme, styled, produce, - colors, -} from 'flipper'; + Layout, +} from 'flipper-plugin'; import { Value, @@ -24,7 +25,7 @@ import { renderValue, } from './TypeBasedValueRenderer'; -import {Button} from 'antd'; +import {Button, Input} from 'antd'; type TableRow = { col: string; @@ -48,7 +49,7 @@ const EditTriggerSection = styled.div({ }); const TableDetailRow = styled.div({ - borderBottom: `1px solid ${colors.blackAlpha10}`, + borderBottom: `1px solid ${theme.dividerColor}`, padding: 8, }); @@ -58,7 +59,7 @@ const TableDetailRowTitle = styled.div({ }); const TableDetailRowType = styled.span({ - color: colors.light20, + color: theme.white, marginLeft: 8, fontWeight: 'normal', }); @@ -185,29 +186,29 @@ export default React.memo(function DatabaseDetailSidebar( ); return ( - + {onSave ? ( - + +
{editing ? ( - <> + + - - + ) : ( - + + + )} - + ) : null}
{rows.map((row) => ( diff --git a/desktop/plugins/public/databases/index.tsx b/desktop/plugins/public/databases/index.tsx index d548b1b95..286c7615b 100644 --- a/desktop/plugins/public/databases/index.tsx +++ b/desktop/plugins/public/databases/index.tsx @@ -8,16 +8,14 @@ */ import { - styled, - produce, ManagedTable, - getStringFromErrorLike, TableBodyColumn, TableRows, TableBodyRow, TableRowSortOrder, TableHighlightedRows, } from 'flipper'; +import {getStringFromErrorLike} from './utils'; import {Value, renderValue} from './TypeBasedValueRenderer'; import React, {KeyboardEvent, ChangeEvent, useState, useCallback} from 'react'; import {Methods, Events} from './ClientProtocol'; @@ -40,6 +38,8 @@ import { useMemoize, Toolbar, theme, + styled, + produce, } from 'flipper-plugin'; import { Select, diff --git a/desktop/plugins/public/databases/utils.tsx b/desktop/plugins/public/databases/utils.tsx new file mode 100644 index 000000000..aa71537e8 --- /dev/null +++ b/desktop/plugins/public/databases/utils.tsx @@ -0,0 +1,26 @@ +/** + * 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 + */ + +export function getStringFromErrorLike(e: any): string { + if (Array.isArray(e)) { + return e.map(getStringFromErrorLike).join(' '); + } else if (typeof e == 'string') { + return e; + } else if (e instanceof Error) { + return e.message || e.toString(); + } else { + try { + return JSON.stringify(e); + } catch (e) { + // Stringify might fail on arbitrary structures + // Last resort: toString it. + return '' + e; + } + } +}