Adds different text to grant finish screen

Resolves brave/brave-browser#4814
brave · Jun 12, 2019 · de51433 · de51433
1 parent da47b05
commit de51433
Show file tree

Hide file tree

Showing 9 changed files with 87 additions and 27 deletions.
diff --git a/browser/ui/webui/brave_webui_source.cc b/browser/ui/webui/brave_webui_source.cc
@@ -296,8 +296,6 @@ void CustomizeWebUIHTMLSource(const std::string &name,
         { "braveVerified", IDS_BRAVE_UI_BRAVE_VERIFIED },
         { "cancel", IDS_BRAVE_UI_CANCEL },
         { "captchaDrag", IDS_BRAVE_UI_CAPTCHA_DRAG },
-        { "captchaLuckyDay", IDS_BRAVE_UI_CAPTCHA_LUCKY_DAY },
-        { "captchaOnTheWay", IDS_BRAVE_UI_CAPTCHA_ON_THE_WAY },
         { "captchaProveHuman", IDS_BRAVE_UI_CAPTCHA_PROVE_HUMAN },
         { "captchaTarget", IDS_BRAVE_UI_CAPTCHA_TARGET },
         { "captchaMissedTarget", IDS_BRAVE_UI_CAPTCHA_MISSED_TARGET },
@@ -333,6 +331,12 @@ void CustomizeWebUIHTMLSource(const std::string &name,
         { "for", IDS_BRAVE_UI_FOR },
         { "grantDisclaimer", IDS_BRAVE_UI_GRANT_DISCLAIMER },
         { "grantExpire", IDS_BRAVE_UI_GRANT_EXPIRE },
+        { "grantFinishTextAds", IDS_BRAVE_UI_GRANT_FINISH_TEXT_ADS },
+        { "grantFinishTextUGP", IDS_BRAVE_UI_GRANT_FINISH_TEXT_UGP },
+        { "grantFinishTitleAds", IDS_BRAVE_UI_GRANT_FINISH_TITLE_ADS },
+        { "grantFinishTitleUGP", IDS_BRAVE_UI_GRANT_FINISH_TITLE_UGP },
+        { "grantFinishTokenAds", IDS_BRAVE_UI_GRANT_FINISH_TOKEN_ADS },
+        { "grantFinishTokenUGP", IDS_BRAVE_UI_GRANT_FINISH_TOKEN_UGP },
         { "grants", IDS_BRAVE_UI_GRANTS },
         { "import", IDS_BRAVE_UI_IMPORT },
         { "includeInAuto", IDS_BRAVE_UI_INCLUDE_IN_AUTO },

diff --git a/components/brave_rewards/resources/extension/brave_rewards/_locales/en_US/messages.json b/components/brave_rewards/resources/extension/brave_rewards/_locales/en_US/messages.json
@@ -237,14 +237,6 @@
     "message": "Drag the BAT Icon on to the",
     "description": "Directs the user to drag the BAT icon"
   },
-  "captchaLuckyDay": {
-    "message": "It’s your lucky day!",
-    "description": "Cosmetic text upon captcha success"
-  },
-  "captchaOnTheWay": {
-    "message": "Your token grant is on its way.",
-    "description": "Cosmetic text indicating grant funds are on the way"
-  },
   "captchaProveHuman": {
     "message": "Prove that you are human!",
     "description": "Cosmetic text for captcha prompt"
@@ -438,5 +430,29 @@
   "pendingContributionTitle": {
     "message": "Pending Contribution",
     "description": "Notification title for pending contribution type"
+  },
+  "grantFinishTitleUGP": {
+    "message": "It’s your lucky day!",
+    "description": "Cosmetic text upon captcha success"
+  },
+  "grantFinishTextUGP": {
+    "message": "Your token grant is on its way.",
+    "description": "Cosmetic text indicating grant funds are on the way"
+  },
+  "grantFinishTokenTitleUGP": {
+    "message": "Free Token Grant",
+    "description": "Token title on success screen"
+  },
+  "grantFinishTitleAds": {
+    "message": "Brave Ads Rewards!",
+    "description": "Cosmetic text upon captcha success for ads"
+  },
+  "grantFinishTextAds": {
+    "message": "Your rewards grant from Brave Ads is on its way",
+    "description": "Cosmetic text indicating ads funds are on the way"
+  },
+  "grantFinishTokenTitleAds": {
+    "message": "Your Brave Ads Token Grant",
+    "description": "Token title on success screen for ads"
   }
 }
diff --git a/components/brave_rewards/resources/extension/brave_rewards/background/api/locale_api.ts b/components/brave_rewards/resources/extension/brave_rewards/background/api/locale_api.ts
@@ -36,8 +36,6 @@ export const getUIMessages = (): Record<string, string> => {
     'braveRewardsCreatingText',
     'braveRewardsSubTitle',
     'captchaDrag',
-    'captchaLuckyDay',
-    'captchaOnTheWay',
     'captchaProveHuman',
     'captchaTarget',
     'captchaMissedTarget',

diff --git a/components/brave_rewards/resources/extension/brave_rewards/utils.ts b/components/brave_rewards/resources/extension/brave_rewards/utils.ts
@@ -3,6 +3,7 @@
  * You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 import BigNumber from 'bignumber.js'
+import { getMessage } from './background/api/locale_api'
 
 export const convertBalance = (tokens: string, rates: Record<string, number> | undefined, currency: string = 'USD'): string => {
   const tokensNum = parseFloat(tokens)
@@ -48,8 +49,19 @@ export const getGrants = (grants?: RewardsExtension.Grant[]) => {
 }
 
 export const getGrant = (grant?: RewardsExtension.GrantInfo) => {
-  if (grant && grant.type === 'ads') {
+  if (!grant) {
+    return grant
+  }
+
+  grant.finishTitle = getMessage('grantFinishTitleUGP')
+  grant.finishText = getMessage('grantFinishTextUGP')
+  grant.finishTokenTitle = getMessage('grantFinishTokenTitleUGP')
+
+  if (grant.type === 'ads') {
     grant.expiryTime = 0
+    grant.finishText = getMessage('grantFinishTextAds')
+    grant.finishTitle = getMessage('grantFinishTitleAds')
+    grant.finishTokenTitle = getMessage('grantFinishTokenTitleAds')
   }
 
   return grant

diff --git a/components/brave_rewards/resources/ui/components/grant.tsx b/components/brave_rewards/resources/ui/components/grant.tsx
@@ -135,14 +135,43 @@ class Grant extends React.Component<Props, State> {
     )
   }
 
+  grantFinish = (type: string, tokens: string, date: string) => {
+    let title = getLocale('grantFinishTitleUGP')
+    let text = getLocale('grantFinishTextUGP')
+    let tokenTitle = getLocale('grantFinishTokenUGP')
+
+    if (type === 'ads') {
+      title = getLocale('grantFinishTitleAds')
+      text = getLocale('grantFinishTextAds')
+      tokenTitle = getLocale('grantFinishTokenAds')
+    }
+
+    return (
+      <GrantWrapper
+        data-test-id={'grantWrapper'}
+        onClose={this.onFinish}
+        title={title}
+        text={text}
+      >
+        <GrantComplete
+          onClose={this.onFinish}
+          amount={tokens}
+          date={date}
+          testId={'newTokenGrant'}
+          tokenTitle={tokenTitle}
+        />
+      </GrantWrapper>
+    )
+  }
+
   render () {
     const { grant } = this.props
 
     if (!grant) {
       return null
     }
 
-    let type
+    let type = 'ugp'
     let promoId
     let tokens = '0.0'
     let date = ''
@@ -175,14 +204,7 @@ class Grant extends React.Component<Props, State> {
         }
         {
           grant.expiryTime
-            ? <GrantWrapper
-              data-test-id={'grantWrapper'}
-              onClose={this.onFinish}
-              title={'It’s your lucky day!'}
-              text={'Your token grant is on its way.'}
-            >
-              <GrantComplete onClose={this.onFinish} amount={tokens} date={date} testId={'newTokenGrant'} />
-            </GrantWrapper>
+            ? this.grantFinish(type, tokens, date)
             : null
         }
       </>

diff --git a/components/definitions/rewardsExtensions.d.ts b/components/definitions/rewardsExtensions.d.ts
@@ -58,6 +58,9 @@ declare namespace RewardsExtension {
     hint?: string
     status?: GrantStatus
     type?: string
+    finishTitle?: string
+    finishText?: string
+    finishTokenTitle?: string
   }
 
   export interface GrantResponse {

diff --git a/components/resources/brave_components_strings.grd b/components/resources/brave_components_strings.grd
@@ -329,8 +329,6 @@
       <message name="IDS_BRAVE_UI_BRAVE_VERIFIED" desc="">Brave Verified Publishers</message>
       <message name="IDS_BRAVE_UI_CANCEL" desc="">Cancel</message>
       <message name="IDS_BRAVE_UI_CAPTCHA_DRAG" desc="">Drag the BAT Icon on to the</message>
-      <message name="IDS_BRAVE_UI_CAPTCHA_LUCKY_DAY" desc="">It’s your lucky day!</message>
-      <message name="IDS_BRAVE_UI_CAPTCHA_ON_THE_WAY" desc="">Your token grant is on its way.</message>
       <message name="IDS_BRAVE_UI_CAPTCHA_PROVE_HUMAN" desc="">Prove that you are human!</message>
       <message name="IDS_BRAVE_UI_CAPTCHA_TARGET" desc="">target.</message>
       <message name="IDS_BRAVE_UI_CAPTCHA_MISSED_TARGET" desc="">Hmm… Not Quite. Try Again.</message>
@@ -524,6 +522,13 @@
       <message name="IDS_BRAVE_UI_SHOW_ALL" desc="">Show All</message>
       <message name="IDS_BRAVE_UI_SUPPORTED_SITES" desc="">Supported Sites</message>
 
+      <message name="IDS_BRAVE_UI_GRANT_FINISH_TOKEN_ADS" desc="Token text on final grant screen for UGP">Your Brave Ads Token Grant</message>
+      <message name="IDS_BRAVE_UI_GRANT_FINISH_TEXT_ADS" desc="Text on final grant screen for UGP">Your rewards grant from Brave Ads is on its way</message>
+      <message name="IDS_BRAVE_UI_GRANT_FINISH_TITLE_ADS" desc="Title on final grant screen for Ads">Brave Ads Rewards!</message>
+      <message name="IDS_BRAVE_UI_GRANT_FINISH_TOKEN_UGP" desc="Token text on final grant screen for UGP">Free Token Grant</message>
+      <message name="IDS_BRAVE_UI_GRANT_FINISH_TEXT_UGP" desc="Text on final grant screen for UGP">Your token grant is on its way.</message>
+      <message name="IDS_BRAVE_UI_GRANT_FINISH_TITLE_UGP" desc="Title on final grant screen for UGP">It’s your lucky day!</message>
+
       <!-- WebUI brave sync resources -->
       <!-- WebUI brave sync resources: Shared Content -->
       <message name="IDS_BRAVE_SYNC_SHARED_DONE_BUTTON" desc="The Sync `done` button which closes a modal">Done</message>

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -277,7 +277,7 @@
     "@types/react-redux": "6.0.4",
     "@types/redux-logger": "^3.0.7",
     "awesome-typescript-loader": "^5.2.1",
-    "brave-ui": "github:brave/brave-ui#9555623b81f77e6685f23a1556d0283fe6b0b58a",
+    "brave-ui": "github:brave/brave-ui#86fc4b015c64255ad5295ddbd71e2613d5687549",
     "css-loader": "^2.1.1",
     "csstype": "^2.5.5",
     "deep-freeze-node": "^1.1.3",