From 8eede734369abcdc01fd42f14da95419a4b98c16 Mon Sep 17 00:00:00 2001 From: Aleksey Seren Date: Tue, 10 Sep 2024 14:15:10 -0500 Subject: [PATCH] [ads] Update search ad clicked infobar text and icon --- app/brave_generated_resources.grd | 5 +- ...arch_result_ad_clicked_infobar_delegate.cc | 13 ++- ...earch_result_ad_clicked_infobar_delegate.h | 2 +- components/vector_icons/BUILD.gn | 1 - .../SearchResultAdClickedInfoBar.swift | 98 +++++++------------ .../Sources/Shared/SharedStrings.swift | 17 +++- 6 files changed, 58 insertions(+), 78 deletions(-) diff --git a/app/brave_generated_resources.grd b/app/brave_generated_resources.grd index 4d32610f6a88..e7183c517648 100644 --- a/app/brave_generated_resources.grd +++ b/app/brave_generated_resources.grd @@ -656,7 +656,10 @@ Or change later at $2brave://settings/ext You don't need to click to earn, but do click if you're interested! - You’ve just clicked on a Brave Search ad. Unlike Big Tech, we measure ad performance anonymously and preserve your privacy. + Thank you for supporting Brave Search by clicking on a private ad! Unlike Big Tech, we measure ad performance anonymously and preserve your privacy. + + + Learn more / opt out choices diff --git a/browser/brave_ads/creatives/search_result_ad/creative_search_result_ad_clicked_infobar_delegate.cc b/browser/brave_ads/creatives/search_result_ad/creative_search_result_ad_clicked_infobar_delegate.cc index 1555076e9a9a..59f9f1c689a0 100644 --- a/browser/brave_ads/creatives/search_result_ad/creative_search_result_ad_clicked_infobar_delegate.cc +++ b/browser/brave_ads/creatives/search_result_ad/creative_search_result_ad_clicked_infobar_delegate.cc @@ -8,7 +8,6 @@ #include #include "brave/components/brave_ads/core/public/prefs/pref_names.h" -#include "brave/components/vector_icons/vector_icons.h" #include "brave/grit/brave_generated_resources.h" #include "chrome/browser/infobars/confirm_infobar_creator.h" #include "components/infobars/content/content_infobar_manager.h" @@ -18,12 +17,15 @@ #include "components/vector_icons/vector_icons.h" #include "content/public/browser/web_contents.h" #include "ui/base/l10n/l10n_util.h" +#include "ui/base/models/image_model.h" #include "url/gurl.h" namespace brave_ads { namespace { +constexpr int kIconSize = 20; + constexpr char kLearnMoreUrl[] = "https://support.brave.com/hc/en-us/articles/360026361072-Brave-Ads-FAQ"; @@ -62,9 +64,9 @@ CreativeSearchResultAdClickedInfoBarDelegate::GetIdentifier() const { return SEARCH_RESULT_AD_CLICKED_INFOBAR_DELEGATE; } -const gfx::VectorIcon& -CreativeSearchResultAdClickedInfoBarDelegate::GetVectorIcon() const { - return kLeoBraveIconReleaseColorIcon; +ui::ImageModel CreativeSearchResultAdClickedInfoBarDelegate::GetIcon() const { + return ui::ImageModel::FromVectorIcon(vector_icons::kProductIcon, + ui::kColorIcon, kIconSize); } std::u16string CreativeSearchResultAdClickedInfoBarDelegate::GetMessageText() @@ -79,7 +81,8 @@ int CreativeSearchResultAdClickedInfoBarDelegate::GetButtons() const { std::u16string CreativeSearchResultAdClickedInfoBarDelegate::GetLinkText() const { - return l10n_util::GetStringUTF16(IDS_LEARN_MORE); + return l10n_util::GetStringUTF16( + IDS_BRAVE_ADS_SEARCH_RESULT_AD_LEARN_MORE_OPT_OUT_CHOICES_LABEL); } GURL CreativeSearchResultAdClickedInfoBarDelegate::GetLinkURL() const { diff --git a/browser/brave_ads/creatives/search_result_ad/creative_search_result_ad_clicked_infobar_delegate.h b/browser/brave_ads/creatives/search_result_ad/creative_search_result_ad_clicked_infobar_delegate.h index 55f95c55143f..6ccb4f865840 100644 --- a/browser/brave_ads/creatives/search_result_ad/creative_search_result_ad_clicked_infobar_delegate.h +++ b/browser/brave_ads/creatives/search_result_ad/creative_search_result_ad_clicked_infobar_delegate.h @@ -32,7 +32,7 @@ class CreativeSearchResultAdClickedInfoBarDelegate private: // ConfirmInfoBarDelegate: infobars::InfoBarDelegate::InfoBarIdentifier GetIdentifier() const override; - const gfx::VectorIcon& GetVectorIcon() const override; + ui::ImageModel GetIcon() const override; std::u16string GetMessageText() const override; int GetButtons() const override; std::u16string GetLinkText() const override; diff --git a/components/vector_icons/BUILD.gn b/components/vector_icons/BUILD.gn index 0c4a9a854201..7d8a7b945e29 100644 --- a/components/vector_icons/BUILD.gn +++ b/components/vector_icons/BUILD.gn @@ -19,7 +19,6 @@ aggregate_vector_icons("brave_components_vector_icons") { "leo_arrow_right.icon", "leo_arrow_small_right.icon", "leo_brave_icon_monochrome.icon", - "leo_brave_icon_release_color.icon", "leo_browser_add.icon", "leo_browser_bookmark_add.icon", "leo_browser_bookmark_plural.icon", diff --git a/ios/brave-ios/Sources/Brave/Frontend/Browser/SearchResultAdClickedInfoBar.swift b/ios/brave-ios/Sources/Brave/Frontend/Browser/SearchResultAdClickedInfoBar.swift index a9b94923a895..6466348e7e7d 100644 --- a/ios/brave-ios/Sources/Brave/Frontend/Browser/SearchResultAdClickedInfoBar.swift +++ b/ios/brave-ios/Sources/Brave/Frontend/Browser/SearchResultAdClickedInfoBar.swift @@ -9,11 +9,11 @@ import SnapKit import SwiftUI import UIKit -struct SearchResultAdClickedInfoBarUX { +private struct SearchResultAdClickedInfoBarUX { static let toastHeight: CGFloat = 100.0 static let toastPadding: CGFloat = 10.0 static let toastCloseButtonWidth: CGFloat = 20.0 - static let toastLabelFont = UIFont.systemFont(ofSize: 15, weight: .semibold) + static let toastLabelFont = UIFont.preferredFont(forTextStyle: .subheadline) static let toastBackgroundColor = UIColor(braveSystemName: .schemesOnPrimaryFixed) static let learnMoreUrl = "https://support.brave.com/hc/en-us/articles/360026361072-Brave-Ads-FAQ" } @@ -29,22 +29,23 @@ class SearchResultAdClickedInfoBar: Toast, UITextViewDelegate { self.tapDismissalMode = .outsideTap self.clipsToBounds = true - self.addSubview( - createView( - Strings.searchResultAdsClickedInfoBarTitle + " " - ) - ) - self.toastView.backgroundColor = SearchResultAdClickedInfoBarUX.toastBackgroundColor + toastView.backgroundColor = SearchResultAdClickedInfoBarUX.toastBackgroundColor - self.toastView.snp.makeConstraints { make in - make.left.right.height.equalTo(self) - self.animationConstraint = - make.top.equalTo(self).offset(SearchResultAdClickedInfoBarUX.toastHeight).constraint + let toastContent = createToastContent( + Strings.searchResultAdClickedInfoBarTitle + " " + ) + toastView.addSubview(toastContent) + toastContent.snp.makeConstraints { make in + make.centerX.equalTo(toastView) + make.centerY.equalTo(toastView) + make.edges.equalTo(toastView).inset(SearchResultAdClickedInfoBarUX.toastPadding) } - self.snp.makeConstraints { make in - make.height.equalTo(SearchResultAdClickedInfoBarUX.toastHeight) + addSubview(toastView) + toastView.snp.makeConstraints { make in + make.left.right.height.equalTo(self) + self.animationConstraint = make.top.equalTo(self).offset(SimpleToastUX.toastHeight).constraint } } @@ -52,7 +53,7 @@ class SearchResultAdClickedInfoBar: Toast, UITextViewDelegate { fatalError("init(coder:) has not been implemented") } - fileprivate func createView( + fileprivate func createToastContent( _ labelText: String ) -> UIView { let horizontalStackView = UIStackView() @@ -70,7 +71,7 @@ class SearchResultAdClickedInfoBar: Toast, UITextViewDelegate { label.isSelectable = true label.delegate = self - let learnMoreText = Strings.learnMore.withNonBreakingSpace + let learnMoreOptOutChoicesText = Strings.searchResultAdClickedLearnMoreOptOutChoicesLabel let attributes: [NSAttributedString.Key: Any] = [ .foregroundColor: UIColor.white, .font: SearchResultAdClickedInfoBarUX.toastLabelFont, @@ -88,52 +89,34 @@ class SearchResultAdClickedInfoBar: Toast, UITextViewDelegate { attributes: attributes ) let nsLinkAttributedString = NSMutableAttributedString( - string: learnMoreText, + string: learnMoreOptOutChoicesText, attributes: linkAttributes ) if let url = URL(string: SearchResultAdClickedInfoBarUX.learnMoreUrl) { - let learnMoreRange = NSRange(location: 0, length: learnMoreText.count) - nsLinkAttributedString.addAttribute(.link, value: url, range: learnMoreRange) + let linkTextRange = NSRange(location: 0, length: learnMoreOptOutChoicesText.count) + nsLinkAttributedString.addAttribute(.link, value: url, range: linkTextRange) nsLabelAttributedString.append(nsLinkAttributedString) label.isUserInteractionEnabled = true } label.attributedText = nsLabelAttributedString - horizontalStackView.addArrangedSubview(label) - if let buttonImage = UIImage(braveSystemNamed: "leo.close") { - let button = UIButton() - button.setImage(buttonImage, for: .normal) - button.imageView?.contentMode = .scaleAspectFit - button.imageView?.tintColor = .white - button.imageView?.preferredSymbolConfiguration = .init( - font: .preferredFont(for: .title3, weight: .regular), - scale: .small - ) - - button.imageView?.snp.makeConstraints { - $0.width.equalTo(SearchResultAdClickedInfoBarUX.toastCloseButtonWidth) - } - - button.addGestureRecognizer( - UITapGestureRecognizer(target: self, action: #selector(buttonPressed)) - ) - - horizontalStackView.addArrangedSubview(button) - } - - toastView.addSubview(horizontalStackView) - - horizontalStackView.snp.makeConstraints { make in - make.centerX.equalTo(toastView) - make.centerY.equalTo(toastView) - make.width.equalTo(toastView.snp.width).offset( - -2 * SearchResultAdClickedInfoBarUX.toastPadding - ) + let button = UIButton() + button.setImage(UIImage(braveSystemNamed: "leo.close")!, for: .normal) + button.imageView?.contentMode = .scaleAspectFit + button.imageView?.tintColor = .white + button.imageView?.preferredSymbolConfiguration = .init( + font: .preferredFont(for: .title3, weight: .regular), + scale: .small + ) + button.snp.makeConstraints { + $0.width.equalTo(SearchResultAdClickedInfoBarUX.toastCloseButtonWidth) } + button.addTarget(self, action: #selector(buttonPressed), for: .touchUpInside) + horizontalStackView.addArrangedSubview(button) - return toastView + return horizontalStackView } func textView( @@ -153,19 +136,4 @@ class SearchResultAdClickedInfoBar: Toast, UITextViewDelegate { @objc func buttonPressed(_ gestureRecognizer: UIGestureRecognizer) { dismiss(true) } - - override func showToast( - viewController: UIViewController? = nil, - delay: DispatchTimeInterval = SimpleToastUX.toastDelayBefore, - duration: DispatchTimeInterval?, - makeConstraints: @escaping (ConstraintMaker) -> Void, - completion: (() -> Void)? = nil - ) { - super.showToast( - viewController: viewController, - delay: delay, - duration: duration, - makeConstraints: makeConstraints - ) - } } diff --git a/ios/brave-ios/Sources/Shared/SharedStrings.swift b/ios/brave-ios/Sources/Shared/SharedStrings.swift index 3383efe62981..1785331a6945 100644 --- a/ios/brave-ios/Sources/Shared/SharedStrings.swift +++ b/ios/brave-ios/Sources/Shared/SharedStrings.swift @@ -338,12 +338,19 @@ extension Strings { ) } -// Search result ad clicked InfoBar title +// Search result ad clicked InfoBar title and learn more / opt out choices link. extension Strings { - public static let searchResultAdsClickedInfoBarTitle = NSLocalizedString( - "SearchResultAdsClickedInfoBarTitle", + public static let searchResultAdClickedInfoBarTitle = NSLocalizedString( + "SearchResultAdClickedInfoBarTitle", bundle: .module, - value: "You’ve just clicked on a Brave Search ad. Unlike Big Tech, we measure ad performance anonymously and preserve your privacy.", - comment: "InfoBar displayed after a user clicked a search result ad for the first time." + value: "Thank you for supporting Brave Search by clicking on a private ad! Unlike Big Tech, we measure ad performance anonymously and preserve your privacy.", + comment: "The text label of creative search result ad infobar message." + ) + + public static let searchResultAdClickedLearnMoreOptOutChoicesLabel = NSLocalizedString( + "SearchResultAdClickedLearnMoreOptOutChoicesLabel", + bundle: .module, + value: "Learn more / opt out choices", + comment: "The text label of creative search result ad learn more / opt out choices link." ) }