From 15e570cbe35d4ebd222ce1a93990acfa5ca776e6 Mon Sep 17 00:00:00 2001 From: NejcZdovc Date: Thu, 9 Nov 2017 12:27:10 +0100 Subject: [PATCH] Adds UGP support Resolves #11100 Auditors: Test Plan: --- .../locales/en-US/preferences.properties | 7 +- .../preferences/payment/disabledContent.js | 84 ++++++++++++++----- .../preferences/payment/enabledContent.js | 29 ++++++- less/about/preferences.less | 27 ++++++ 4 files changed, 120 insertions(+), 27 deletions(-) diff --git a/app/extensions/brave/locales/en-US/preferences.properties b/app/extensions/brave/locales/en-US/preferences.properties index d651df23a69..216606bd5f1 100644 --- a/app/extensions/brave/locales/en-US/preferences.properties +++ b/app/extensions/brave/locales/en-US/preferences.properties @@ -70,6 +70,7 @@ builtInPasswordManager=Brave Built-In cachedImagesAndFiles=Cached images and files cancel=Cancel checkDefaultOnStartup=Always check on startup +claimButton=Claim my free tokens clearAll=Clear all clearBrowsingDataNow=Clear Browsing Data Now… comingSoon=Coming soon! @@ -227,14 +228,14 @@ paymentsSidebarText1=Our Partners paymentsSidebarText2=All transaction IP addresses are anonymized with technology from: paymentsSidebarText3=Brave BAT Wallets are provided through a partnership with: paymentsWelcomeLink=View the FAQ -paymentsWelcomeText1=Brave has created a simple way for you to contribute to the sites you use most. -paymentsWelcomeText2=To begin using Brave Payments, simply flip the switch at the top of this window. The rest is easy. +paymentsWelcomeText1=To start using Brave Payments, simply flip the switch at the top of this window. +paymentsWelcomeText2=The rest is easy. paymentsWelcomeText3=Brave Payments allows publishers to stay in business even though you may have blocked their advertisements with Brave. All of this works while keeping your browsing history private. Your funds are transferred to the site owner through an anonymous ledger system, which makes it impossible for you ever to be identified based on the sites you visit and support. paymentsWelcomeText4=Brave Payments is currently in Beta. With your help and feedback, we can fine tune the system through the beta period. paymentsWelcomeText5=Note: Brave Payments uses a country-lookup service in order to provide better user wallet funding options based on your location. This service is completely anonymous. paymentsWelcomeText6=Need more info? paymentsWelcomeText7=for Brave Payments… -paymentsWelcomeTitle=Welcome to Brave Payments! +paymentsWelcomeTitle=Brave has created a simple way for you to contribute to the sites that you use most. pendingFundsStatus=Pending funds: {{funds}}. Newly-added funds may take 30+ minutes to appear. percentage=% percentPaid=Percentage diff --git a/app/renderer/components/preferences/payment/disabledContent.js b/app/renderer/components/preferences/payment/disabledContent.js index 9a041d5917a..138898aa25f 100644 --- a/app/renderer/components/preferences/payment/disabledContent.js +++ b/app/renderer/components/preferences/payment/disabledContent.js @@ -5,9 +5,12 @@ const React = require('react') const {StyleSheet, css} = require('aphrodite/no-important') -// components +// Components const ImmutableComponent = require('../../immutableComponent') +// Utils +const cx = require('../../../../../js/lib/classSet') + // style const globalStyles = require('../../styles/global') const commonStyles = require('../../styles/commonStyles') @@ -17,19 +20,46 @@ const uphold = require('../../../../extensions/brave/img/ledger/uphold_logo_smal const uphold2 = require('../../../../extensions/brave/img/ledger/uphold_logo_medium.png') class DisabledContent extends ImmutableComponent { + constructor (props) { + super(props) + this.text = this.getAlternativeText() + this.getText() + } + + getAlternativeText () { + // TODO we need alternative text + return
+

+

+

+

+ } + + getText () { + // TODO we need to get text from ledger, which wil be delayed because of the server call + // should we save this text into the state and just fetch it with mergeProps? + // TODO what will display while waiting for server text? alternative and then replace it after we get feedback from the server? + return
Ledger code
+ } + render () { return
-
-

-
-
-
-
-
-
-   -   - +
+
+ {this.text} +
+
+
+
@@ -51,14 +81,25 @@ const styles = StyleSheet.create({ marginTop: globalStyles.spacing.panelMargin }, + disabledContent__commonText: { + padding: '0.5em 0' + }, + + disabledContent__commonText_bold: { + fontWeight: 'bold' + }, + + disabledContent__wrapper: { + fontSize: globalStyles.payments.fontSize.regular, + color: globalStyles.color.mediumGray + }, + disabledContent__message: { backgroundColor: globalStyles.color.lightGray, borderRadius: globalStyles.radius.borderRadiusUIbox, boxSizing: 'border-box', padding: '40px', - fontSize: globalStyles.payments.fontSize.regular, - lineHeight: '1.8em', - color: globalStyles.color.mediumGray + lineHeight: '1.8em' }, disabledContent__message__header: { @@ -66,14 +107,6 @@ const styles = StyleSheet.create({ paddingBottom: '0.5em' }, - disabledContent__message__text: { - padding: '0.5em 0' - }, - - disabledContent__message__text_bold: { - fontWeight: 'bold' - }, - disabledContent__sidebar: { minWidth: '200px', marginLeft: '35px' @@ -106,6 +139,11 @@ const styles = StyleSheet.create({ backgroundSize: 'contain', backgroundRepeat: 'no-repeat', height: '50px' + }, + + disabledContent__footer: { + lineHeight: '1.2em', + padding: '40px' } }) diff --git a/app/renderer/components/preferences/payment/enabledContent.js b/app/renderer/components/preferences/payment/enabledContent.js index 1626122ece7..975ac0feb56 100644 --- a/app/renderer/components/preferences/payment/enabledContent.js +++ b/app/renderer/components/preferences/payment/enabledContent.js @@ -61,6 +61,27 @@ class EnabledContent extends ImmutableComponent {
} + onClaimClick () { + // TODO call appAction for claim + } + + claimButton () { + // TODO check if user is eligible for claim and promotion is active + + return
+ +
+ } + ledgerDataErrorText () { const ledgerData = this.props.ledgerData const ledgerError = ledgerData.get('error') @@ -189,7 +210,9 @@ class EnabledContent extends ImmutableComponent {
-
+
+ {this.claimButton()} +