diff --git a/ui/address/mud/AddressMudRecordsTable.tsx b/ui/address/mud/AddressMudRecordsTable.tsx index 099bf924ca..27bf8a5a75 100644 --- a/ui/address/mud/AddressMudRecordsTable.tsx +++ b/ui/address/mud/AddressMudRecordsTable.tsx @@ -10,6 +10,7 @@ import { route } from 'nextjs-routes'; import capitalizeFirstLetter from 'lib/capitalizeFirstLetter'; import dayjs from 'lib/date/dayjs'; import useIsMobile from 'lib/hooks/useIsMobile'; +import CopyToClipboard from 'ui/shared/CopyToClipboard'; import IconSvg from 'ui/shared/IconSvg'; import LinkInternal from 'ui/shared/links/LinkInternal'; import { default as Thead } from 'ui/shared/TheadSticky'; @@ -109,18 +110,19 @@ const AddressMudRecordsTable = ({ const colW = isMobile ? COL_MIN_WIDTH_MOBILE : COL_MIN_WIDTH; + const keys = (isOpened || !hasCut) ? data.schema.key_names : data.schema.key_names.slice(0, colsCutCount); + const values = (isOpened || !hasCut) ? data.schema.value_names : data.schema.value_names.slice(0, colsCutCount - data.schema.key_names.length); + const colsCount = (isOpened || !hasCut) ? totalColsCut : colsCutCount; + const tdStyles: StyleProps = { wordBreak: 'break-word', whiteSpace: 'normal', minW: `${ colW }px`, - w: `${ colW }px`, + w: `${ 100 / colsCount }%`, verticalAlign: 'top', lineHeight: '20px', }; - const keys = (isOpened || !hasCut) ? data.schema.key_names : data.schema.key_names.slice(0, colsCutCount); - const values = (isOpened || !hasCut) ? data.schema.value_names : data.schema.value_names.slice(0, colsCutCount - data.schema.key_names.length); - const hasHorizontalScroll = isMobile || isOpened; if (hasCut && !colsCutCount) { @@ -185,7 +187,7 @@ const AddressMudRecordsTable = ({ )) } { hasCut && !isOpened && cutButton } - Modified + Modified { hasCut && isOpened && cutButton } @@ -204,12 +206,13 @@ const AddressMudRecordsTable = ({ { getValueString(item.decoded[keyName]) } ) : getValueString(item.decoded[keyName]) } + )) } { values.map((valName) => { getValueString(item.decoded[valName]) }) } { hasCut && !isOpened && } - { dayjs(item.timestamp).format('lll') } + { dayjs(item.timestamp).format('lll') } { hasCut && isOpened && } )) } diff --git a/ui/address/mud/AddressMudTablesTableItem.tsx b/ui/address/mud/AddressMudTablesTableItem.tsx index d3107a05b1..66d72a2a48 100644 --- a/ui/address/mud/AddressMudTablesTableItem.tsx +++ b/ui/address/mud/AddressMudTablesTableItem.tsx @@ -43,7 +43,7 @@ const AddressMudTablesTableItem = ({ item, isLoading, scrollRef, hash }: Props) return ( <> - + diff --git a/ui/address/mud/__screenshots__/AddressMudTable.pw.tsx_default_base-view-mobile-1.png b/ui/address/mud/__screenshots__/AddressMudTable.pw.tsx_default_base-view-mobile-1.png index 127a14f829..071efa92e1 100644 Binary files a/ui/address/mud/__screenshots__/AddressMudTable.pw.tsx_default_base-view-mobile-1.png and b/ui/address/mud/__screenshots__/AddressMudTable.pw.tsx_default_base-view-mobile-1.png differ diff --git a/ui/address/mud/__screenshots__/AddressMudTable.pw.tsx_default_expanded-view-mobile-1.png b/ui/address/mud/__screenshots__/AddressMudTable.pw.tsx_default_expanded-view-mobile-1.png index 26633067f0..89376e122d 100644 Binary files a/ui/address/mud/__screenshots__/AddressMudTable.pw.tsx_default_expanded-view-mobile-1.png and b/ui/address/mud/__screenshots__/AddressMudTable.pw.tsx_default_expanded-view-mobile-1.png differ diff --git a/ui/address/mud/__screenshots__/AddressMudTable.pw.tsx_mobile_base-view-mobile-1.png b/ui/address/mud/__screenshots__/AddressMudTable.pw.tsx_mobile_base-view-mobile-1.png index c64a84dd47..3ea36f0988 100644 Binary files a/ui/address/mud/__screenshots__/AddressMudTable.pw.tsx_mobile_base-view-mobile-1.png and b/ui/address/mud/__screenshots__/AddressMudTable.pw.tsx_mobile_base-view-mobile-1.png differ diff --git a/ui/address/mud/__screenshots__/AddressMudTable.pw.tsx_mobile_expanded-view-mobile-1.png b/ui/address/mud/__screenshots__/AddressMudTable.pw.tsx_mobile_expanded-view-mobile-1.png index 89879a7a1c..648c68ac72 100644 Binary files a/ui/address/mud/__screenshots__/AddressMudTable.pw.tsx_mobile_expanded-view-mobile-1.png and b/ui/address/mud/__screenshots__/AddressMudTable.pw.tsx_mobile_expanded-view-mobile-1.png differ diff --git a/ui/address/mud/__screenshots__/AddressMudTables.pw.tsx_default_base-view-mobile-1.png b/ui/address/mud/__screenshots__/AddressMudTables.pw.tsx_default_base-view-mobile-1.png index f62b1d4dbf..47c26ad9ba 100644 Binary files a/ui/address/mud/__screenshots__/AddressMudTables.pw.tsx_default_base-view-mobile-1.png and b/ui/address/mud/__screenshots__/AddressMudTables.pw.tsx_default_base-view-mobile-1.png differ