Differential D10833 Diff 31825 web/cashtab/src/components/Wallet/Tx.js

Changeset View

Standalone View

web/cashtab/src/components/Wallet/Tx.js

import React from 'react';		import React from 'react';
import { Link } from 'react-router-dom';		import { Link } from 'react-router-dom';
import PropTypes from 'prop-types';		import PropTypes from 'prop-types';
import styled from 'styled-components';		import styled from 'styled-components';
import {		import {
ArrowUpOutlined,		ArrowUpOutlined,
ArrowDownOutlined,		ArrowDownOutlined,
ExperimentOutlined,		ExperimentOutlined,
ExclamationOutlined,		ExclamationOutlined,
		CopyOutlined,
} from '@ant-design/icons';		} from '@ant-design/icons';
		import { generalNotification } from '@components/Common/Notifications';
		import { CopyToClipBoardStyle } from '@components/Common/Atoms';
import { currency } from '@components/Common/Ticker';		import { currency } from '@components/Common/Ticker';
import makeBlockie from 'ethereum-blockies-base64';		import makeBlockie from 'ethereum-blockies-base64';
import { Img } from 'react-image';		import { Img } from 'react-image';
import { fromLegacyDecimals } from '@utils/cashMethods';		import { fromLegacyDecimals } from '@utils/cashMethods';
import { formatBalance, formatDate } from '@utils/formatting';		import { formatBalance, formatDate } from '@utils/formatting';
const SentTx = styled(ArrowUpOutlined)`		const SentTx = styled(ArrowUpOutlined)`
color: ${props => props.theme.secondary} !important;		color: ${props => props.theme.secondary} !important;
`;		`;
▲ Show 20 Lines • Show All 169 Lines • ▼ Show 20 Lines	:hover {
transition: all 0.8s cubic-bezier(0.075, 0.82, 0.165, 1) 0s;		transition: all 0.8s cubic-bezier(0.075, 0.82, 0.165, 1) 0s;
}		}
@media screen and (max-width: 500px) {		@media screen and (max-width: 500px) {
grid-template-columns: 24px 30% 50%;		grid-template-columns: 24px 30% 50%;
padding: 12px 12px;		padding: 12px 12px;
}		}
`;		`;

		const handleCopyMsgToClipboard = (message, e) => {
		// prevent the click of the clipboard button from opening up the explorer link
		if (e) {
		e.stopPropagation();
		}

		// @TODO: back out the Buffer.from().toString() conversion once D10821 lands
		navigator.clipboard.writeText(Buffer.from(message).toString());

		generalNotification('Message copied to clipboard');
		};

const Tx = ({ data, fiatPrice, fiatCurrency }) => {		const Tx = ({ data, fiatPrice, fiatCurrency }) => {
const txDate =		const txDate =
typeof data.blocktime === 'undefined'		typeof data.blocktime === 'undefined'
? formatDate()		? formatDate()
: formatDate(data.blocktime, navigator.language);		: formatDate(data.blocktime, navigator.language);
// if data only includes height and txid, then the tx could not be parsed by cashtab		// if data only includes height and txid, then the tx could not be parsed by cashtab
// render as such but keep link to block explorer		// render as such but keep link to block explorer
let unparsedTx = false;		let unparsedTx = false;
▲ Show 20 Lines • Show All 250 Lines • ▼ Show 20 Lines	return (
<UnauthorizedDecryptionMessage>		<UnauthorizedDecryptionMessage>
{Buffer.from(		{Buffer.from(
data.opReturnMessage,		data.opReturnMessage,
).toString()}		).toString()}
</UnauthorizedDecryptionMessage>		</UnauthorizedDecryptionMessage>
) : (		) : (
''		''
)}		)}

		{data.opReturnMessage ? (
		<CopyToClipBoardStyle>
		<CopyOutlined
		onClick={e =>
		handleCopyMsgToClipboard(
		data.opReturnMessage,
		e,
		)
		}
		/>
		</CopyToClipBoardStyle>
		) : (
		''
		)}
{!data.outgoingTx && data.replyAddress ? (		{!data.outgoingTx && data.replyAddress ? (
<Link		<Link
		onClick={e => e.stopPropagation()}
to={{		to={{
pathname: `/send`,		pathname: `/send`,
state: {		state: {
replyAddress: data.replyAddress,		replyAddress: data.replyAddress,
},		},
}}		}}
>		>
<br />		<br />
Show All 24 Lines