Skip to content

Commit 0762eb5

Browse files
PatrickDinhPatrickDinh
authored
feat: view asset config transaction
1 parent 7c3baab commit 0762eb5

22 files changed

+711
-92
lines changed

‎src/features/accounts/components/account-link.tsx‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import { cn } from '@/features/common/utils'
2+
import { ellipseAddress } from '@/utils/ellipse-address'
3+
import { PropsWithChildren } from 'react'
4+
5+
type Props = PropsWithChildren<{
6+
address: string
7+
short?: boolean
8+
className?: string
9+
}>
10+
11+
export function AccountLink({ address, short, className, children }: Props) {
12+
return (
13+
<a href="#" className={cn(!children && 'text-primary underline', className)}>
14+
{children ? children : short ? ellipseAddress(address) : address}
15+
</a>
16+
)
17+
}

‎src/features/blocks/components/transactions.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,7 @@ export const columns: ColumnDef<TransactionModel>[] = [
3131
if (transaction.type === TransactionType.Payment || transaction.type === TransactionType.AssetTransfer)
3232
return ellipseAddress(transaction.receiver)
3333
if (transaction.type === TransactionType.ApplicationCall) return transaction.applicationId
34+
if (transaction.type === TransactionType.AssetConfig) return transaction.assetId
3435
},
3536
},
3637
{

‎src/features/common/components/tabs.tsx‎

Lines changed: 20 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -40,4 +40,23 @@ const TabsContent = React.forwardRef<
4040
))
4141
TabsContent.displayName = TabsPrimitive.Content.displayName
4242

43-
export { Tabs, TabsList, TabsTrigger, TabsContent }
43+
const OverflowAutoTabsContent = React.forwardRef<
44+
React.ElementRef<typeof TabsPrimitive.Content>,
45+
React.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>
46+
>(({ className, children, ...props }, ref) => (
47+
<TabsPrimitive.Content
48+
ref={ref}
49+
className={cn(
50+
'ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 border-solid border-2',
51+
className
52+
)}
53+
{...props}
54+
>
55+
<div className="grid">
56+
<div className={cn('overflow-auto p-4')}>{children}</div>
57+
</div>
58+
</TabsPrimitive.Content>
59+
))
60+
OverflowAutoTabsContent.displayName = TabsPrimitive.Content.displayName
61+
62+
export { Tabs, TabsList, TabsTrigger, TabsContent, OverflowAutoTabsContent }

‎src/features/transactions/components/__snapshots__/application-transaction-view-visual.INDQXWQXHF22SO45EZY7V6FFNI6WUD5FHRVDV6NCU6HD424BJGGA.html‎

Lines changed: 14 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<div>
22
<div
3-
class="relative grid overflow-auto"
3+
class="relative grid"
44
style="grid-template-columns: minmax(168px, 168px) repeat(9, 128px); grid-template-rows: repeat(15, 40px);"
55
>
66
<div />
@@ -236,7 +236,7 @@
236236
</svg>
237237
</div>
238238
<div
239-
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs"
239+
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs text-center"
240240
>
241241
App Call
242242
</div>
@@ -344,7 +344,7 @@
344344
</svg>
345345
</div>
346346
<div
347-
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs"
347+
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs text-center"
348348
>
349349
Payment
350350
<div
@@ -480,7 +480,7 @@
480480
</svg>
481481
</div>
482482
<div
483-
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs"
483+
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs text-center"
484484
>
485485
App Call
486486
</div>
@@ -586,7 +586,7 @@
586586
/>
587587
</div>
588588
<div
589-
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs"
589+
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs text-center"
590590
>
591591
Transfer
592592
<div
@@ -700,7 +700,7 @@
700700
</svg>
701701
</div>
702702
<div
703-
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs"
703+
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs text-center"
704704
>
705705
Transfer
706706
<div
@@ -816,7 +816,7 @@
816816
</svg>
817817
</div>
818818
<div
819-
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs"
819+
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs text-center"
820820
>
821821
App Call
822822
</div>
@@ -922,7 +922,7 @@
922922
/>
923923
</div>
924924
<div
925-
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs"
925+
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs text-center"
926926
>
927927
Transfer
928928
<div
@@ -1034,7 +1034,7 @@
10341034
</svg>
10351035
</div>
10361036
<div
1037-
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs"
1037+
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs text-center"
10381038
>
10391039
Transfer
10401040
<div
@@ -1149,7 +1149,7 @@
11491149
</svg>
11501150
</div>
11511151
<div
1152-
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs"
1152+
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs text-center"
11531153
>
11541154
App Call
11551155
</div>
@@ -1255,7 +1255,7 @@
12551255
/>
12561256
</div>
12571257
<div
1258-
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs"
1258+
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs text-center"
12591259
>
12601260
Transfer
12611261
<div
@@ -1366,7 +1366,7 @@
13661366
</svg>
13671367
</div>
13681368
<div
1369-
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs"
1369+
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs text-center"
13701370
>
13711371
Transfer
13721372
<div
@@ -1480,7 +1480,7 @@
14801480
</svg>
14811481
</div>
14821482
<div
1483-
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs"
1483+
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs text-center"
14841484
>
14851485
App Call
14861486
</div>
@@ -1582,7 +1582,7 @@
15821582
/>
15831583
</div>
15841584
<div
1585-
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs"
1585+
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs text-center"
15861586
>
15871587
Payment
15881588
<div

‎src/features/transactions/components/__snapshots__/application-transaction-view-visual.KMNBSQ4ZFX252G7S4VYR4ZDZ3RXIET5CNYQVJUO5OXXPMHAMJCCQ.html‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<div>
22
<div
3-
class="relative grid overflow-auto"
3+
class="relative grid"
44
style="grid-template-columns: minmax(148px, 148px) repeat(5, 128px); grid-template-rows: repeat(4, 40px);"
55
>
66
<div />
@@ -168,7 +168,7 @@
168168
</svg>
169169
</div>
170170
<div
171-
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs"
171+
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs text-center"
172172
>
173173
App Call
174174
</div>
@@ -272,7 +272,7 @@
272272
/>
273273
</div>
274274
<div
275-
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs"
275+
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs text-center"
276276
>
277277
Payment
278278
<div
@@ -398,7 +398,7 @@
398398
</svg>
399399
</div>
400400
<div
401-
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs"
401+
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs text-center"
402402
>
403403
App Call
404404
</div>

‎src/features/transactions/components/__snapshots__/asset-transfer-view-visual.563MNGEL2OF4IBA7CFLIJNMBETT5QNKZURSLIONJBTJFALGYOAUA.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<div>
22
<div
3-
class="relative grid overflow-auto"
3+
class="relative grid"
44
style="grid-template-columns: minmax(128px, 128px) repeat(2, 128px); grid-template-rows: repeat(2, 40px);"
55
>
66
<div />

‎src/features/transactions/components/__snapshots__/asset-transfer-view-visual.JBDSQEI37W5KWPQICT2IGCG2FWMUGJEUYYK3KFKNSYRNAXU2ARUA.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<div>
22
<div
3-
class="relative grid overflow-auto"
3+
class="relative grid"
44
style="grid-template-columns: minmax(128px, 128px) repeat(3, 128px); grid-template-rows: repeat(2, 40px);"
55
>
66
<div />
@@ -130,7 +130,7 @@
130130
</svg>
131131
</div>
132132
<div
133-
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs"
133+
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs text-center"
134134
>
135135
Transfer
136136
<div

‎src/features/transactions/components/__snapshots__/payment-transaction-view-visual.FBORGSDC4ULLWHWZUMUFIYQLSDC26HGLTFD7EATQDY37FHCIYBBQ.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<div>
22
<div
3-
class="relative grid overflow-auto"
3+
class="relative grid"
44
style="grid-template-columns: minmax(128px, 128px) repeat(3, 128px); grid-template-rows: repeat(2, 40px);"
55
>
66
<div />
@@ -130,7 +130,7 @@
130130
</svg>
131131
</div>
132132
<div
133-
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs"
133+
class="absolute z-20 bg-card p-2 text-foreground w-20 text-xs text-center"
134134
>
135135
Payment
136136
<div

‎src/features/transactions/components/__snapshots__/payment-transaction-view-visual.ILDCD5Z64CYSLEZIHBG5DVME2ITJI2DIVZAPDPEWPCYMTRA5SVGA.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<div>
22
<div
3-
class="relative grid overflow-auto"
3+
class="relative grid"
44
style="grid-template-columns: minmax(128px, 128px) repeat(2, 128px); grid-template-rows: repeat(2, 40px);"
55
>
66
<div />

‎src/features/transactions/components/asset-config-transaction-info.tsx‎

Lines changed: 124 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,124 @@
1+
import { cn } from '@/features/common/utils'
2+
import { useMemo } from 'react'
3+
import { AssetConfigTransactionModel, InnerAssetConfigTransactionModel } from '../models'
4+
import { DescriptionList } from '@/features/common/components/description-list'
5+
import { transactionSenderLabel } from './transaction-view-table'
6+
import { AccountLink } from '@/features/accounts/components/account-link'
7+
import { isDefined } from '@/utils/is-defined'
8+
9+
type Props = {
10+
transaction: AssetConfigTransactionModel | InnerAssetConfigTransactionModel
11+
}
12+
13+
export const assetIdLabel = 'Asset ID'
14+
export const assetUrlLabel = 'URL'
15+
export const assetUnitLabel = 'Unit'
16+
export const assetDecimalsLabel = 'Decimals'
17+
export const assetTotalSupplyLabel = 'Total Supply'
18+
export const assetManagerLabel = 'Manager'
19+
export const assetReserveLabel = 'Reserve'
20+
export const assetFreezeLabel = 'Freeze'
21+
export const assetClawbackLabel = 'Clawback'
22+
export const assetDefaultFrozenLabel = 'Default Frozen'
23+
24+
export function AssetConfigTransactionInfo({ transaction }: Props) {
25+
const items = useMemo(
26+
() =>
27+
[
28+
{
29+
dt: transactionSenderLabel,
30+
dd: <AccountLink address={transaction.sender} />,
31+
},
32+
{
33+
dt: assetIdLabel,
34+
dd: (
35+
<a href="#" className={cn('text-primary underline')}>
36+
{transaction.assetId}
37+
{transaction.name && ` (${transaction.name})`}
38+
</a>
39+
),
40+
},
41+
transaction.url
42+
? {
43+
dt: assetUrlLabel,
44+
dd: (
45+
<a href={transaction.url} className={cn('text-primary underline')}>
46+
{transaction.url}
47+
</a>
48+
),
49+
}
50+
: undefined,
51+
transaction.unitName
52+
? {
53+
dt: assetUnitLabel,
54+
dd: transaction.unitName,
55+
}
56+
: undefined,
57+
transaction.decimals != null
58+
? {
59+
dt: assetDecimalsLabel,
60+
dd: transaction.decimals.toString(),
61+
}
62+
: undefined,
63+
transaction.total != null
64+
? {
65+
dt: assetTotalSupplyLabel,
66+
dd: transaction.total.toString(),
67+
}
68+
: undefined,
69+
transaction.manager
70+
? {
71+
dt: assetManagerLabel,
72+
dd: <AccountLink address={transaction.manager} />,
73+
}
74+
: undefined,
75+
transaction.reserve
76+
? {
77+
dt: assetReserveLabel,
78+
dd: <AccountLink address={transaction.reserve} />,
79+
}
80+
: undefined,
81+
transaction.freeze
82+
? {
83+
dt: assetFreezeLabel,
84+
dd: <AccountLink address={transaction.freeze} />,
85+
}
86+
: undefined,
87+
transaction.clawback
88+
? {
89+
dt: assetClawbackLabel,
90+
dd: <AccountLink address={transaction.clawback} />,
91+
}
92+
: undefined,
93+
transaction.defaultFrozen != null
94+
? {
95+
dt: assetDefaultFrozenLabel,
96+
dd: transaction.defaultFrozen ? 'Yes' : 'No',
97+
}
98+
: undefined,
99+
].filter(isDefined),
100+
[
101+
transaction.assetId,
102+
transaction.clawback,
103+
transaction.decimals,
104+
transaction.defaultFrozen,
105+
transaction.freeze,
106+
transaction.manager,
107+
transaction.name,
108+
transaction.reserve,
109+
transaction.sender,
110+
transaction.total,
111+
transaction.unitName,
112+
transaction.url,
113+
]
114+
)
115+
116+
return (
117+
<div className={cn('space-y-2')}>
118+
<div className={cn('flex items-center justify-between')}>
119+
<h1 className={cn('text-2xl text-primary font-bold')}>Asset Config</h1>
120+
</div>
121+
<DescriptionList items={items} />
122+
</div>
123+
)
124+
}

0 commit comments

Comments
 (0)