fix: direction arrow column

fix: action button width

new-lamassu-admin/src/pages/Customers/CustomerProfile.js

@@ -385,7 +385,7 @@ const CustomerProfile = memo(() => {
 
   const timezone = R.path(['config', 'locale_timezone'], configResponse)
 
-  const classes = useStyles({ blocked })
+  const classes = useStyles()
 
   return (
     <>
@@ -419,29 +419,26 @@ const CustomerProfile = memo(() => {
                 />
               </div>
               <Label1 className={classes.actionLabel}>Actions</Label1>
-              <div>
+              <div className={classes.actionBar}>
                 <ActionButton
-                  className={classes.customerManualDataEntry}
+                  className={classes.actionButton}
                   color="primary"
                   Icon={DataIcon}
                   InverseIcon={DataReversedIcon}
                   onClick={() => setWizard(true)}>
                   {`Manual data entry`}
                 </ActionButton>
-              </div>
-              <div>
                 <ActionButton
-                  className={classes.customerDiscount}
+                  className={classes.actionButton}
                   color="primary"
                   Icon={Discount}
                   InverseIcon={DiscountReversedIcon}
                   onClick={() => {}}>
                   {`Add individual discount`}
                 </ActionButton>
-              </div>
-              <div>
                 {isSuspended && (
                   <ActionButton
+                    className={classes.actionButton}
                     color="primary"
                     Icon={AuthorizeIcon}
                     InverseIcon={AuthorizeReversedIcon}
@@ -455,7 +452,7 @@ const CustomerProfile = memo(() => {
                 )}
                 <ActionButton
                   color="primary"
-                  className={classes.customerBlock}
+                  className={classes.actionButton}
                   Icon={blocked ? AuthorizeIcon : BlockIcon}
                   InverseIcon={
                     blocked ? AuthorizeReversedIcon : BlockReversedIcon
@@ -471,7 +468,7 @@ const CustomerProfile = memo(() => {
                 </ActionButton>
                 <ActionButton
                   color="primary"
-                  className={classes.retrieveInformation}
+                  className={classes.actionButton}
                   Icon={blocked ? AuthorizeIcon : BlockIcon}
                   InverseIcon={
                     blocked ? AuthorizeReversedIcon : BlockReversedIcon

new-lamassu-admin/src/pages/Customers/CustomerProfile.styles.js

@@ -15,29 +15,16 @@ export default {
   customerDetails: {
     marginBottom: 18
   },
-  customerBlock: props => ({
+  actionButton: {
+    margin: [[0, 0, 4, 0]],
     display: 'flex',
     flexDirection: 'row',
-    margin: [[0, 0, 4, 0]],
-    padding: [[0, props.blocked ? 35 : 48, 0]]
-  }),
-  customerDiscount: {
-    display: 'flex',
-    flexDirection: 'row',
-    margin: [[0, 0, 4, 0]],
-    padding: [[0, 23.5, 0]]
+    justifyContent: 'center'
   },
-  customerManualDataEntry: {
+  actionBar: {
     display: 'flex',
-    flexDirection: 'row',
-    margin: [[8, 0, 4, 0]],
-    padding: [[0, 40.5, 0]]
-  },
-  retrieveInformation: {
-    display: 'flex',
-    flexDirection: 'row',
-    margin: [[0, 0, 4, 0]],
-    padding: [[0, 32.5, 0]]
+    flexDirection: 'column',
+    width: 219
   },
   panels: {
     display: 'flex'

new-lamassu-admin/src/pages/Customers/components/TransactionsList.js

@@ -70,12 +70,7 @@ const TransactionsList = ({ customer, data, loading, locale }) => {
 
   const tableElements = [
     {
-      header: 'Machine',
-      width: 160,
-      view: R.path(['machineName'])
-    },
-    {
-      width: 125,
+      width: 40,
       view: it => (
         <>
           {it.txClass === 'cashOut' ? (
@@ -86,6 +81,11 @@ const TransactionsList = ({ customer, data, loading, locale }) => {
         </>
       )
     },
+    {
+      header: 'Machine',
+      width: 160,
+      view: R.path(['machineName'])
+    },
     {
       header: 'Transaction ID',
       width: 145,