fix inactive staking principal + reward bug (#20428)

## Description 

Describe the changes or additions included in this PR.

## Test plan 

How did you test the new or updated feature?

---

## Release notes

Check each box that your changes affect. If none of the boxes relate to
your changes, release notes aren't required.

For each box you select, include information after the relevant heading
that describes the impact of your changes that a user might notice and
any actions they must take to implement updates.

- [ ] Protocol: 
- [ ] Nodes (Validators and Full nodes): 
- [ ] Indexer: 
- [ ] JSON-RPC: 
- [ ] GraphQL: 
- [ ] CLI: 
- [ ] Rust SDK:
- [ ] REST API:

apps/wallet/src/ui/app/staking/home/StakedCard.tsx

@@ -8,6 +8,7 @@ import { IconTooltip } from '_src/ui/app/shared/tooltip';
 import { useFormatCoin, useGetTimeBeforeEpochNumber } from '@mysten/core';
 import { type StakeObject } from '@mysten/sui/client';
 import { SUI_TYPE_ARG } from '@mysten/sui/utils';
+import BigNumber from 'bignumber.js';
 import { cva, cx, type VariantProps } from 'class-variance-authority';
 import type { ReactNode } from 'react';
 import { Link } from 'react-router-dom';
@@ -127,7 +128,7 @@ export function StakeCard({
 
 	// For inactive validator, show principal + rewards
 	const [principalStaked, symbol] = useFormatCoin(
-		inactiveValidator ? principal + rewards : principal,
+		inactiveValidator ? new BigNumber(principal).plus(rewards.toString()).toString() : principal,
 		SUI_TYPE_ARG,
 	);
 	const [rewardsStaked] = useFormatCoin(rewards, SUI_TYPE_ARG);