Skip to content

Commit f703410

Browse files
aserenaseren
committed
Update brave talk opt-in form texts/links.
fix brave/brave-browser#16964
1 parent e37db43 commit f703410

File tree

6 files changed

+84
-15
lines changed

6 files changed

+84
-15
lines changed

‎components/brave_rewards/resources/extension/brave_rewards/_locales/en_US/messages.json

+26
Original file line numberDiff line numberDiff line change
@@ -853,6 +853,24 @@
853853
"message": "Turn on Rewards",
854854
"description": ""
855855
},
856+
"braveTalkOptInTerms": {
857+
"message": "By clicking, you agree to the $tos_link_begin$Terms of Service$tos_link_end$ and $pp_link_begin$Privacy Policy$pp_link_end$. Disable any time in Settings.",
858+
"description": "",
859+
"placeholders": {
860+
"tos_link_begin": {
861+
"content": "$1"
862+
},
863+
"tos_link_end": {
864+
"content": "$2"
865+
},
866+
"pp_link_begin": {
867+
"content": "$3"
868+
},
869+
"pp_link_end": {
870+
"content": "$4"
871+
}
872+
}
873+
},
856874
"braveTalkTurnOnPrivateAdsToStartCall": {
857875
"message": "To start a free call, enable Brave Private Ads",
858876
"description": ""
@@ -872,5 +890,13 @@
872890
"braveTalkClickAnywhereToBraveTalk": {
873891
"message": "Click anywhere on the screen to continue to Brave Talk.",
874892
"description": ""
893+
},
894+
"braveTalkWantLearnMore": {
895+
"message": "Want to learn more about Brave Rewards?",
896+
"description": ""
897+
},
898+
"braveTalkRewardsTour": {
899+
"message": "Take a quick tour.",
900+
"description": ""
875901
}
876902
}

‎components/brave_rewards/resources/extension/brave_rewards/components/ads_enable.tsx

+7
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,8 @@ import { BraveTalkOptInForm } from '../../../shared/components/onboarding/brave_
1010

1111
import * as rewardsPanelActions from '../actions/rewards_panel_actions'
1212

13+
const rewardsTourURL = 'brave_rewards_panel.html#tour'
14+
1315
interface Props extends RewardsExtension.ComponentProps {
1416
}
1517

@@ -48,10 +50,15 @@ export class AdsEnablePanel extends React.Component<Props, State> {
4850
chrome.braveRewards.enableRewards()
4951
}
5052

53+
const onRewardsTourClicked = () => {
54+
window.location.href = rewardsTourURL
55+
}
56+
5157
return (
5258
<BraveTalkOptInForm
5359
showRewardsOnboarding={this.props.rewardsPanelData.showOnboarding}
5460
onEnable={onEnable}
61+
onRewardsTourClicked={onRewardsTourClicked}
5562
/>
5663
)
5764
}

‎components/brave_rewards/resources/extension/brave_rewards/request_ads_enabled_panel.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<!doctype html>
2-
<html>
2+
<html lang="en">
33
<head>
44
<meta charset="utf-8">
55
<meta name="viewport" content="width=device-width">

‎components/brave_rewards/resources/shared/components/onboarding/brave_talk_opt_in_form.style.ts

+15-1
Original file line numberDiff line numberDiff line change
@@ -45,14 +45,15 @@ export const text = styled.div`
4545

4646
export const enable = styled.div`
4747
margin-top: 25px;
48+
margin-bottom: 15px;
4849
4950
button {
5051
min-width: 330px;
5152
}
5253
`
5354

5455
export const terms = styled.div`
55-
margin: 50px 14px 15px;
56+
margin: 15px 14px 15px;
5657
color: var(--brave-palette-neutral600);
5758
font-size: 11px;
5859
line-height: 16px;
@@ -63,3 +64,16 @@ export const terms = styled.div`
6364
text-decoration: none;
6465
}
6566
`
67+
68+
export const learn = styled.div`
69+
margin: 20px 14px 15px;
70+
color: var(--brave-palette-neutral700);
71+
font-size: 14px;
72+
line-height: 24px;
73+
`
74+
75+
export const tour = styled.div`
76+
color: var(--brave-color-brandBat);
77+
cursor: pointer;
78+
text-decoration: none;
79+
`

‎components/brave_rewards/resources/shared/components/onboarding/brave_talk_opt_in_form.tsx

+28-9
Original file line numberDiff line numberDiff line change
@@ -4,18 +4,22 @@
44

55
import * as React from 'react'
66

7-
import { LocaleContext } from '../../lib/locale_context'
8-
import { TermsOfService } from '../terms_of_service'
7+
import { LocaleContext, formatMessage } from '../../lib/locale_context'
8+
import { NewTabLink } from '../new_tab_link'
99
import { MainButton } from './main_button'
1010

1111
import { CheckCircleIcon } from './icons/check_circle'
1212
import { CashbackIcon } from './icons/cashback'
1313

1414
import * as style from './brave_talk_opt_in_form.style'
1515

16+
const termsOfServiceURL = 'https://brave.com/terms-of-use'
17+
const privacyPolicyURL = 'https://brave.com/privacy/browser'
18+
1619
interface Props {
1720
showRewardsOnboarding: boolean
1821
onEnable: () => void
22+
onRewardsTourClicked: () => void
1923
}
2024

2125
export function BraveTalkOptInForm (props: Props) {
@@ -37,9 +41,12 @@ export function BraveTalkOptInForm (props: Props) {
3741
<style.text>
3842
{getString('braveTalkClickAnywhereToBraveTalk')}
3943
</style.text>
40-
<style.terms>
41-
<TermsOfService />
42-
</style.terms>
44+
<style.learn>
45+
{getString('braveTalkWantLearnMore')}
46+
<style.tour onClick={props.onRewardsTourClicked}>
47+
{getString('braveTalkRewardsTour')}
48+
</style.tour>
49+
</style.learn>
4350
</style.root>
4451
)
4552
} else if (props.showRewardsOnboarding) {
@@ -58,7 +65,22 @@ export function BraveTalkOptInForm (props: Props) {
5865
</MainButton>
5966
</style.enable>
6067
<style.terms>
61-
<TermsOfService />
68+
{
69+
formatMessage(getString('braveTalkOptInTerms'), {
70+
tags: {
71+
$1: (content) => (
72+
<NewTabLink key='terms' href={termsOfServiceURL}>
73+
{content}
74+
</NewTabLink>
75+
),
76+
$3: (content) => (
77+
<NewTabLink key='privacy' href={privacyPolicyURL}>
78+
{content}
79+
</NewTabLink>
80+
)
81+
}
82+
})
83+
}
6284
</style.terms>
6385
</style.root>
6486
)
@@ -78,9 +100,6 @@ export function BraveTalkOptInForm (props: Props) {
78100
{getString('braveTalkTurnOnPrivateAds')}
79101
</MainButton>
80102
</style.enable>
81-
<style.terms>
82-
<TermsOfService />
83-
</style.terms>
84103
</style.root>
85104
)
86105
}

‎components/brave_rewards/resources/shared/components/onboarding/stories/locale_strings.ts

+7-4
Original file line numberDiff line numberDiff line change
@@ -48,12 +48,15 @@ export const localeStrings = {
4848
onboardingPanelBitflyerLearnMore: '$1Learn more$2 about how to link your Brave browser with your bitFlyer account.',
4949

5050
// Brave talk onboarding panel messages:
51+
braveTalkTurnOnRewardsToStartCall: 'To start a free call, turn on Brave Rewards',
5152
braveTalkBraveRewardsDescription: 'With Brave Rewards, you earn tokens for viewing private ads (your data is safe). Turn those tokens into cash, gift cards…or even tip the websites you love. No tracking. No slow downs.',
52-
braveTalkCanStartFreeCall: 'You can now start a free call',
53-
braveTalkClickAnywhereToBraveTalk: 'Click anywhere on the screen to continue to Brave Talk.',
5453
braveTalkTurnOnRewards: 'Turn on Rewards',
55-
braveTalkTurnOnRewardsToStartCall: 'To start a free call, turn on Brave Rewards',
54+
braveTalkOptInTerms: 'By clicking, you agree to the $1Terms of Service$2 and $3Privacy Policy$4. Disable any time in Settings.',
5655
braveTalkTurnOnPrivateAdsToStartCall: 'To start a free call, enable Brave Private Ads',
5756
braveTalkPrivateAdsDescription: 'With Brave Private Ads, you earn tokens for viewing private ads (your data is safe). Turn those tokens into cash, gift cards…or even tip the websites you love. No tracking. No slow downs.',
58-
braveTalkTurnOnPrivateAds: 'Turn on Brave Private Ads'
57+
braveTalkTurnOnPrivateAds: 'Turn on Brave Private Ads',
58+
braveTalkCanStartFreeCall: 'You can now start a free call',
59+
braveTalkClickAnywhereToBraveTalk: 'Click anywhere on the screen to continue to Brave Talk.',
60+
braveTalkWantLearnMore: 'Want to learn more about Brave Rewards?',
61+
braveTalkRewardsTour: 'Take a quick tour.'
5962
}

0 commit comments

Comments
 (0)