From 8113333f3e0c26db73135eee6e55cd9558984a82 Mon Sep 17 00:00:00 2001
From: Christopher Cooper <ccooper@brave.com>
Date: Mon, 3 Jun 2019 17:10:13 -0700
Subject: [PATCH] don't show USD conversion in wallet monthly tip

Fixes brave/brave-browser#4503.
---
 src/features/rewards/walletPanel/index.tsx    | 23 +++++++++++--------
 src/features/rewards/walletPanel/style.ts     |  4 ++++
 .../walletSummary/__snapshots__/spec.tsx.snap |  2 +-
 stories/features/rewards/concepts.tsx         |  2 +-
 4 files changed, 19 insertions(+), 12 deletions(-)

diff --git a/src/features/rewards/walletPanel/index.tsx b/src/features/rewards/walletPanel/index.tsx
index 36f72f48d..09a2d777d 100644
--- a/src/features/rewards/walletPanel/index.tsx
+++ b/src/features/rewards/walletPanel/index.tsx
@@ -24,6 +24,7 @@ import {
   StyleToggleTips,
   StyledNoticeWrapper,
   StyledNoticeLink,
+  StyledOptionShown,
   StyledProfileWrapper,
   StyledSelect
 } from './style'
@@ -98,25 +99,27 @@ export default class WalletPanel extends React.PureComponent<Props, {}> {
     return (
       <StyledSelectWrapper>
         <StyledSelect
-          value={monthlyAmount}
+          value={'show'}
           onChange={this.props.onAmountChange}
         >
           {donationAmounts.map((token: Token, index: number) => {
-            const tokenValue = token.tokens.toString()
-            const paddingLength = tokenValue.length < 5
-              ? tokenValue.length === 4 ? 3 : 4
-              : 0
-            const padding = `${String.fromCharCode(160)}`.repeat(paddingLength)
-
             return (
               <option
                 key={`k-${token.tokens}`}
-                value={tokenValue}
+                value={token.tokens}
               >
-                {padding}{token.tokens} {getLocale('bat')} ({token.converted} USD)
+                {token.tokens} {getLocale('bat')} ({token.converted} USD)
               </option>
             )
-          })}
+          }).concat(
+             <StyledOptionShown
+               key={'k-show'}
+               value={'show'}
+               disabled={true}
+             >
+               {monthlyAmount} {getLocale('bat')}
+             </StyledOptionShown>
+          )}
         </StyledSelect>
       </StyledSelectWrapper>
     )
diff --git a/src/features/rewards/walletPanel/style.ts b/src/features/rewards/walletPanel/style.ts
index 269c81c0d..d06684c84 100644
--- a/src/features/rewards/walletPanel/style.ts
+++ b/src/features/rewards/walletPanel/style.ts
@@ -123,3 +123,7 @@ export const StyledSelect = styled<StyleProps, 'select'>('select')`
     outline: 0;
   }
 `
+
+export const StyledOptionShown = styled<{}, 'option'>('option')`
+  display: none;
+`
diff --git a/src/features/rewards/walletSummary/__snapshots__/spec.tsx.snap b/src/features/rewards/walletSummary/__snapshots__/spec.tsx.snap
index c7cd4a1b4..f7b76c64a 100644
--- a/src/features/rewards/walletSummary/__snapshots__/spec.tsx.snap
+++ b/src/features/rewards/walletSummary/__snapshots__/spec.tsx.snap
@@ -185,7 +185,7 @@ exports[`WalletSummary tests basic tests matches the snapshot 1`] = `
     <div
       className="c3"
     >
-      MISSING: monthMay
+      MISSING: monthJun
        
       2019
     </div>
diff --git a/stories/features/rewards/concepts.tsx b/stories/features/rewards/concepts.tsx
index 2a4226947..7cabd6bfc 100644
--- a/stories/features/rewards/concepts.tsx
+++ b/stories/features/rewards/concepts.tsx
@@ -427,7 +427,7 @@ storiesOf('Feature Components/Rewards/Concepts/Desktop', module)
               platform={'youtube'}
               publisherImg={favicon}
               publisherName={'Jonathon Doe'}
-              monthlyAmount={'5.0'}
+              monthlyAmount={text('Monthly contribution', '5.0')}
               acEnabled={true}
               isVerified={boolean('Verified', false)}
               showUnVerified={boolean('Show Unverified', true)}