diff --git a/web/cashtab/src/components/Home/Tx.js b/web/cashtab/src/components/Home/Tx.js --- a/web/cashtab/src/components/Home/Tx.js +++ b/web/cashtab/src/components/Home/Tx.js @@ -147,6 +147,7 @@ } `; +const OpReturnUrl = styled.a``; const OpReturnType = styled.div` text-align: right; width: 100%; @@ -184,6 +185,19 @@ margin-bottom: 10px; word-break: break-word; } + ${OpReturnUrl} { + border: none; + padding: 0; + color: ${props => props.theme.eCashBlue}; + margin: 0; + font-size: 14px; + width: 100%; + margin-bottom: 10px; + opacity: 1; + } + ${OpReturnUrl}:hover { + background-color: transparent; + } a { color: ${props => props.theme.contrast}; margin: 0px 0px 0px 5px; @@ -424,6 +438,14 @@ } `; +const OpReturnLink = ({ url, children }) => { + return ( + + {children} + + ); +}; + const Tx = ({ data, fiatPrice, @@ -447,6 +469,30 @@ if (!Object.keys(data).includes('parsed')) { unparsedTx = true; } + + const isValidUrl = urlString => { + try { + return Boolean(new URL(urlString)); + } catch (e) { + return false; + } + }; + + const parseLinkInOpReturnMsgs = opReturnMsg => { + const opMsgArr = opReturnMsg.split(' '); + + return opMsgArr.map((str, index) => { + if (isValidUrl(str)) { + return ( + + {str} + + ); + } + return index < opMsgArr.length - 1 ? `${str} ` : str; + }); + }; + return ( <> {unparsedTx ? ( @@ -887,11 +933,11 @@ <>

{' '} - { + {parseLinkInOpReturnMsgs( data .parsed - .opReturnMessage - } + .opReturnMessage, + )}

{!addressesInContactList.includes( data @@ -945,11 +991,11 @@ .decryptionSuccess } > - { + {parseLinkInOpReturnMsgs( data .parsed - .opReturnMessage - } + .opReturnMessage, + )} {!addressesInContactList.includes( data @@ -982,11 +1028,11 @@ !data.parsed .isEncryptedMessage ? (

- { + {parseLinkInOpReturnMsgs( data .parsed - .opReturnMessage - } + .opReturnMessage, + )}

) : ( '' @@ -999,11 +1045,11 @@ data.parsed .decryptionSuccess ? (

- { + {parseLinkInOpReturnMsgs( data .parsed - .opReturnMessage - } + .opReturnMessage, + )}

) : ( '' @@ -1016,11 +1062,11 @@ !data.parsed .decryptionSuccess ? ( - { + {parseLinkInOpReturnMsgs( data .parsed - .opReturnMessage - } + .opReturnMessage, + )} ) : ( '' @@ -1183,4 +1229,8 @@ ]), }; +OpReturnLink.propTypes = { + url: PropTypes.string, + children: PropTypes.node, +}; export default Tx; diff --git a/web/cashtab/src/components/Home/__tests__/__snapshots__/Home.test.js.snap b/web/cashtab/src/components/Home/__tests__/__snapshots__/Home.test.js.snap --- a/web/cashtab/src/components/Home/__tests__/__snapshots__/Home.test.js.snap +++ b/web/cashtab/src/components/Home/__tests__/__snapshots__/Home.test.js.snap @@ -3,13 +3,13 @@ exports[`Wallet with BCH balances 1`] = ` Array [

MigrationTestAlpha

@@ -51,10 +51,10 @@
0 @@ -65,26 +65,26 @@
,
@@ -133,13 +133,13 @@ exports[`Wallet with BCH balances and tokens 1`] = ` Array [

MigrationTestAlpha

@@ -181,10 +181,10 @@
0 @@ -195,26 +195,26 @@
,