2095874266

Build # 2095874266

Build Type

github

Committed by GitHub

Commit Message

<a href="https://github.com/gnosis/safe-react/commit/<a class=hub.com/gnosis/safe-react/commit/<a class="double-link" href="https://git"><a class=hub.com/gnosis/safe-react/commit/<a class="double-link" href="https://git"><a class=hub.com/gnosis/safe-react/commit/<a class="double-link" href="https://git"><a class=hub.com/gnosis/safe-react/commit/0daf219fe11c121281302deaf0a304134a2dcc4e">0daf219fe">&lt;a href=&quot;https://github.com/gnosis/safe-react/commit/</a><a class="double-link" href="https://github.com/gnosis/safe-react/commit/&lt;a class=&quot;double-link&quot; href=&quot;https://git">&lt;a class=</a>hub.com/gnosis/safe-react/commit/&lt;a class=&quot;double-link&quot; href=&quot;https://git">&lt;a class=</a>hub.com/gnosis/safe-react/commit/&lt;a class=&quot;double-link&quot; href=&quot;https://git">&lt;a class=</a>hub.com/gnosis/safe-react/commit/0daf219fe11c121281302deaf0a304134a2dcc4e">0daf219fe</a><a href="https://github.com/gnosis/safe-react/commit/0daf219fe11c121281302deaf0a304134a2dcc4e">&quot;&gt;&amp;lt;a href=&amp;quot;https://github.com/gnosis/safe-react/commit/&lt;/a&gt;&lt;a class=&quot;double-link&quot; href=&quot;https://github.com/gnosis/safe-react/commit/&amp;lt;a class=&amp;quot;double-link&amp;quot; href=&amp;quot;https://git&quot;&gt;&amp;lt;a class=&lt;/a&gt;hub.com/gnosis/safe-react/commit/&amp;lt;a class=&amp;quot;double-link&amp;quot; href=&amp;quot;https://git&quot;&gt;&amp;lt;a class=&lt;/a&gt;hub.com/gnosis/safe-react/commit/&amp;lt;a class=&amp;quot;double-link&amp;quot; href=&amp;quot;https://git&quot;&gt;&amp;lt;a class=&lt;/a&gt;hub.com/gnosis/safe-react/commit/&amp;lt;a class=&amp;quot;double-link&amp;quot; href=&amp;quot;https://git&quot;&gt;&amp;lt;a class=&lt;/a&gt;hub.com/gnosis/safe-react/commit/&amp;lt;a class=&amp;quot;double-link&amp;quot; href=&amp;quot;https://git&quot;&gt;&amp;lt;a class=&lt;/a&gt;hub.com/gnosis/safe-react/commit/0daf219fe11c121281302deaf0a304134a2dcc4e&quot;&gt;0daf219fe&lt;/a&gt;&lt;a href=&quot;https://github.com/gnosis/safe-react/commit/0daf219fe11c121281302deaf0a304134a2dcc4e&quot;&gt;&amp;quot;&amp;gt;&amp;amp;lt;a href=&amp;amp;quot;https://github.com/gnosis/safe-react/commit/&amp;lt;/a&amp;gt;&amp;lt;a class=&amp;quot;double-link&amp;quot; href=&amp;quot;https://github.com/gnosi... (continued)

Pull Request Pull Request #3757: feat: pending transactions widget

Run Details

1233 of 4425 branches covered (27.86%)

Branch coverage included in aggregate %.

66 of 66 new or added lines in 5 files covered. (100.0%)

3479 of 8919 relevant lines covered (39.01%)

36.36 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

0.0

/src/components/Dashboard/PendingTxListItem/index.tsx

import { ReactElement } from 'react'
import { Icon, Text } from '@gnosis.pm/safe-react-components'
import { TransactionSummary } from '@gnosis.pm/safe-react-gateway-sdk'
import { Link } from 'react-router-dom'
import ChevronRightIcon from '@material-ui/icons/ChevronRight'
import styled from 'styled-components'

import { useAssetInfo } from 'src/routes/safe/components/Transactions/TxList/hooks/useAssetInfo'
import { useKnownAddress } from 'src/routes/safe/components/Transactions/TxList/hooks/useKnownAddress'
import { useTransactionType } from 'src/routes/safe/components/Transactions/TxList/hooks/useTransactionType'
import { getTxTo } from 'src/routes/safe/components/Transactions/TxList/utils'
import { grey400, primary200, sm } from 'src/theme/variables'
import { isMultisigExecutionInfo } from 'src/logic/safe/store/models/types/gateway.d'
import Spacer from 'src/components/Spacer'
import { CustomIconText } from 'src/components/CustomIconText'
import { TxInfo } from 'src/routes/safe/components/Transactions/TxList/TxCollapsed'
import { EMPTY_DATA } from 'src/logic/wallets/ethTransactions'

const TransactionToConfirm = styled(Link)`
  min-width: 270px;
  height: 40px;
  display: grid;
  align-items: center;
  grid-template-columns: 25px 3fr 2fr 1.5fr;
  gap: 4px;
  margin: ${sm} auto;
  padding: 4px 8px;
  text-decoration: none;
  background-color: ${({ theme }) => theme.colors.white};
  border: 2px solid ${grey400};
  color: ${({ theme }) => theme.colors.text};
  border-radius: 8px;
`

const StyledConfirmationsCount = styled.div`
  display: flex;
  align-items: center;
  gap: 4px;
  border-radius: 8px;
  background-color: ${primary200};
  padding: 8px 6px;
`

const TxConfirmations = styled.div`
  display: flex;
  align-items: center;
  align-self: flex-end;
  margin-left: auto;
`

type PendingTxType = {
  transaction: TransactionSummary
  url: string
}

const PendingTx = ({ transaction, url }: PendingTxType): ReactElement => {
  const info = useAssetInfo(transaction.txInfo)
  const type = useTransactionType(transaction)
  const toAddress = getTxTo(transaction)
  const toInfo = useKnownAddress(toAddress)

  return (
    <TransactionToConfirm key={transaction.id} to={url}>
      <Text color="text" size="lg" as="span">
        {isMultisigExecutionInfo(transaction.executionInfo) && transaction.executionInfo.nonce}
      </Text>
      <CustomIconText
        address={toAddress?.value || EMPTY_DATA}
        iconUrl={type.icon || toInfo?.logoUri || undefined}
        iconUrlFallback={type.fallbackIcon}
        text={type.text || toInfo?.name || undefined}
      />
      {info ? <TxInfo info={info} /> : <Spacer />}
      <TxConfirmations>
        {isMultisigExecutionInfo(transaction.executionInfo) ? (
          <StyledConfirmationsCount>
            <Icon type="check" size="md" color="primary" />
            {transaction.executionInfo.confirmationsSubmitted}
          </StyledConfirmationsCount>
        ) : (
          <Spacer />
        )}
        <ChevronRightIcon />
      </TxConfirmations>
    </TransactionToConfirm>
  )
}

export default PendingTx

1	import { ReactElement } from 'react'
2	import { Icon, Text } from '@gnosis.pm/safe-react-components'
3	import { TransactionSummary } from '@gnosis.pm/safe-react-gateway-sdk'
4	import { Link } from 'react-router-dom'
5	import ChevronRightIcon from '@material-ui/icons/ChevronRight'
6	import styled from 'styled-components'
7
8	import { useAssetInfo } from 'src/routes/safe/components/Transactions/TxList/hooks/useAssetInfo'
9	import { useKnownAddress } from 'src/routes/safe/components/Transactions/TxList/hooks/useKnownAddress'
10	import { useTransactionType } from 'src/routes/safe/components/Transactions/TxList/hooks/useTransactionType'
11	import { getTxTo } from 'src/routes/safe/components/Transactions/TxList/utils'
12	import { grey400, primary200, sm } from 'src/theme/variables'
13	import { isMultisigExecutionInfo } from 'src/logic/safe/store/models/types/gateway.d'
14	import Spacer from 'src/components/Spacer'
15	import { CustomIconText } from 'src/components/CustomIconText'
16	import { TxInfo } from 'src/routes/safe/components/Transactions/TxList/TxCollapsed'
17	import { EMPTY_DATA } from 'src/logic/wallets/ethTransactions'
18
19	const TransactionToConfirm = styled(Link)`	×
20	min-width: 270px;
21	height: 40px;
22	display: grid;
23	align-items: center;
24	grid-template-columns: 25px 3fr 2fr 1.5fr;
25	gap: 4px;
26	margin: ${sm} auto;
27	padding: 4px 8px;
28	text-decoration: none;
29	background-color: ${({ theme }) => theme.colors.white};	×
30	border: 2px solid ${grey400};
31	color: ${({ theme }) => theme.colors.text};	×
32	border-radius: 8px;
33	`
34
35	const StyledConfirmationsCount = styled.div`	×
36	display: flex;
37	align-items: center;
38	gap: 4px;
39	border-radius: 8px;
40	background-color: ${primary200};
41	padding: 8px 6px;
42	`
43
44	const TxConfirmations = styled.div`	×
45	display: flex;
46	align-items: center;
47	align-self: flex-end;
48	margin-left: auto;
49	`
50
51	type PendingTxType = {
52	transaction: TransactionSummary
53	url: string
54	}
55
56	const PendingTx = ({ transaction, url }: PendingTxType): ReactElement => {	×
57	const info = useAssetInfo(transaction.txInfo)	×
58	const type = useTransactionType(transaction)	×
59	const toAddress = getTxTo(transaction)	×
60	const toInfo = useKnownAddress(toAddress)	×
61
62	return (	×
63	<TransactionToConfirm key={transaction.id} to={url}>
64	<Text color="text" size="lg" as="span">
65	{isMultisigExecutionInfo(transaction.executionInfo) && transaction.executionInfo.nonce}	×
66	</Text>
67	<CustomIconText
68	address={toAddress?.value \|\| EMPTY_DATA}	×
69	iconUrl={type.icon \|\| toInfo?.logoUri \|\| undefined}	×
70	iconUrlFallback={type.fallbackIcon}
71	text={type.text \|\| toInfo?.name \|\| undefined}	×
72	/>
73	{info ? <TxInfo info={info} /> : <Spacer />}	×
74	<TxConfirmations>
75	{isMultisigExecutionInfo(transaction.executionInfo) ? (	×
76	<StyledConfirmationsCount>
77	<Icon type="check" size="md" color="primary" />
78	{transaction.executionInfo.confirmationsSubmitted}
79	</StyledConfirmationsCount>
80	) : (
81	<Spacer />
82	)}
83	<ChevronRightIcon />
84	</TxConfirmations>
85	</TransactionToConfirm>
86	)
87	}
88
89	export default PendingTx

gnosis / safe-react / 2095874266

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous