Differential D11521 Diff 33698 web/cashtab/src/components/Home/Tx.js

Changeset View

Standalone View

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

Show First 20 Lines • Show All 102 Lines • ▼ Show 20 Lines	const RightTextCtn = styled.div`
flex-direction: column;		flex-direction: column;
margin-left: 10px;		margin-left: 10px;
h3 {		h3 {
color: ${props => props.theme.contrast};		color: ${props => props.theme.contrast};
font-size: 14px;		font-size: 14px;
font-weight: 700;		font-weight: 700;
margin: 0;		margin: 0;
}		}
.genesis {
color: ${props => props.theme.genesisGreen};
}
.received {
color: ${props => props.theme.eCashBlue};
}
h4 {		h4 {
font-size: 12px;		font-size: 12px;
color: ${props => props.theme.lightWhite};		color: ${props => props.theme.lightWhite};
margin: 0;		margin: 0;
}		}
`;		`;
const OpReturnType = styled.div`		const OpReturnType = styled.div`
text-align: right;		text-align: right;
▲ Show 20 Lines • Show All 64 Lines • ▼ Show 20 Lines	const TxInfo = styled.div`
margin-left: 10px;		margin-left: 10px;
flex-grow: 2;		flex-grow: 2;
h3 {		h3 {
color: ${props => props.theme.contrast};		color: ${props => props.theme.contrast};
font-size: 14px;		font-size: 14px;
font-weight: 700;		font-weight: 700;
margin: 0;		margin: 0;
}		}
.genesis {
color: ${props => props.theme.genesisGreen};
}
.received {
color: ${props => props.theme.eCashBlue};
}
h4 {		h4 {
font-size: 12px;		font-size: 12px;
color: ${props => props.theme.lightWhite};		color: ${props => props.theme.lightWhite};
margin: 0;		margin: 0;
}		}

@media screen and (max-width: 500px) {		@media screen and (max-width: 500px) {
font-size: 0.8rem;		font-size: 0.8rem;
Show All 31 Lines	const TxTokenIcon = styled.div`
align-self: center;		align-self: center;
`;		`;
const TokenTxAmt = styled.h3`		const TokenTxAmt = styled.h3`
text-align: right;		text-align: right;
white-space: nowrap;		white-space: nowrap;
overflow: hidden;		overflow: hidden;
text-overflow: ellipsis;		text-overflow: ellipsis;
`;		`;

		const TokenTxAmtGenesis = styled(TokenTxAmt)`
		color: ${props => props.theme.genesisGreen} !important;
		`;
		const TokenTxAmtReceived = styled(TokenTxAmt)`
		color: ${props => props.theme.eCashBlue} !important;
		`;

const TokenName = styled.h4`		const TokenName = styled.h4`
text-align: right;		text-align: right;
white-space: nowrap;		white-space: nowrap;
overflow: hidden;		overflow: hidden;
text-overflow: ellipsis;		text-overflow: ellipsis;
`;		`;

const TxWrapper = styled.div`		const TxWrapper = styled.div`
▲ Show 20 Lines • Show All 95 Lines • ▼ Show 20 Lines	return (
<DateType>		<DateType>
<ReceivedLabel>Unparsed</ReceivedLabel>		<ReceivedLabel>Unparsed</ReceivedLabel>
<br />		<br />
{txDate}		{txDate}
</DateType>		</DateType>
<TxInfo>Open in Explorer</TxInfo>		<TxInfo>Open in Explorer</TxInfo>
</TxWrapper>		</TxWrapper>
) : (		) : (
<AntdContextCollapseWrapper className="antd-collapse">		<AntdContextCollapseWrapper>
<Collapse bordered={false}>		<Collapse bordered={false}>
<Panel		<Panel
showArrow={false}		showArrow={false}
header={		header={
<>		<>
<TxWrapper>		<TxWrapper>
{data.outgoingTx ? (		{data.outgoingTx ? (
<>		<>
▲ Show 20 Lines • Show All 55 Lines • ▼ Show 20 Lines	return (
/>		/>
</TxTokenIcon>		</TxTokenIcon>
{data.outgoingTx ? (		{data.outgoingTx ? (
<RightTextCtn>		<RightTextCtn>
{data.tokenInfo		{data.tokenInfo
.transactionType ===		.transactionType ===
'GENESIS' ? (		'GENESIS' ? (
<>		<>
<TokenTxAmt className="genesis">		<TokenTxAmtGenesis>
+{' '}		+{' '}
{data.tokenInfo.qtyReceived.toString()}		{data.tokenInfo.qtyReceived.toString()}

{		{
data		data
.tokenInfo		.tokenInfo
.tokenTicker		.tokenTicker
}		}
</TokenTxAmt>		</TokenTxAmtGenesis>
<TokenName>		<TokenName>
{		{
data		data
.tokenInfo		.tokenInfo
.tokenName		.tokenName
}		}
</TokenName>		</TokenName>
</>		</>
Show All 16 Lines	return (
.tokenName		.tokenName
}		}
</TokenName>		</TokenName>
</>		</>
)}		)}
</RightTextCtn>		</RightTextCtn>
) : (		) : (
<RightTextCtn>		<RightTextCtn>
<TokenTxAmt className="received">		<TokenTxAmtReceived>
+{' '}		+{' '}
{data.tokenInfo.qtyReceived.toString()}		{data.tokenInfo.qtyReceived.toString()}

{		{
data		data
.tokenInfo		.tokenInfo
.tokenTicker		.tokenTicker
}		}
</TokenTxAmt>		</TokenTxAmtReceived>
<TokenName>		<TokenName>
{		{
data		data
.tokenInfo		.tokenInfo
.tokenName		.tokenName
}		}
</TokenName>		</TokenName>
</RightTextCtn>		</RightTextCtn>
▲ Show 20 Lines • Show All 48 Lines • ▼ Show 20 Lines	return (
.fiatCurrencies		.fiatCurrencies
.fiatCurrency		.fiatCurrency
}		}
</h4>		</h4>
)}		)}
</>		</>
) : (		) : (
<>		<>
<h3 className="received">		<TokenTxAmtReceived>
+		+
{formatBalance(		{formatBalance(
fromLegacyDecimals(		fromLegacyDecimals(
data.amountReceived,		data.amountReceived,
),		),
)}{' '}		)}{' '}
{		{
currency.ticker		currency.ticker
}		}
</h3>		</TokenTxAmtReceived>
{fiatPrice !==		{fiatPrice !==
null &&		null &&
!isNaN(		!isNaN(
data.amountReceived,		data.amountReceived,
) && (		) && (
<h4>		<h4>
+		+
{		{
▲ Show 20 Lines • Show All 208 Lines • Show Last 20 Lines