chore(money-home): show APY even if it is zero (MetaMask#30630)

## **Description**

The APY for the `dev-monad` vault for the money account is zero, but we
don't show it, making UAT and design reviews harder

## **Changelog**

CHANGELOG entry: show even zero APY values on money home

## **Related issues**

Fixes: N/A

## **Manual testing steps**

```gherkin
Feature: my feature name

  Scenario: user [verb for user action]
    Given [describe expected initial app state]

    When user [verb for user action]
    Then [describe expected outcome]
```

## **Screenshots/Recordings**


### **Before**

<img width="735" height="1600" alt="image"
src="https://github.com/user-attachments/assets/17df48b0-435e-4d8f-b24e-b41be37db0f2"
/>

### **After**

<!-- [screenshots/recordings] -->

## **Pre-merge author checklist**


- [X] I've followed [MetaMask Contributor
Docs](https://github.com/MetaMask/contributor-docs) and [MetaMask Mobile
Coding
Standards](https://github.com/MetaMask/metamask-mobile/blob/main/.github/guidelines/CODING_GUIDELINES.md).
- [X] I've completed the PR template to the best of my ability
- [X] I've included tests if applicable
- [X] I've documented my code using [JSDoc](https://jsdoc.app/) format
if applicable
- [X] I've applied the right labels on the PR (see [labeling
guidelines](https://github.com/MetaMask/metamask-mobile/blob/main/.github/guidelines/LABELING_GUIDELINES.md)).
Not required for external contributors.

#### Performance checks (if applicable)

- [ ] I've tested on Android
  - Ideally on a mid-range device; emulator is acceptable
- [ ] I've tested with a power user scenario
- Use these [power-user
SRPs](https://consensyssoftware.atlassian.net/wiki/spaces/TL1/pages/edit-v2/401401446401?draftShareId=9d77e1e1-4bdc-4be1-9ebb-ccd916988d93)
to import wallets with many accounts and tokens
- [ ] I've instrumented key operations with Sentry traces for production
performance metrics
- See [`trace()`](/app/util/trace.ts) for usage and
[`addToken`](/app/components/Views/AddAsset/components/AddCustomToken/AddCustomToken.tsx#L274)
for an example

For performance guidelines and tooling, see the [Performance
Guide](https://consensyssoftware.atlassian.net/wiki/spaces/TL1/pages/400085549067/Performance+Guide+for+Engineers).

## **Pre-merge reviewer checklist**

<!--
Reviewer checklist items follow the same semantics as the author
checklist: an
unchecked box is ambiguous, a checked box means the reviewer consciously
assessed that responsibility. See `docs/readme/ready-for-review.md`.
-->

- [ ] I've manually tested the PR (e.g. pull and build branch, run the
app, test code being changed).
- [ ] I confirm that this PR addresses all acceptance criteria described
in the ticket it closes and includes the necessary testing evidence such
as recordings and or screenshots.

<!-- CURSOR_SUMMARY -->
---

> [!NOTE]
> **Low Risk**
> Small Money UI visibility change with tests; no auth, payments, or
data-layer changes.
> 
> **Overview**
> Money home now **shows APY when the rate is 0%**, not only when it is
strictly positive. **`MoneyBalanceSummary`**, **`MoneyHowItWorks`**, and
**`MoneyWhatYouGet`** switch from `isPositiveNumber` to a new
**`isPositiveNumberOrZero`** guard so the label, info button, and inline
copy render for zero APY while **undefined** and **negative** values
stay hidden.
> 
> Unit tests are updated to expect visible **0% APY** UI and
**`number.test.ts`** covers the new helper.
> 
> <sup>Reviewed by [Cursor Bugbot](https://cursor.com/bugbot) for commit
009b809. Bugbot is set up for automated
code reviews on this repo. Configure
[here](https://www.cursor.com/dashboard/bugbot).</sup>
<!-- /CURSOR_SUMMARY -->

Author: shane-t

app/components/UI/Money/components/MoneyBalanceSummary/MoneyBalanceSummary.test.tsx

@@ -92,16 +92,16 @@ describe('MoneyBalanceSummary', () => {
     ).not.toBeOnTheScreen();
   });
 
-  it('hides the APY text and tooltip button when apy is zero', () => {
+  it('shows the APY text and tooltip button when apy is zero', () => {
     const mockInfoPress = jest.fn();
-    const { queryByTestId } = render(
+    const { getByTestId } = render(
       <MoneyBalanceSummary apy={0} onApyInfoPress={mockInfoPress} />,
     );
 
-    expect(queryByTestId(MoneyBalanceSummaryTestIds.APY)).not.toBeOnTheScreen();
+    expect(getByTestId(MoneyBalanceSummaryTestIds.APY)).toBeOnTheScreen();
     expect(
-      queryByTestId(MoneyBalanceSummaryTestIds.APY_INFO_BUTTON),
-    ).not.toBeOnTheScreen();
+      getByTestId(MoneyBalanceSummaryTestIds.APY_INFO_BUTTON),
+    ).toBeOnTheScreen();
   });
 
   it('hides the APY tooltip button when isLoading is true', () => {

app/components/UI/Money/components/MoneyBalanceSummary/MoneyBalanceSummary.tsx

@@ -15,7 +15,7 @@ import {
 } from '@metamask/design-system-react-native';
 import { strings } from '../../../../../../locales/i18n';
 import { MoneyBalanceSummaryTestIds } from './MoneyBalanceSummary.testIds';
-import { isPositiveNumber } from '../../utils/number';
+import { isPositiveNumberOrZero } from '../../utils/number';
 
 const DEFAULT_BALANCE = '$0.00';
 
@@ -76,7 +76,7 @@ const MoneyBalanceSummary = ({
             testID={MoneyBalanceSummaryTestIds.APY_SKELETON}
           />
         ) : (
-          isPositiveNumber(apy) && (
+          isPositiveNumberOrZero(apy) && (
             <Text
               variant={TextVariant.BodyMd}
               fontWeight={FontWeight.Medium}
@@ -94,7 +94,7 @@ const MoneyBalanceSummary = ({
             </Text>
           )
         )}
-        {onApyInfoPress && isPositiveNumber(apy) && !isLoading && (
+        {onApyInfoPress && isPositiveNumberOrZero(apy) && !isLoading && (
           <ButtonIcon
             iconName={IconName.Info}
             iconProps={{ color: IconColor.IconAlternative }}

app/components/UI/Money/components/MoneyHowItWorks/MoneyHowItWorks.test.tsx

@@ -62,10 +62,10 @@ describe('MoneyHowItWorks', () => {
     expect(queryByTestId(MoneyHowItWorksTestIds.APY)).not.toBeOnTheScreen();
   });
 
-  it('hides the highlighted APY text when apy is zero', () => {
-    const { queryByTestId } = render(<MoneyHowItWorks apy={0} />);
+  it('shows the highlighted APY text when apy is zero', () => {
+    const { getByTestId } = render(<MoneyHowItWorks apy={0} />);
 
-    expect(queryByTestId(MoneyHowItWorksTestIds.APY)).not.toBeOnTheScreen();
+    expect(getByTestId(MoneyHowItWorksTestIds.APY)).toBeOnTheScreen();
   });
 
   it('hides the highlighted APY text when apy is negative', () => {

app/components/UI/Money/components/MoneyHowItWorks/MoneyHowItWorks.tsx

@@ -9,7 +9,7 @@ import {
 import { strings } from '../../../../../../locales/i18n';
 import MoneySectionHeader from '../MoneySectionHeader';
 import { MoneyHowItWorksTestIds } from './MoneyHowItWorks.testIds';
-import { isPositiveNumber } from '../../utils/number';
+import { isPositiveNumberOrZero } from '../../utils/number';
 
 interface MoneyHowItWorksProps {
   /** APY expressed as a percentage (e.g. 3 for 3%). */
@@ -35,7 +35,7 @@ const MoneyHowItWorks = ({
         testID={MoneyHowItWorksTestIds.DESCRIPTION}
       >
         {strings('money.how_it_works.description_prefix')}
-        {!isLoading && isPositiveNumber(apy) && (
+        {!isLoading && isPositiveNumberOrZero(apy) && (
           <Text
             variant={TextVariant.BodyMd}
             fontWeight={FontWeight.Medium}

app/components/UI/Money/components/MoneyWhatYouGet/MoneyWhatYouGet.test.tsx

@@ -75,11 +75,11 @@ describe('MoneyWhatYouGet', () => {
     ).not.toBeOnTheScreen();
   });
 
-  it('hides the inline APY text in the auto-earn benefit when apy is zero', () => {
-    const { queryByText } = render(<MoneyWhatYouGet apy={0} />);
+  it('renders the inline APY text in the auto-earn benefit when apy is zero', () => {
+    const { getByText } = render(<MoneyWhatYouGet apy={0} />);
 
     expect(
-      queryByText(strings('money.apy_label', { percentage: 0 })),
-    ).not.toBeOnTheScreen();
+      getByText(strings('money.apy_label', { percentage: 0 })),
+    ).toBeOnTheScreen();
   });
 });

app/components/UI/Money/components/MoneyWhatYouGet/MoneyWhatYouGet.tsx

@@ -17,7 +17,7 @@ import {
 import { strings } from '../../../../../../locales/i18n';
 import MoneySectionHeader from '../MoneySectionHeader';
 import { MoneyWhatYouGetTestIds } from './MoneyWhatYouGet.testIds';
-import { isPositiveNumber } from '../../utils/number';
+import { isPositiveNumberOrZero } from '../../utils/number';
 
 interface MoneyWhatYouGetProps {
   /** APY expressed as a percentage (e.g. 3 for 3%). */
@@ -53,7 +53,7 @@ const MoneyWhatYouGet = ({ apy, onLearnMorePress }: MoneyWhatYouGetProps) => (
       <BenefitRow>
         <Text variant={TextVariant.BodyMd}>
           {`${strings('money.what_you_get.benefit_auto_earn')} `}
-          {isPositiveNumber(apy) && (
+          {isPositiveNumberOrZero(apy) && (
             <Text variant={TextVariant.BodyMd} color={TextColor.SuccessDefault}>
               {strings('money.apy_label', { percentage: apy })}
             </Text>

app/components/UI/Money/utils/number.test.ts

@@ -1,4 +1,4 @@
-import { isPositiveNumber } from './number';
+import { isPositiveNumber, isPositiveNumberOrZero } from './number';
 
 describe('isPositiveNumber', () => {
   describe('returns true for positive finite numbers', () => {
@@ -52,3 +52,56 @@ describe('isPositiveNumber', () => {
     });
   });
 });
+
+describe('isPositiveNumberOrZero', () => {
+  describe('returns true for positive finite numbers and zero', () => {
+    it.each([
+      ['a positive integer', 1],
+      ['a positive decimal', 0.01],
+      ['zero', 0],
+      ['Number.MAX_SAFE_INTEGER', Number.MAX_SAFE_INTEGER],
+    ])('returns true for %s', (_label, value) => {
+      const result = isPositiveNumberOrZero(value);
+
+      expect(result).toBe(true);
+    });
+  });
+
+  describe('returns false for non-number types', () => {
+    it.each([
+      ['a numeric string', '1'],
+      ['null', null],
+      ['undefined', undefined],
+      ['a boolean', true],
+      ['an array', [1]],
+      ['an object', { value: 1 }],
+    ])('returns false for %s', (_label, value) => {
+      const result = isPositiveNumberOrZero(value);
+
+      expect(result).toBe(false);
+    });
+  });
+
+  describe('returns false for non-finite numbers', () => {
+    it.each([
+      ['Infinity', Infinity],
+      ['-Infinity', -Infinity],
+      ['NaN', NaN],
+    ])('returns false for %s', (_label, value) => {
+      const result = isPositiveNumberOrZero(value);
+
+      expect(result).toBe(false);
+    });
+  });
+
+  describe('returns false for negative numbers', () => {
+    it.each([
+      ['a negative integer', -1],
+      ['a negative decimal', -0.01],
+    ])('returns false for %s', (_label, value) => {
+      const result = isPositiveNumberOrZero(value);
+
+      expect(result).toBe(false);
+    });
+  });
+});

app/components/UI/Money/utils/number.ts

@@ -7,3 +7,13 @@
  */
 export const isPositiveNumber = (value: unknown): value is number =>
   typeof value === 'number' && isFinite(value) && value > 0;
+
+/**
+ * Determines if a value is a positive number or zero.
+ * Used to avoid littering Money components with these repeated checks.
+ *
+ * @param value - The value to check.
+ * @returns True if the value is a positive number or zero, false otherwise.
+ */
+export const isPositiveNumberOrZero = (value: unknown): value is number =>
+  typeof value === 'number' && isFinite(value) && value >= 0;