From 1a256611da6be07bbdf74ed6a5af6c1a672e0abc Mon Sep 17 00:00:00 2001 From: ryanml Date: Sun, 3 Nov 2019 23:07:36 -0700 Subject: [PATCH] Adding state for unsupported ads regions to ntp rewards widget Fixes brave/brave-browser#6759 --- browser/extensions/api/brave_rewards_api.cc | 19 +++++++++++ browser/extensions/api/brave_rewards_api.h | 10 ++++++ browser/ui/webui/brave_webui_source.cc | 1 + common/extensions/api/brave_rewards.json | 17 ++++++++++ .../brave_new_tab_ui/api/initialData.ts | 6 ++++ .../components/default/rewards/index.tsx | 34 ++++++++++++------- .../components/default/rewards/style.ts | 21 +++++++++--- .../reducers/new_tab_reducer.tsx | 1 + components/brave_new_tab_ui/storage.ts | 1 + components/definitions/chromel.d.ts | 1 + components/definitions/newTab.d.ts | 1 + 11 files changed, 96 insertions(+), 16 deletions(-) diff --git a/browser/extensions/api/brave_rewards_api.cc b/browser/extensions/api/brave_rewards_api.cc index 7b946da4e0c7..32d807f8485e 100644 --- a/browser/extensions/api/brave_rewards_api.cc +++ b/browser/extensions/api/brave_rewards_api.cc @@ -1084,5 +1084,24 @@ void BraveRewardsGetWalletExistsFunction::OnGetWalletExists( Respond(OneArgument(std::make_unique(exists))); } +BraveRewardsGetAdsSupportedFunction:: +~BraveRewardsGetAdsSupportedFunction() { +} + +ExtensionFunction::ResponseAction +BraveRewardsGetAdsSupportedFunction::Run() { + Profile* profile = Profile::FromBrowserContext(browser_context()); + AdsService* ads_service_ = + AdsServiceFactory::GetForProfile(profile); + + if (!ads_service_) { + return RespondNow(Error("Ads service is not initialized")); + } + + const bool supported = ads_service_->IsSupportedLocale(); + return RespondNow( + OneArgument(std::make_unique(supported))); +} + } // namespace api } // namespace extensions diff --git a/browser/extensions/api/brave_rewards_api.h b/browser/extensions/api/brave_rewards_api.h index 783d6f9d67b9..cc9baced4c86 100644 --- a/browser/extensions/api/brave_rewards_api.h +++ b/browser/extensions/api/brave_rewards_api.h @@ -430,6 +430,16 @@ class BraveRewardsGetWalletExistsFunction void OnGetWalletExists(const bool exists); }; +class BraveRewardsGetAdsSupportedFunction : public ExtensionFunction { + public: + DECLARE_EXTENSION_FUNCTION("braveRewards.getAdsSupported", UNKNOWN) + + protected: + ~BraveRewardsGetAdsSupportedFunction() override; + + ResponseAction Run() override; +}; + } // namespace api } // namespace extensions diff --git a/browser/ui/webui/brave_webui_source.cc b/browser/ui/webui/brave_webui_source.cc index 86514200af63..ef7470fab797 100644 --- a/browser/ui/webui/brave_webui_source.cc +++ b/browser/ui/webui/brave_webui_source.cc @@ -212,6 +212,7 @@ void CustomizeWebUIHTMLSource(const std::string &name, { "rewardsWidgetEnableTitle", IDS_REWARDS_WIDGET_ENABLE_TITLE }, { "rewardsWidgetReEnableSubTitle", IDS_REWARDS_WIDGET_REENABLE_SUBTITLE }, // NOLINT { "rewardsWidgetEnableSubTitle", IDS_REWARDS_WIDGET_ENABLE_SUBTITLE }, // NOLINT + { "rewardsWidgetAdsNotSupported", IDS_BRAVE_REWARDS_LOCAL_ADS_NOT_SUPPORTED }, // NOLINT { "rewardsWidgetNotificationTitle", IDS_REWARDS_WIDGET_NOTIFICATION_TITLE }, // NOLINT { "rewardsWidgetNotificationTextAds", IDS_REWARDS_WIDGET_NOTIFICATION_TEXT_ADS }, // NOLINT { "rewardsWidgetNotificationTextUGP", IDS_REWARDS_WIDGET_NOTIFICATION_TEXT_UGP } // NOLINT diff --git a/common/extensions/api/brave_rewards.json b/common/extensions/api/brave_rewards.json index 1df69a288cb6..46bb97d86d25 100644 --- a/common/extensions/api/brave_rewards.json +++ b/common/extensions/api/brave_rewards.json @@ -656,6 +656,23 @@ } ] }, + { + "name": "getAdsSupported", + "type": "function", + "description": "Gets whether ads is supported in the user's region", + "parameters": [ + { + "type": "function", + "name": "callback", + "parameters": [ + { + "name": "supported", + "type": "boolean" + } + ] + } + ] + }, { "name": "getAdsEstimatedEarnings", "type": "function", diff --git a/components/brave_new_tab_ui/api/initialData.ts b/components/brave_new_tab_ui/api/initialData.ts index a412fa63218f..fcd5276ba774 100644 --- a/components/brave_new_tab_ui/api/initialData.ts +++ b/components/brave_new_tab_ui/api/initialData.ts @@ -17,6 +17,7 @@ export type InitialData = { export type PreInitialRewardsData = { enabledAds: boolean + adsSupported: boolean enabledMain: boolean } @@ -54,17 +55,22 @@ export async function getRewardsPreInitialData (): Promise chrome.braveRewards.getAdsEnabled((enabledAds: boolean) => { resolve(enabledAds) })), + new Promise(resolve => chrome.braveRewards.getAdsSupported((adsSupported: boolean) => { + resolve(adsSupported) + })), new Promise(resolve => chrome.braveRewards.getRewardsMainEnabled((enabledMain: boolean) => { resolve(enabledMain) })) ]) return { enabledAds, + adsSupported, enabledMain } as PreInitialRewardsData } catch (err) { diff --git a/components/brave_new_tab_ui/components/default/rewards/index.tsx b/components/brave_new_tab_ui/components/default/rewards/index.tsx index f86a07ad44e5..87fb596cb22d 100644 --- a/components/brave_new_tab_ui/components/default/rewards/index.tsx +++ b/components/brave_new_tab_ui/components/default/rewards/index.tsx @@ -26,7 +26,8 @@ import { Amount, ConvertedAmount, LearnMoreLink, - TurnOnAdsButton + TurnOnAdsButton, + UnsupportedMessage } from './style' import Notification from './notification' import { BatColorIcon } from 'brave-ui/components/icons' @@ -43,6 +44,7 @@ export interface RewardsProps { walletCorrupted: boolean adsEstimatedEarnings: number onlyAnonWallet?: boolean + adsSupported?: boolean onCreateWallet: () => void onEnableAds: () => void onEnableRewards: () => void @@ -135,11 +137,12 @@ class Rewards extends React.PureComponent { onEnableAds, adsEstimatedEarnings, onlyAnonWallet, - totalContribution + totalContribution, + adsSupported } = this.props const rates = balance.rates || {} - const showEnableAds = type === AmountItemType.ADS && !enabledAds + const showEnableAds = type === AmountItemType.ADS && !enabledAds && adsSupported const amount = type === AmountItemType.TIPS ? totalContribution : adsEstimatedEarnings.toFixed(1) @@ -147,7 +150,14 @@ class Rewards extends React.PureComponent { const batFormatString = onlyAnonWallet ? getLocale('rewardsWidgetBatPoints') : getLocale('rewardsWidgetBat') return ( - + + + { + type === AmountItemType.ADS + ? getLocale('rewardsWidgetEstimatedEarnings') + : getLocale('rewardsWidgetMonthlyTips') + } + { showEnableAds ? @@ -156,7 +166,7 @@ class Rewards extends React.PureComponent { : null } { - !showEnableAds + !showEnableAds && !(type === AmountItemType.ADS && !adsSupported) ? {amount} @@ -165,13 +175,13 @@ class Rewards extends React.PureComponent { : null } - - { - type === AmountItemType.ADS - ? getLocale('rewardsWidgetEstimatedEarnings') - : getLocale('rewardsWidgetMonthlyTips') - } - + { + type === AmountItemType.ADS && !adsSupported + ? + {getLocale('rewardsWidgetAdsNotSupported')} + + : null + } ) } diff --git a/components/brave_new_tab_ui/components/default/rewards/style.ts b/components/brave_new_tab_ui/components/default/rewards/style.ts index ced07e744950..0e99fc44562d 100644 --- a/components/brave_new_tab_ui/components/default/rewards/style.ts +++ b/components/brave_new_tab_ui/components/default/rewards/style.ts @@ -5,6 +5,10 @@ import styled from 'styled-components' import palette from 'brave-ui/theme/colors' +interface StyleProps { + isLast?: boolean +} + export const WidgetWrapper = styled<{}, 'div'>('div')` color: white; padding: 10px 15px; @@ -93,16 +97,17 @@ export const TurnOnButton = styled<{}, 'button'>('button')` export const TurnOnAdsButton = styled(TurnOnButton)` width: 100%; - margin-bottom: 5px; + margin-top: 8px; display: block; ` -export const AmountItem = styled<{}, 'div'>('div')` - margin-top: 10px; +export const AmountItem = styled('div')` + margin-top: ${p => p.isLast ? 20 : 10}px; + margin-bottom: ${p => p.isLast ? -10 : 0}px; ` export const AmountInformation = styled<{}, 'div'>('div')` - margin-bottom: 5px; + margin-top: 5px; ` export const Amount = styled<{}, 'span'>('span')` @@ -118,6 +123,7 @@ export const ConvertedAmount = styled<{}, 'span'>('span')` export const AmountDescription = styled<{}, 'span'>('span')` font-size: 14px; color: #fff; + margin-bottom: 5px; ` export const NotificationWrapper = styled(WidgetWrapper)` @@ -151,3 +157,10 @@ export const CloseIcon = styled<{}, 'div'>('div')` float: right; cursor: pointer; ` + +export const UnsupportedMessage = styled<{}, 'div'>('div')` + color: rgba(255, 255, 255, 0.70); + font-size: 14px; + max-width: 235px; + margin-top: 8px; +` diff --git a/components/brave_new_tab_ui/reducers/new_tab_reducer.tsx b/components/brave_new_tab_ui/reducers/new_tab_reducer.tsx index c4802ec965f2..59781e869506 100644 --- a/components/brave_new_tab_ui/reducers/new_tab_reducer.tsx +++ b/components/brave_new_tab_ui/reducers/new_tab_reducer.tsx @@ -377,6 +377,7 @@ export const newTabReducer: Reducer = (state: NewTab.S rewardsState: { ...state.rewardsState, enabledAds: preInitialRewardsDataPayload.enabledAds, + adsSupported: preInitialRewardsDataPayload.adsSupported, enabledMain: preInitialRewardsDataPayload.enabledMain } } diff --git a/components/brave_new_tab_ui/storage.ts b/components/brave_new_tab_ui/storage.ts index c24a8002d5a1..70227219583c 100644 --- a/components/brave_new_tab_ui/storage.ts +++ b/components/brave_new_tab_ui/storage.ts @@ -40,6 +40,7 @@ const defaultState: NewTab.State = { }, dismissedNotifications: [], enabledAds: false, + adsSupported: false, enabledMain: false, grants: [], onlyAnonWallet: false, diff --git a/components/definitions/chromel.d.ts b/components/definitions/chromel.d.ts index 1013f54f8f20..dd0a1cb06e08 100644 --- a/components/definitions/chromel.d.ts +++ b/components/definitions/chromel.d.ts @@ -101,6 +101,7 @@ declare namespace chrome.braveRewards { addListener: (callback: (enabledMain: boolean) => void) => void } const getAdsEnabled: (callback: (enabled: boolean) => void) => {} + const getAdsSupported: (callback: (supported: boolean) => void) => {} const getBalanceReports: (callback: (reports: Record) => void) => {} const getAdsEstimatedEarnings: (callback: (amount: number) => void) => {} const getRewardsMainEnabled: (callback: (enabled: boolean) => void) => {} diff --git a/components/definitions/newTab.d.ts b/components/definitions/newTab.d.ts index 3380caea75e3..be2410cb47b8 100644 --- a/components/definitions/newTab.d.ts +++ b/components/definitions/newTab.d.ts @@ -69,6 +69,7 @@ declare namespace NewTab { export interface RewardsWidgetState { adsEstimatedEarnings: number + adsSupported?: boolean balance: RewardsBalance dismissedNotifications: string[] enabledAds: boolean