Fix: show balance and conviction on your delegation (#2959)

* fix: show balance and conviction in delegation info * feat: fill edit delegation form by previous values
novasamatech · Jan 14, 2025 · 4c79cf2 · 4c79cf2
1 parent 89ccd35
commit 4c79cf2
Show file tree

Hide file tree

Showing 5 changed files with 112 additions and 27 deletions.
diff --git a/src/renderer/shared/lib/utils/arrays.ts b/src/renderer/shared/lib/utils/arrays.ts
@@ -189,3 +189,7 @@ export const keys = <K extends PropertyKey>(values: Record<K, unknown>): K[] =>
 export const entries = <K extends string | number, T>(values: Record<K, T>): [key: K, value: T][] => {
   return Object.entries(values) as [key: K, value: T][];
 };
+
+export function allEqual<T>(array: T[], compareFn?: (a: T, b: T) => boolean): boolean {
+  return array.every((item: T) => (compareFn ? compareFn(item, array[0]) : item === array[0]));
+}
diff --git a/src/renderer/widgets/DelegateDetails/ui/YourDelegation.tsx b/src/renderer/widgets/DelegateDetails/ui/YourDelegation.tsx
@@ -5,7 +5,7 @@ import { useI18n } from '@/shared/i18n';
 import { nullable, toAddress } from '@/shared/lib/utils';
 import { Button, DetailRow, FootnoteText, Icon, SmallTitleText } from '@/shared/ui';
 import { Account } from '@/shared/ui-entities';
-import { Tooltip } from '@/shared/ui-kit';
+import { Box, Tooltip } from '@/shared/ui-kit';
 import { AssetBalance } from '@/entities/asset';
 import { allTracks, votingService } from '@/entities/governance';
 import { accountUtils, walletModel } from '@/entities/wallet';
@@ -75,25 +75,47 @@ export const YourDelegation = () => {
           </DetailRow>
 
           {activeAccounts.length === 1 && (
-            <DetailRow label={t('governance.addDelegation.votesLabel')}>
-              <FootnoteText>
-                <Trans
-                  t={t}
-                  i18nKey="governance.addDelegation.votesValue"
-                  components={{
-                    votes: (
-                      <AssetBalance
-                        value={votingService.calculateVotingPower(
-                          activeDelegations[activeAccounts[0]]?.balance,
-                          activeDelegations[activeAccounts[0]]?.conviction,
-                        )}
-                        asset={chain?.assets[0]}
-                        showSymbol={false}
-                      />
-                    ),
-                  }}
-                />
-              </FootnoteText>
+            <DetailRow wrapperClassName="items-start" label={t('governance.addDelegation.votesLabel')}>
+              <Box horizontalAlign="end" verticalAlign="end">
+                <FootnoteText>
+                  <Trans
+                    t={t}
+                    i18nKey="governance.addDelegation.votesValue"
+                    components={{
+                      votes: (
+                        <AssetBalance
+                          value={votingService.calculateVotingPower(
+                            activeDelegations[activeAccounts[0]]?.balance,
+                            activeDelegations[activeAccounts[0]]?.conviction,
+                          )}
+                          asset={chain?.assets[0]}
+                          showSymbol={false}
+                        />
+                      ),
+                    }}
+                  />
+                </FootnoteText>
+                <FootnoteText className="text-text-tertiary">
+                  <Trans
+                    t={t}
+                    i18nKey="governance.addDelegation.balanceValue"
+                    values={{
+                      conviction: votingService.getConvictionMultiplier(
+                        activeDelegations[activeAccounts[0]]?.conviction,
+                      ),
+                    }}
+                    components={{
+                      balance: (
+                        <AssetBalance
+                          className="text-text-tertiary"
+                          value={activeDelegations[activeAccounts[0]]?.balance}
+                          asset={chain.assets[0]}
+                        />
+                      ),
+                    }}
+                  />
+                </FootnoteText>
+              </Box>
             </DetailRow>
           )}
         </div>

diff --git a/src/renderer/widgets/DelegateDetails/ui/YourDelegations.tsx b/src/renderer/widgets/DelegateDetails/ui/YourDelegations.tsx
@@ -134,13 +134,19 @@ export const YourDelegations = () => {
                       }}
                     />
                   </BodyText>
-                  <FootnoteText>
+                  <FootnoteText className="text-text-tertiary">
                     <Trans
                       t={t}
                       i18nKey="governance.addDelegation.balanceValue"
                       values={{ conviction: votingService.getConvictionMultiplier(activeDelegation.conviction) }}
                       components={{
-                        balance: <AssetBalance value={activeDelegation.balance} asset={chain.assets[0]} />,
+                        balance: (
+                          <AssetBalance
+                            className="text-text-tertiary"
+                            value={activeDelegation.balance}
+                            asset={chain.assets[0]}
+                          />
+                        ),
                       }}
                     />
                   </FootnoteText>

diff --git a/src/renderer/widgets/EditDelegationModal/model/edit-delegation-model.ts b/src/renderer/widgets/EditDelegationModal/model/edit-delegation-model.ts
@@ -69,6 +69,15 @@ const $txWrappers = createStore<TxWrapper[]>([]).reset(flowFinished);
 const $coreTxs = createStore<Transaction[]>([]).reset(flowFinished);
 const $redirectAfterSubmitPath = createStore<PathType | null>(null).reset(flowStarted);
 
+const $activeDelegations = combine(
+  { delegations: delegationAggregate.$activeDelegations, delegate: $target },
+  ({ delegations, delegate }) => {
+    if (!delegate) return {};
+
+    return delegations[delegate.accountId] || {};
+  },
+);
+
 type FeeParams = {
   api: ApiPromise;
   transaction: Transaction;
@@ -287,10 +296,13 @@ sample({
 
 sample({
   clock: selectTracksModel.output.formSubmitted,
-  source: $walletData,
-  filter: (walletData) => Boolean(walletData.chain) && Boolean(walletData.wallet),
-  fn: (walletData, { tracks, accounts }) => ({
-    event: { wallet: walletData.wallet!, chain: walletData.chain!, shards: accounts },
+  source: {
+    walletData: $walletData,
+    activeDelegations: $activeDelegations,
+  },
+  filter: ({ walletData }) => Boolean(walletData.chain) && Boolean(walletData.wallet),
+  fn: ({ walletData, activeDelegations }, { tracks, accounts }) => ({
+    event: { wallet: walletData.wallet!, chain: walletData.chain!, shards: accounts, activeDelegations },
     tracks,
     accounts,
     step: Step.INIT,

diff --git a/src/renderer/widgets/EditDelegationModal/model/form-model.ts b/src/renderer/widgets/EditDelegationModal/model/form-model.ts
@@ -7,7 +7,9 @@ import { spread } from 'patronum';
 import { type Asset, type Chain, type Conviction } from '@/shared/core';
 import {
   ZERO_BALANCE,
+  allEqual,
   formatAmount,
+  getBalanceBn,
   getRelaychainAsset,
   nonNullable,
   toAddress,
@@ -31,7 +33,18 @@ type FormParams = {
   locks: Record<string, BN>;
 };
 
-const formInitiated = createEvent<WalletData & { shards: AnyAccount[] }>();
+const formInitiated = createEvent<
+  WalletData & {
+    shards: AnyAccount[];
+    activeDelegations: Record<
+      string,
+      {
+        conviction: Conviction;
+        balance: BN;
+      }
+    >;
+  }
+>();
 const formSubmitted = createEvent();
 const formChanged = createEvent<FormParams>();
 const formCleared = createEvent();
@@ -315,6 +328,34 @@ sample({
   target: $delegateForm.fields.shards.onChange,
 });
 
+sample({
+  clock: formInitiated,
+  filter: ({ activeDelegations }) => {
+    const convictions = Object.values(activeDelegations).map((d) => d.conviction);
+
+    return allEqual(convictions);
+  },
+  fn: ({ activeDelegations }) => Object.values(activeDelegations)[0].conviction,
+  target: $delegateForm.fields.conviction.onChange,
+});
+
+sample({
+  clock: formInitiated,
+  source: $networkStore,
+  filter: (network, { activeDelegations }) => {
+    const balances = Object.values(activeDelegations).map((d) => d.balance);
+
+    return !!network && allEqual(balances, (a, b) => a.eq(b));
+  },
+  fn: (network, { activeDelegations }) => {
+    const balance = Object.values(activeDelegations)[0].balance.toString();
+    const precision = network!.asset.precision;
+
+    return getBalanceBn(balance, precision).toString();
+  },
+  target: $delegateForm.fields.amount.onChange,
+});
+
 sample({
   clock: txWrapperChanged,
   target: spread({