688345f · bridge · git.iko.soy

git.iko.soy/bridge

ui: address PR feedback

- confirmed --> completed - add `i` icon to `failed` status badge

commit688345f14b2cc035f54be8d60b69fe2c81eb1d0d authortomholford <tomholford@users.noreply.github.com> dateWed 27 Oct 2021, 20:19 (5 years ago) parent2f5bbeb

4 files changed+19−12

compare with master

unifiedsplit

src/lib/constants.ts+1−1 src/views/Transactions/TransactionHistory.scss+15−2 src/views/Transactions/TransactionHistory.tsx+1−1 src/views/Transactions/TransactionRow.tsx+2−8

src/lib/constants.ts+1−1

@@ -132,7 +132,7 @@ const TRANSACTION_STATUS_ICONS = {

132132 confirmed: 'Checkmark',

133133 pending: 'Clock',

134134 sending: 'ArrowNorth',

135− failed: 'X',

135+ failed: 'ExclaimationMark',

136136 unknown: 'NullIcon',

137137};

138138

src/views/Transactions/TransactionHistory.scss+15−2

@@ -230,11 +230,20 @@

230230 &.failed {

231231 background-color: rgb(246,200,196);

232232 color: rgb(236,81,66);

233− width: 58px;

233+ width: 62px;

234+

235+ span.icon-wrapper {

236+ height: 16px;

237+ width: 16px;

238+ border-radius: 50%;

239+ background-color: #FF4136;

240+ }

234241

235242 svg {

243+ padding-top: 1px;

244+

236245 path {

237− fill: rgb(236,81,66);;

246+ fill: white;

238247 }

239248 }

240249 }

@@ -250,6 +259,10 @@

250259 }

251260 }

252261 }

262+

263+ &.unknown {

264+ width: 82px;

265+ }

253266 }

254267 }

255268 }

src/views/Transactions/TransactionHistory.tsx+1−1

@@ -144,7 +144,7 @@ const TransactionHistory = () => {

144144 <PatpRow patp={patp} />

145145 {txnsByPatp[patp]

146146 .sort((a, b) => {

147− return a.time - b.time;

147+ return b.time - a.time;

148148 })

149149 .map(tx => (

150150 <TransactionRow key={tx.time} {...tx} />

src/views/Transactions/TransactionRow.tsx+2−8

@@ -78,16 +78,10 @@ export const TransactionRow = ({

7878 const statusBadge = useMemo(() => {

7979 return (

8080 <div className={cn(['badge', status])}>

81− <span>

81+ <span className={'icon-wrapper'}>

8282 <Icon icon={TRANSACTION_STATUS_ICONS[status] || 'Bug'} />

8383 </span>

84− <span>

85− {status === 'pending'

86− ? nextRoll

87− : status === 'confirmed'

88− ? 'Completed'

89− : titleize(status)}

90− </span>

84+ <span>{status === 'pending' ? nextRoll : titleize(status)}</span>

9185 </div>

9286 );

9387 }, [nextRoll, status]);