Uplift of #6217 (squashed) to beta

brave · Jul 27, 2020 · 53f3cf6 · 53f3cf6
1 parent d397f6d
commit 53f3cf6
Show file tree

Hide file tree

Showing 7 changed files with 48 additions and 32 deletions.
diff --git a/components/brave_rewards/resources/extension/brave_rewards/components/app.tsx b/components/brave_rewards/resources/extension/brave_rewards/components/app.tsx
@@ -278,14 +278,16 @@ export class RewardsPanel extends React.Component<Props, State> {
       actions.push({
         name: getMessage('addFunds'),
         action: this.openRewardsAddFunds,
-        icon: <WalletAddIcon />
+        icon: <WalletAddIcon />,
+        externalWallet: true
       })
     }
 
     return actions.concat([{
       name:  getMessage('rewardsSettings'),
       action: this.openRewards,
-      icon: <BatColorIcon />
+      icon: <BatColorIcon />,
+      externalWallet: false
     }])
   }
 

diff --git a/components/brave_rewards/resources/extension/brave_rewards/components/panel.tsx b/components/brave_rewards/resources/extension/brave_rewards/components/panel.tsx
@@ -649,14 +649,16 @@ export class Panel extends React.Component<Props, State> {
       actions.push({
         name: getMessage('addFunds'),
         action: this.onAddFunds,
-        icon: <WalletAddIcon />
+        icon: <WalletAddIcon />,
+        externalWallet: true
       })
     }
 
     return actions.concat([{
       name:  getMessage('rewardsSettings'),
       action: this.openRewardsPage,
-      icon: <BatColorIcon />
+      icon: <BatColorIcon />,
+      externalWallet: false
     }])
   }
 

diff --git a/components/brave_rewards/resources/page/components/pageWallet.tsx b/components/brave_rewards/resources/page/components/pageWallet.tsx
@@ -486,13 +486,15 @@ class PageWallet extends React.Component<Props, State> {
         name: getLocale('panelAddFunds'),
         action: this.onFundsAction.bind(this, 'add'),
         icon: <WalletAddIcon />,
-        testId: 'panel-add-funds'
+        testId: 'panel-add-funds',
+        externalWallet: true
       },
       {
         name: getLocale('panelWithdrawFunds'),
         action: this.onFundsAction.bind(this, 'withdraw'),
         icon: <WalletWithdrawIcon />,
-        testId: 'panel-withdraw-funds'
+        testId: 'panel-withdraw-funds',
+        externalWallet: true
       }
     ]
   }

diff --git a/components/brave_rewards/resources/ui/components/walletWrapper/index.tsx b/components/brave_rewards/resources/ui/components/walletWrapper/index.tsx
@@ -97,6 +97,7 @@ export interface ActionWallet {
   name: string
   action: () => void
   testId?: string
+  externalWallet: boolean
 }
 
 export type NotificationType =
@@ -175,17 +176,33 @@ export default class WalletWrapper extends React.PureComponent<Props, State> {
     }
   }
 
-  generateActions (actions: { icon: React.ReactNode, name: string, testId?: string, action: () => void }[], id?: string) {
+  generateActions (actions: ActionWallet[], id?: string) {
     return actions && actions.map((action, i: number) => {
+      let clickAction = action.externalWallet ? this.onActionClick.bind(this, action.action) : action.action
       return (
-        <StyledAction key={`${id}-${i}`} onClick={action.action} data-test-id={action.testId}>
+        <StyledAction key={`${id}-${i}`} onClick={clickAction} data-test-id={action.testId}>
           <StyledActionIcon>{action.icon}</StyledActionIcon>
           <StyledActionText>{action.name}</StyledActionText>
         </StyledAction>
       )
     })
   }
 
+  onActionClick = (action: () => void) => {
+    if (!action) {
+      return
+    }
+
+    if (!this.props.showLoginMessage) {
+      action()
+      return
+    }
+
+    this.setState({
+      showLoginMessage: true
+    })
+  }
+
   onNotificationClick = () => {
     if (this.props.onNotificationClick) {
       this.props.onNotificationClick()
@@ -323,27 +340,12 @@ export default class WalletWrapper extends React.PureComponent<Props, State> {
     )
   }
 
-  walletButtonClicked = () => {
-    if (!this.props.onVerifyClick) {
-      return
-    }
-
-    if (!this.props.showLoginMessage) {
-      this.props.onVerifyClick()
-      return
-    }
-
-    this.setState({
-      showLoginMessage: true
-    })
-  }
-
   generateWalletButton = (walletState: WalletState) => {
     const buttonProps: Partial<ButtonProps> = {
       size: 'small',
       level: 'primary',
       brand: 'rewards',
-      onClick: this.walletButtonClicked
+      onClick: this.onActionClick.bind(this, this.props.onVerifyClick)
     }
 
     switch (walletState) {

diff --git a/components/brave_rewards/resources/ui/stories/concepts.tsx b/components/brave_rewards/resources/ui/stories/concepts.tsx
@@ -315,12 +315,14 @@ storiesOf('Rewards/Concepts/Desktop', module)
             {
               name: 'Add funds',
               action: doNothing,
-              icon: <WalletAddIcon />
+              icon: <WalletAddIcon />,
+              externalWallet: true
             },
             {
               name: 'Settings',
               action: doNothing,
-              icon: <BatColorIcon />
+              icon: <BatColorIcon />,
+              externalWallet: false
             }
           ]}
           showSecActions={false}
@@ -451,12 +453,14 @@ storiesOf('Rewards/Concepts/Desktop', module)
             {
               name: 'Add funds',
               action: doNothing,
-              icon: <WalletAddIcon />
+              icon: <WalletAddIcon />,
+              externalWallet: true
             },
             {
               name: 'Settings',
               action: doNothing,
-              icon: <BatColorIcon />
+              icon: <BatColorIcon />,
+              externalWallet: false
             }
           ]}
           showCopy={boolean('Show Uphold', false)}

diff --git a/components/brave_rewards/resources/ui/stories/settings/pageWallet.tsx b/components/brave_rewards/resources/ui/stories/settings/pageWallet.tsx
@@ -231,12 +231,14 @@ class PageWallet extends React.Component<Props, State> {
               name: 'Add funds',
               action: doNothing,
               icon: <WalletAddIcon />,
-              testId: 'panel-add-funds'
+              testId: 'panel-add-funds',
+              externalWallet: true
             },
             {
               name: 'Withdraw Funds',
               action: doNothing,
-              icon: <WalletWithdrawIcon />
+              icon: <WalletWithdrawIcon />,
+              externalWallet: true
             }
           ]}
           compact={false}

diff --git a/components/brave_rewards/resources/ui/stories/wallet.tsx b/components/brave_rewards/resources/ui/stories/wallet.tsx
@@ -62,12 +62,14 @@ storiesOf('Rewards/Wallet/Desktop', module)
           {
             name: 'Add funds',
             action: doNothing,
-            icon: <WalletAddIcon />
+            icon: <WalletAddIcon />,
+            externalWallet: true
           },
           {
             name: 'Withdraw Funds',
             action: doNothing,
-            icon: <WalletImportIcon />
+            icon: <WalletImportIcon />,
+            externalWallet: true
           }
         ]}
         grants={showGrant ? [