Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

PTD-1306 #982

Merged
merged 7 commits into from
Oct 1, 2024
Merged

PTD-1306 #982

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
482875a
refactor: use native_resource_details for summary creation part 1
dawidsowardx Oct 1, 2024
b953b0b
refactor: remove `/validators/list` call from preview pages
dawidsowardx Oct 1, 2024
baebc01
refactor: recognize pool_units based on native resource details
dawidsowardx Oct 1, 2024
d74a381
refactor: use `native_resource_details` to find LSUs and Claim NFTs
dawidsowardx Oct 1, 2024
072ac72
refactor: remove artificial, not needed promise wrapping
dawidsowardx Oct 1, 2024
be1ae9e
refactor: use `native_resource_details` to calculate pool units redee…
dawidsowardx Oct 1, 2024
63d70d5
refactor: remove duplicated/obsolete code and rename functions
dawidsowardx Oct 1, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
169 changes: 95 additions & 74 deletions apps/dashboard/src/lib/staking-card/StakedValidatorCard.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,89 +6,110 @@
import { formatXRDValue, formatTokenValue } from '@utils'
import BigNumber from 'bignumber.js'
import ValueBox from './ValueBox.svelte'

import ValidatorPlaceholder from '@icons/validator-placeholder.svg'
export let validatorStakes: any
</script>
import type { AccumulatedStakeInfo } from '../summary/summary'
import { onMount } from 'svelte'
import { validatorsCacheModule } from '@api/utils/validators-cache-module'

<div class="card validator-card">
<Accordion>
<div class="validator-header" slot="header">
<NftImage
url={validatorStakes.validator.metadata.expected.icon_url?.typed.value}
defaultImageUrl={ValidatorPlaceholder}
width={64}
height={64}
/>
<div class="validator-header-info">
<div class="validator-header-name">
<h4>
{validatorStakes.validator.metadata.expected.name?.typed.value ||
''}
</h4>
<Address
value={validatorStakes.validator.address}
autoShorten
--background="var(--theme-surface-3)"
/>
</div>
export let validatorStakes: AccumulatedStakeInfo

<div class="staked-header-info">
Staked {formatXRDValue(validatorStakes.accumulatedStakes)}
</div>
</div>
</div>
<svelte:fragment slot="content">
<div class="units-section">
<div class="content-section-header">
<TokenIcon
iconUrl="https://assets.radixdlt.com/icons/icon-liquid_stake_units.png"
/>
<span class="text">Liquid Stake Units</span>
<span class="value"
>{formatTokenValue(validatorStakes.accumulatedLiquidStakeUnits)
.displayValue}</span
>
</div>
let isLoading: boolean

<ValueBox
header="Worth"
address={validatorStakes.validator.stakeUnitResourceAddress}
value={validatorStakes.accumulatedStakes}
/>
</div>

{#if validatorStakes.unstaking.length || validatorStakes.readyToClaim.length}
<div class="units-section">
<div class="content-section-header">
<NftImage
url="https://assets.radixdlt.com/icons/icon-stake_claim_NFTs.png"
width={44}
height={44}
/>
onMount(() => {
const subscription = validatorsCacheModule.isLoading$.subscribe((data) => {
isLoading = data
})

return () => {
subscription.unsubscribe()
}
})
</script>

<span class="text">Stake Claims</span>
{#key isLoading}
{#if validatorsCacheModule}
{@const validator = validatorsCacheModule.validators.get(
validatorStakes.validatorAddress
)}
<div class="card validator-card">
<Accordion>
<div class="validator-header" slot="header">
<NftImage
url={validator?.iconUrl}
defaultImageUrl={ValidatorPlaceholder}
width={64}
height={64}
/>
<div class="validator-header-info">
<div class="validator-header-name">
<h4>
{validator?.name || ''}
</h4>
<Address
value={validatorStakes.validatorAddress}
autoShorten
--background="var(--theme-surface-3)"
/>
</div>

<div class="staked-header-info">
Staked {formatXRDValue(validatorStakes.accumulatedStakes)}
</div>
</div>
{#each validatorStakes.unstaking as stakeEntry}
<ValueBox
header="Unstaking"
address={validatorStakes.validator.stakeUnitResourceAddress}
value={BigNumber(stakeEntry.xrdAmount)}
/>
{/each}
</div>
<svelte:fragment slot="content">
<div class="units-section">
<div class="content-section-header">
<TokenIcon
iconUrl="https://assets.radixdlt.com/icons/icon-liquid_stake_units.png"
/>
<span class="text">Liquid Stake Units</span>
<span class="value"
>{formatTokenValue(validatorStakes.accumulatedLiquidStakeUnits)
.displayValue}</span
>
</div>

{#each validatorStakes.readyToClaim as stakeEntry}
<ValueBox
header="Ready to Claim"
address={stakeEntry.claimNft.address.nonFungibleAddress}
value={BigNumber(stakeEntry.xrdAmount)}
header="Worth"
address={validator?.poolUnitResourceAddress || ''}
value={validatorStakes.accumulatedStakes}
/>
{/each}
</div>
{/if}
</svelte:fragment>
</Accordion>
</div>
</div>

{#if validatorStakes.unstaking.length || validatorStakes.readyToClaim.length}
<div class="units-section">
<div class="content-section-header">
<NftImage
url="https://assets.radixdlt.com/icons/icon-stake_claim_NFTs.png"
width={44}
height={44}
/>

<span class="text">Stake Claims</span>
</div>
{#each validatorStakes.unstaking as stakeEntry}
<ValueBox
header="Unstaking"
address={validator?.poolUnitResourceAddress || ''}
value={BigNumber(stakeEntry.xrdAmount)}
/>
{/each}

{#each validatorStakes.readyToClaim as stakeEntry}
<ValueBox
header="Ready to Claim"
address={stakeEntry.claimNft.address.nonFungibleAddress}
value={BigNumber(stakeEntry.xrdAmount)}
/>
{/each}
</div>
{/if}
</svelte:fragment>
</Accordion>
</div>
{/if}
{/key}

<style lang="scss">
.validator-card {
Expand Down
Loading
Loading