diff --git a/src/components/Table/TableHead.jsx b/src/components/Table/TableHead.jsx index 38d4de46..e965c7eb 100644 --- a/src/components/Table/TableHead.jsx +++ b/src/components/Table/TableHead.jsx @@ -14,6 +14,17 @@ export type Column = { disablePadding: boolean, label: string, custom: boolean, // If content will be rendered by user manually + width?: number, +} + +export const cellWidth = (width: number | typeof undefined) => { + if (!width) { + return undefined + } + + return { + width: `${width}px`, + } } type Props = { diff --git a/src/routes/safe/component/Balances/dataFetcher.js b/src/routes/safe/component/Balances/dataFetcher.js index 9a35715d..13a00bde 100644 --- a/src/routes/safe/component/Balances/dataFetcher.js +++ b/src/routes/safe/component/Balances/dataFetcher.js @@ -55,6 +55,7 @@ export const generateColumns = () => { disablePadding: false, label: 'Asset', custom: false, + width: 250, } const balanceRow: Column = { diff --git a/src/routes/safe/component/Balances/index.jsx b/src/routes/safe/component/Balances/index.jsx index 53b75bae..25c0249e 100644 --- a/src/routes/safe/component/Balances/index.jsx +++ b/src/routes/safe/component/Balances/index.jsx @@ -12,7 +12,7 @@ import Col from '~/components/layout/Col' import Row from '~/components/layout/Row' import Paragraph from '~/components/layout/Paragraph' import Modal from '~/components/Modal' -import { type Column } from '~/components/Table/TableHead' +import { type Column, cellWidth } from '~/components/Table/TableHead' import Table from '~/components/Table' import { sm, xs } from '~/theme/variables' import { getBalanceData, generateColumns, BALANCE_TABLE_ASSET_ID, type BalanceRow, filterByZero } from './dataFetcher' @@ -155,11 +155,11 @@ class Balances extends React.Component { {(sortedData: Array) => sortedData.map((row: any, index: number) => ( { autoColumns.map((column: Column) => ( - + {row[column.id]} )) } - + { granted &&