1
1
import { bech32mIdentityKey } from '@penumbra-zone/bech32m/penumbravalid' ;
2
- import type {
2
+ import {
3
+ getBalanceView ,
4
+ getMetadataFromBalancesResponse ,
5
+ getValueViewCaseFromBalancesResponse ,
6
+ } from '@penumbra-zone/getters/balances-response' ;
7
+ import {
8
+ getAmount ,
9
+ getEquivalentValues ,
10
+ getExtendedMetadata ,
11
+ getSymbolFromValueView ,
12
+ } from '@penumbra-zone/getters/value-view' ;
13
+ import {
3
14
ValueView ,
4
15
ValueView_KnownAssetId ,
5
16
} from '@penumbra-zone/protobuf/penumbra/core/asset/v1/asset_pb' ;
6
17
import { ValidatorInfo } from '@penumbra-zone/protobuf/penumbra/core/component/stake/v1/stake_pb' ;
7
18
import { ValueViewComponent } from '@penumbra-zone/ui/ValueViewComponent' ;
8
- import { ValueComponent } from '@penumbra-zone/ui/components/value/value' ;
9
19
10
20
import type React from 'react' ;
11
21
import { useBalances , useDelegations } from './hooks' ;
@@ -15,42 +25,29 @@ const Staking: React.FC = () => {
15
25
const validators =
16
26
delegations
17
27
?. filter (
18
- ( delegation ) =>
19
- delegation ?. valueView ?. valueView ?. value ?. amount ?. toJsonString ( ) !==
20
- '{}' ,
28
+ ( delegation ) => getAmount ( delegation . valueView ) . toJsonString ( ) !== '{}' ,
21
29
)
22
30
. map ( ( delegation ) => {
23
- const valueView = delegation . valueView ?. valueView
24
- ?. value as ValueView_KnownAssetId ;
25
- return ValidatorInfo . fromBinary (
26
- valueView . extendedMetadata ?. value as Uint8Array ,
27
- ) ;
31
+ const extendedMetadata = getExtendedMetadata ( delegation . valueView ) ;
32
+ return ValidatorInfo . fromBinary ( extendedMetadata . value as Uint8Array ) ;
28
33
} ) ?? [ ] ;
29
34
const { data : balances } = useBalances ( ) ;
30
35
const delegationTokens =
31
36
balances
32
37
?. filter (
33
38
( balance ) =>
34
- balance ?. balanceView ?. valueView . case === 'knownAssetId' &&
35
- balance ?. balanceView ?. valueView ?. value ?. metadata ?. base . includes (
36
- 'udelegation' ,
37
- ) ,
39
+ getValueViewCaseFromBalancesResponse ( balance ) === 'knownAssetId' &&
40
+ getMetadataFromBalancesResponse ( balance ) . base . includes ( 'udelegation' ) ,
38
41
)
39
42
. map ( ( balance ) => {
40
43
const bal = balance ;
41
- // @ts -expect-error bufs for the win
42
- (
43
- bal . balanceView ?. valueView ?. value as ValueView_KnownAssetId
44
- ) . metadata . symbol = truncateMiddle (
45
- // @ts -expect-error bufs for the win
46
- ( bal . balanceView ?. valueView ?. value as ValueView_KnownAssetId ) . metadata
47
- . symbol ,
48
- 30 ,
49
- ) ;
44
+ const symbol = getSymbolFromValueView ( bal . balanceView ) ;
45
+
46
+ ( bal . balanceView ?. valueView ?. value as ValueView_KnownAssetId ) !
47
+ . metadata ! . symbol = truncateMiddle ( symbol , 30 ) ;
50
48
return bal ;
51
49
} ) ?? [ ] ;
52
50
53
- console . log ( delegationTokens . length , balances ?. length , balances ) ;
54
51
return (
55
52
< div className = "py-3 flex flex-col gap-8" >
56
53
< div className = "space-y-6" >
@@ -129,7 +126,7 @@ const Staking: React.FC = () => {
129
126
</ div >
130
127
131
128
{ delegationTokens . length === 0 && (
132
- < div className = "w-full bg-white shadow-md rounded-lg p-4" >
129
+ < div className = "w-full bg-gray-700 text- white shadow-md rounded-lg p-4" >
133
130
< div className = "flex flex-row gap-3 items-center" >
134
131
< div > Waiting for a staking delegation to occur</ div >
135
132
< div
@@ -154,10 +151,7 @@ const Staking: React.FC = () => {
154
151
>
155
152
{ delegationTokens ?. map ( ( balance ) => {
156
153
const validator = validators ?. find ( ( validator ) =>
157
- (
158
- balance ?. balanceView ?. valueView
159
- ?. value as ValueView_KnownAssetId
160
- ) ?. metadata ?. base ?. includes (
154
+ getMetadataFromBalancesResponse ( balance ) . base ?. includes (
161
155
bech32mIdentityKey ( {
162
156
ik :
163
157
validator ?. validator ?. identityKey ?. ik ?? new Uint8Array ( ) ,
@@ -172,22 +166,23 @@ const Staking: React.FC = () => {
172
166
< div className = "flex items-center gap-3 justify-center" >
173
167
Successfully staked
174
168
< ValueViewComponent
175
- valueView = { {
176
- valueView : {
177
- // @ts -expect-error TODO: how do we tell typescript these types are correct?
178
- value : {
179
- amount : (
180
- balance ?. balanceView ?. valueView
181
- ?. value as ValueView_KnownAssetId
182
- ) ?. equivalentValues [ 0 ] ?. equivalentAmount ,
183
- metadata : (
184
- balance ?. balanceView ?. valueView
185
- ?. value as ValueView_KnownAssetId
186
- ) ?. equivalentValues [ 0 ] ?. numeraire ,
169
+ valueView = {
170
+ new ValueView ( {
171
+ valueView : {
172
+ value : new ValueView_KnownAssetId ( {
173
+ amount :
174
+ getBalanceView . pipe ( getEquivalentValues ) (
175
+ balance ,
176
+ ) [ 0 ] . equivalentAmount ,
177
+ metadata :
178
+ getBalanceView . pipe ( getEquivalentValues ) (
179
+ balance ,
180
+ ) [ 0 ] . numeraire ,
181
+ } ) ,
182
+ case : 'knownAssetId' ,
187
183
} ,
188
- case : 'knownAssetId' ,
189
- } ,
190
- } }
184
+ } )
185
+ }
191
186
/> { ' ' }
192
187
on
193
188
< a
0 commit comments