diff --git a/new-lamassu-admin/src/components/editableTable/Header.js b/new-lamassu-admin/src/components/editableTable/Header.js index d911ba7f..de4810ec 100644 --- a/new-lamassu-admin/src/components/editableTable/Header.js +++ b/new-lamassu-admin/src/components/editableTable/Header.js @@ -1,3 +1,5 @@ +import { makeStyles } from '@material-ui/core' +import classnames from 'classnames' import * as R from 'ramda' import React, { useContext } from 'react' @@ -11,6 +13,14 @@ import { startCase } from 'src/utils/string' import TableCtx from './Context' +const styles = { + orderedBySpan: { + whiteSpace: 'nowrap' + } +} + +const useStyles = makeStyles(styles) + const groupSecondHeader = elements => { const [toSHeader, noSHeader] = R.partition(R.has('doubleHeader'))(elements) @@ -31,6 +41,7 @@ const groupSecondHeader = elements => { } const Header = () => { + const classes = useStyles() const { elements, enableEdit, @@ -61,12 +72,41 @@ const Header = () => { const mapElement = ( { name, width = DEFAULT_COL_SIZE, header, textAlign }, idx - ) => ( - - {header || startCase(name)}{' '} - {!R.isNil(orderedBy) && R.equals(name, orderedBy.code) && '-'} - - ) + ) => { + const orderClasses = classnames({ + [classes.orderedBySpan]: + R.isNil(header) && !R.isNil(orderedBy) && R.equals(name, orderedBy.code) + }) + + const attachOrderedByToComplexHeader = header => { + const cloneHeader = R.clone(header) + const children = R.path(['props', 'children'], cloneHeader) + const spanChild = R.find(it => R.equals(it.type, 'span'), children) + + if (!R.isNil(orderedBy) && R.equals(name, orderedBy.code)) { + try { + spanChild.props.children = R.append(' -', spanChild.props.children) + return cloneHeader + } catch (e) { + return header + } + } + return header + } + + return ( + + {!R.isNil(header) ? ( + <>{attachOrderedByToComplexHeader(header) ?? header} + ) : ( + + {startCase(name)}{' '} + {!R.isNil(orderedBy) && R.equals(name, orderedBy.code) && '-'} + + )} + + ) + } const [innerElements, HeaderElement] = groupSecondHeader(elements) diff --git a/new-lamassu-admin/src/pages/Commissions/helper.js b/new-lamassu-admin/src/pages/Commissions/helper.js index 7295f45e..27eb8e7a 100644 --- a/new-lamassu-admin/src/pages/Commissions/helper.js +++ b/new-lamassu-admin/src/pages/Commissions/helper.js @@ -23,7 +23,7 @@ const ALL_COINS = { code: 'ALL_COINS' } -const cashInAndOutHeaderStyle = { marginLeft: 6 } +const cashInAndOutHeaderStyle = { marginLeft: 6, whiteSpace: 'nowrap' } const cashInHeader = (
@@ -487,8 +487,8 @@ const getListCommissionsFields = (getData, currency, defaults) => { }, { name: 'cryptoCurrencies', - display: 'Crypto Currency', - width: 265, + display: 'Crypto Currencydasdsa', + width: 255, view: R.prop(0), size: 'sm', editable: false @@ -510,7 +510,7 @@ const getListCommissionsFields = (getData, currency, defaults) => { header: cashOutHeader, name: 'cashOut', display: 'Cash-out', - width: 130, + width: 140, input: NumberInput, textAlign: 'right', greenText: true,