Revert replacing portfolio button

Author: sophieqgu

ui/components/app/rewards/RewardsPointsBalance.test.tsx

@@ -108,20 +108,15 @@ describe('RewardsPointsBalance', () => {
     expect(container.firstChild).toBeNull();
   });
 
-  it('should render opt-in badge when candidateSubscriptionId is null', () => {
+  it('should render null when candidateSubscriptionId is null', () => {
     mockUseRewardsContext.mockReturnValue({
       ...mockRewardsContextValue,
       seasonStatus: null,
       candidateSubscriptionId: null,
     });
 
-    render(<RewardsPointsBalance />);
-
-    expect(screen.getByTestId('rewards-points-balance')).toBeInTheDocument();
-    expect(
-      screen.getByTestId('rewards-points-balance-value'),
-    ).toHaveTextContent('Opt In');
-    expect(screen.getByAltText('Rewards Points Icon')).toBeInTheDocument();
+    const { container } = render(<RewardsPointsBalance />);
+    expect(container.firstChild).toBeNull();
   });
 
   it('should render skeleton when loading and no balance exists', () => {

ui/components/app/rewards/RewardsPointsBalance.tsx

@@ -50,7 +50,7 @@ export const RewardsPointsBalance = () => {
   }
 
   if (!candidateSubscriptionId) {
-    return <RewardsBadge text={t('rewardsOptIn')} />;
+    return null;
   }
 
   if (seasonStatusLoading && !seasonStatus?.balance) {

ui/components/app/wallet-overview/coin-overview.tsx

@@ -249,20 +249,19 @@ export const CoinOverview = ({
 
   const renderPercentageAndAmountChange = () => {
     const renderPortfolioButton = () => {
-      if (isRewardsEnabled) {
-        return <RewardsPointsBalance />;
-      }
-
       return (
-        <ButtonLink
-          endIconName={IconName.Export}
-          onClick={handlePortfolioOnClick}
-          as="a"
-          data-testid="portfolio-link"
-          textProps={{ variant: TextVariant.bodyMdMedium }}
-        >
-          {t('discover')}
-        </ButtonLink>
+        <>
+          {isRewardsEnabled && <RewardsPointsBalance />}
+          <ButtonLink
+            endIconName={IconName.Export}
+            onClick={handlePortfolioOnClick}
+            as="a"
+            data-testid="portfolio-link"
+            textProps={{ variant: TextVariant.bodyMdMedium }}
+          >
+            {t('discover')}
+          </ButtonLink>
+        </>
       );
     };
 

ui/components/app/wallet-overview/index.scss

@@ -39,6 +39,7 @@
     display: flex;
     flex-direction: row;
     gap: 8px;
+    flex-wrap: wrap;
   }
 }
 
@@ -72,7 +73,6 @@
     min-width: 0;
     position: relative;
     align-items: start;
-    max-width: 326px;
   }
 
   &__primary-container {