From 65e5c12b9221423e01feb8f1b3142ac3e834ce5c Mon Sep 17 00:00:00 2001
From: Nikola Ubavic <53820106+ubavic@users.noreply.github.com>
Date: Mon, 26 Sep 2022 14:40:59 +0200
Subject: [PATCH] fix: display error status

---
 .../src/pages/Transactions/CopyToClipboard.js     |  4 +++-
 .../src/pages/Transactions/DetailsCard.js         | 15 ++++++++-------
 .../src/pages/Transactions/DetailsCard.styles.js  |  4 ++++
 3 files changed, 15 insertions(+), 8 deletions(-)

diff --git a/new-lamassu-admin/src/pages/Transactions/CopyToClipboard.js b/new-lamassu-admin/src/pages/Transactions/CopyToClipboard.js
index 1c14a2e3..b6c63914 100644
--- a/new-lamassu-admin/src/pages/Transactions/CopyToClipboard.js
+++ b/new-lamassu-admin/src/pages/Transactions/CopyToClipboard.js
@@ -17,6 +17,7 @@ const CopyToClipboard = ({
   buttonClassname,
   children,
   wrapperClassname,
+  removeSpace = true,
   ...props
 }) => {
   const [anchorEl, setAnchorEl] = useState(null)
@@ -46,7 +47,8 @@ const CopyToClipboard = ({
             {children}
           </div>
           <div className={classnames(classes.buttonWrapper, buttonClassname)}>
-            <ReactCopyToClipboard text={R.replace(/\s/g, '')(children)}>
+            <ReactCopyToClipboard
+              text={removeSpace ? R.replace(/\s/g, '')(children) : children}>
               <button
                 aria-describedby={id}
                 onClick={event => handleClick(event)}>
diff --git a/new-lamassu-admin/src/pages/Transactions/DetailsCard.js b/new-lamassu-admin/src/pages/Transactions/DetailsCard.js
index cd40af4b..70584754 100644
--- a/new-lamassu-admin/src/pages/Transactions/DetailsCard.js
+++ b/new-lamassu-admin/src/pages/Transactions/DetailsCard.js
@@ -191,6 +191,13 @@ const DetailsRow = ({ it: tx, timezone }) => {
     <>
       <Label>Transaction status</Label>
       <span className={classes.bold}>{getStatus(tx)}</span>
+      {getStatusDetails(tx) ? (
+        <CopyToClipboard removeSpace={false} className={classes.errorCopy}>
+          {getStatusDetails(tx)}
+        </CopyToClipboard>
+      ) : (
+        <></>
+      )}
     </>
   )
 
@@ -392,13 +399,7 @@ const DetailsRow = ({ it: tx, timezone }) => {
       </div>
       <div className={classes.lastRow}>
         <div className={classes.status}>
-          {getStatusDetails(tx) ? (
-            <HoverableTooltip parentElements={errorElements} width={200}>
-              <P>{getStatusDetails(tx)}</P>
-            </HoverableTooltip>
-          ) : (
-            errorElements
-          )}
+          {errorElements}
           {((tx.txClass === 'cashOut' && getStatus(tx) === 'Pending') ||
             (tx.txClass === 'cashIn' && getStatus(tx) === 'Batched')) && (
             <ActionButton
diff --git a/new-lamassu-admin/src/pages/Transactions/DetailsCard.styles.js b/new-lamassu-admin/src/pages/Transactions/DetailsCard.styles.js
index c76b1c12..a55d40db 100644
--- a/new-lamassu-admin/src/pages/Transactions/DetailsCard.styles.js
+++ b/new-lamassu-admin/src/pages/Transactions/DetailsCard.styles.js
@@ -137,5 +137,9 @@ export default {
   },
   swept: {
     width: 250
+  },
+  errorCopy: {
+    lineBreak: 'normal',
+    maxWidth: 180
   }
 }