Add logo and change message text of the migration bubble

Move message text from title to body and add a Gpay logo in the title.

Updated mock go/autofill-paradise.

Bug: 852904
Change-Id: I94c18fbdc87fd527efb53b87a4e4190c83c0fcd5
Reviewed-on: https://chromium-review.googlesource.com/1157699Reviewed-by: Scott Violet <sky@chromium.org>
Commit-Queue: Siyu An <siyua@chromium.org>
Cr-Commit-Position: refs/heads/master@{#579954}

chrome/browser/ui/autofill/local_card_migration_bubble_controller_impl.cc

@@ -76,8 +76,8 @@ LocalCardMigrationBubbleControllerImpl::local_card_migration_bubble_view()
   return local_card_migration_bubble_;
 }
 
-base::string16 LocalCardMigrationBubbleControllerImpl::GetWindowTitle() const {
-  // TODO(crbug.com/859254): Update string once mock is finalized.
+base::string16 LocalCardMigrationBubbleControllerImpl::GetBubbleMessage()
+    const {
   return l10n_util::GetStringUTF16(
       IDS_AUTOFILL_LOCAL_CARD_MIGRATION_BUBBLE_TITLE);
 }

chrome/browser/ui/autofill/local_card_migration_bubble_controller_impl.h

@@ -42,7 +42,7 @@ class LocalCardMigrationBubbleControllerImpl
   LocalCardMigrationBubble* local_card_migration_bubble_view() const;
 
   // LocalCardBubbleController:
-  base::string16 GetWindowTitle() const override;
+  base::string16 GetBubbleMessage() const override;
   void OnConfirmButtonClicked() override;
   void OnCancelButtonClicked() override;
   void OnBubbleClosed() override;

chrome/browser/ui/views/autofill/local_card_migration_bubble_views.cc

@@ -21,6 +21,7 @@
 #include "ui/base/resource/resource_bundle.h"
 #include "ui/gfx/color_palette.h"
 #include "ui/gfx/geometry/insets.h"
+#include "ui/gfx/image/image_skia_operations.h"
 #include "ui/gfx/paint_vector_icon.h"
 #include "ui/views/border.h"
 #include "ui/views/bubble/bubble_frame_view.h"
@@ -32,6 +33,11 @@
 
 namespace autofill {
 
+namespace {
+const int kMigrationBubbleGooglePayLogoWidth = 40;
+const int kMigrationBubbleGooglePayLogoHeight = 16;
+}  // namespace
+
 LocalCardMigrationBubbleViews::LocalCardMigrationBubbleViews(
     views::View* anchor_view,
     const gfx::Point& anchor_point,
@@ -95,12 +101,22 @@ gfx::Size LocalCardMigrationBubbleViews::CalculatePreferredSize() const {
   return gfx::Size(width, GetHeightForWidth(width));
 }
 
-bool LocalCardMigrationBubbleViews::ShouldShowCloseButton() const {
-  return ui::MaterialDesignController::IsSecondaryUiMaterial();
+void LocalCardMigrationBubbleViews::AddedToWidget() {
+  auto title_container = std::make_unique<views::View>();
+  title_container->SetLayoutManager(
+      std::make_unique<views::BoxLayout>(views::BoxLayout::kHorizontal));
+  gfx::ImageSkia image = gfx::ImageSkiaOperations::CreateTiledImage(
+      gfx::CreateVectorIcon(kGooglePayLogoIcon, gfx::kPlaceholderColor),
+      /*x=*/0, /*y=*/0, kMigrationBubbleGooglePayLogoWidth,
+      kMigrationBubbleGooglePayLogoHeight);
+  views::ImageView* icon_view = new views::ImageView();
+  icon_view->SetImage(&image);
+  title_container->AddChildView(icon_view);
+  GetBubbleFrameView()->SetTitleView(std::move(title_container));
 }
 
-base::string16 LocalCardMigrationBubbleViews::GetWindowTitle() const {
-  return controller_->GetWindowTitle();
+bool LocalCardMigrationBubbleViews::ShouldShowCloseButton() const {
+  return ui::MaterialDesignController::IsSecondaryUiMaterial();
 }
 
 void LocalCardMigrationBubbleViews::WindowClosing() {
@@ -112,16 +128,14 @@ void LocalCardMigrationBubbleViews::WindowClosing() {
 
 LocalCardMigrationBubbleViews::~LocalCardMigrationBubbleViews() {}
 
-std::unique_ptr<views::View>
-LocalCardMigrationBubbleViews::CreateMainContentView() {
-  std::unique_ptr<views::View> view = std::make_unique<views::View>();
-  return view;
-}
-
 void LocalCardMigrationBubbleViews::Init() {
   SetLayoutManager(
       std::make_unique<views::BoxLayout>(views::BoxLayout::kVertical));
-  AddChildView(CreateMainContentView().release());
+  views::Label* explanatory_message = new views::Label(
+      controller_->GetBubbleMessage(), CONTEXT_BODY_TEXT_LARGE);
+  explanatory_message->SetHorizontalAlignment(gfx::ALIGN_LEFT);
+  explanatory_message->SetMultiLine(true);
+  AddChildView(explanatory_message);
 }
 
 }  // namespace autofill
\ No newline at end of file

chrome/browser/ui/views/autofill/local_card_migration_bubble_views.h

@@ -41,15 +41,13 @@ class LocalCardMigrationBubbleViews : public LocalCardMigrationBubble,
   int GetDialogButtons() const override;
   base::string16 GetDialogButtonLabel(ui::DialogButton button) const override;
   gfx::Size CalculatePreferredSize() const override;
+  void AddedToWidget() override;
   bool ShouldShowCloseButton() const override;
-  base::string16 GetWindowTitle() const override;
   void WindowClosing() override;
 
  private:
   ~LocalCardMigrationBubbleViews() override;
 
-  std::unique_ptr<views::View> CreateMainContentView();
-
   // views::BubbleDialogDelegateView:
   void Init() override;
 

components/autofill/core/browser/ui/local_card_migration_bubble_controller.h

@@ -20,8 +20,8 @@ class LocalCardMigrationBubbleController {
   LocalCardMigrationBubbleController() {}
   virtual ~LocalCardMigrationBubbleController() {}
 
-  // Returns the title that should be displayed in the bubble.
-  virtual base::string16 GetWindowTitle() const = 0;
+  // Returns the explanatory message that should be displayed in the bubble.
+  virtual base::string16 GetBubbleMessage() const = 0;
 
   // Interaction.
   virtual void OnConfirmButtonClicked() = 0;

components/autofill_strings.grdp

@@ -247,7 +247,7 @@
   <!-- Autofill Local card migration bubble or prompt -->
   <if expr="not is_ios and not is_android">
     <message name="IDS_AUTOFILL_LOCAL_CARD_MIGRATION_BUBBLE_TITLE" desc="Text to show in the Autofill local card migration intermediate bubble.">
-      Do you want to have all your cards in one place?
+      Save all your cards in one place?
     </message>
     <message name="IDS_AUTOFILL_LOCAL_CARD_MIGRATION_BUBBLE_BUTTON_LABEL" desc="Text to show in the Autofill local card migration intermediate bubble button.">
       Continue