Skip to content

Commit

Permalink
Merge pull request #20211 from brave/bookmark_panel_header
Browse files Browse the repository at this point in the history
Added header to bookmarks panel
  • Loading branch information
simonhong authored Sep 22, 2023
2 parents 5484ca6 + 70255d1 commit 4a53732
Show file tree
Hide file tree
Showing 17 changed files with 367 additions and 37 deletions.
10 changes: 10 additions & 0 deletions app/brave_generated_resources.grd
Original file line number Diff line number Diff line change
Expand Up @@ -799,6 +799,16 @@ Or change later at <ph name="SETTINGS_EXTENIONS_LINK">$2<ex>brave://settings/ext
<message name="IDS_SIDEBAR_READING_LIST_PANEL_HEADER_TITLE" desc="Text of readling list panel header">
Reading List
</message>
<if expr="not use_titlecase">
<message name="IDS_SIDEBAR_READING_LIST_PANEL_HEADER_BOOKMARKS_BUTTON_TOOLTIP" desc="Text of bookmarks panel header button tooltip">
Bookmarks manager
</message>
</if>
<if expr="use_titlecase">
<message name="IDS_SIDEBAR_READING_LIST_PANEL_HEADER_BOOKMARKS_BUTTON_TOOLTIP" desc="Text of bookmark panel header button tooltip">
Bookmarks Manager
</message>
</if>
</if>

<!-- Stats -->
Expand Down
1 change: 1 addition & 0 deletions app/theme/brave_theme_resources.grd
Original file line number Diff line number Diff line change
Expand Up @@ -48,6 +48,7 @@
</if>

<if expr="toolkit_views">
<structure type="chrome_scaled_image" name="IDR_SIDEBAR_BOOKMARKS_PANEL_HEADER" file="brave/sidebar_bookmarks_panel_header.png" />
<structure type="chrome_scaled_image" name="IDR_SIDEBAR_ITEM_HIGHLIGHT" file="brave/sidebar_item_highlight.png" />
<structure type="chrome_scaled_image" name="IDR_SIDEBAR_ITEM_HIGHLIGHT_RIGHT" file="brave/sidebar_item_highlight_right.png" />
<structure type="chrome_scaled_image" name="IDR_SIDEBAR_READING_LIST_PANEL_HEADER" file="brave/sidebar_reading_list_panel_header.png" />
Expand Down
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
6 changes: 6 additions & 0 deletions browser/ui/BUILD.gn
Original file line number Diff line number Diff line change
Expand Up @@ -330,6 +330,10 @@ source_set("ui") {
"views/page_action/brave_page_action_icon_container_view.h",
"views/rounded_separator.cc",
"views/rounded_separator.h",
"views/side_panel/bookmarks/brave_bookmarks_side_panel_coordinator.cc",
"views/side_panel/bookmarks/brave_bookmarks_side_panel_coordinator.h",
"views/side_panel/brave_bookmarks_side_panel_view.cc",
"views/side_panel/brave_bookmarks_side_panel_view.h",
"views/side_panel/brave_read_later_side_panel_view.cc",
"views/side_panel/brave_read_later_side_panel_view.h",
"views/side_panel/brave_side_panel.cc",
Expand All @@ -339,6 +343,8 @@ source_set("ui") {
"views/side_panel/brave_side_panel_resize_widget.cc",
"views/side_panel/brave_side_panel_resize_widget.h",
"views/side_panel/brave_side_panel_utils.cc",
"views/side_panel/brave_side_panel_view_base.cc",
"views/side_panel/brave_side_panel_view_base.h",
"views/tabs/brave_browser_tab_strip_controller.cc",
"views/tabs/brave_browser_tab_strip_controller.h",
"views/tabs/brave_compound_tab_container.cc",
Expand Down
4 changes: 3 additions & 1 deletion browser/ui/color/brave_color_id.h
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,9 @@
E_CPONLY(kColorSidebarSeparator) \
E_CPONLY(kColorSidebarPanelHeaderSeparator) \
E_CPONLY(kColorSidebarPanelHeaderBackground) \
E_CPONLY(kColorSidebarPanelHeaderTitle)
E_CPONLY(kColorSidebarPanelHeaderTitle) \
E_CPONLY(kColorSidebarPanelHeaderButton) \
E_CPONLY(kColorSidebarPanelHeaderButtonHovered)

#if BUILDFLAG(ENABLE_SPEEDREADER)
#define BRAVE_SPEEDREADER_COLOR_IDS \
Expand Down
8 changes: 8 additions & 0 deletions browser/ui/color/brave_color_mixer.cc
Original file line number Diff line number Diff line change
Expand Up @@ -362,6 +362,10 @@ void AddBraveLightThemeColorMixer(ui::ColorProvider* provider,
leo::GetColor(leo::Color::kColorContainerBackground, leo::Theme::kLight)};
mixer[kColorSidebarPanelHeaderTitle] = {
leo::GetColor(leo::Color::kColorTextSecondary, leo::Theme::kLight)};
mixer[kColorSidebarPanelHeaderButton] = {
leo::GetColor(leo::Color::kColorIconDefault, leo::Theme::kLight)};
mixer[kColorSidebarPanelHeaderButtonHovered] = {
leo::GetColor(leo::Color::kColorGray60, leo::Theme::kLight)};

if (HasCustomToolbarColor(key)) {
// When custom color for toolbar is set, we can't depend on the color mode.
Expand Down Expand Up @@ -478,6 +482,10 @@ void AddBraveDarkThemeColorMixer(ui::ColorProvider* provider,
mixer[kColorSidebarPanelHeaderBackground] = {gfx::kGoogleGrey900};
mixer[kColorSidebarPanelHeaderTitle] = {
leo::GetColor(leo::Color::kColorTextSecondary, leo::Theme::kDark)};
mixer[kColorSidebarPanelHeaderButton] = {
leo::GetColor(leo::Color::kColorIconDefault, leo::Theme::kDark)};
mixer[kColorSidebarPanelHeaderButtonHovered] = {
leo::GetColor(leo::Color::kColorGray60, leo::Theme::kDark)};

if (HasCustomToolbarColor(key)) {
// When custom color for toolbar is set, we can't depend on the color mode.
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,41 @@
/* Copyright (c) 2023 The Brave Authors. All rights reserved.
* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this file,
* You can obtain one at https://mozilla.org/MPL/2.0/. */

#include "brave/browser/ui/views/side_panel/bookmarks/brave_bookmarks_side_panel_coordinator.h"

#include "base/functional/bind.h"
#include "brave/browser/ui/views/side_panel/brave_bookmarks_side_panel_view.h"
#include "chrome/browser/ui/views/side_panel/side_panel_entry.h"
#include "chrome/browser/ui/views/side_panel/side_panel_registry.h"
#include "chrome/grit/generated_resources.h"
#include "components/omnibox/browser/vector_icons.h"
#include "ui/base/l10n/l10n_util.h"
#include "ui/base/models/image_model.h"
#include "ui/views/vector_icons.h"

BraveBookmarksSidePanelCoordinator::BraveBookmarksSidePanelCoordinator(
Browser* browser)
: BrowserUserData<BraveBookmarksSidePanelCoordinator>(*browser) {}

BraveBookmarksSidePanelCoordinator::~BraveBookmarksSidePanelCoordinator() =
default;

void BraveBookmarksSidePanelCoordinator::CreateAndRegisterEntry(
SidePanelRegistry* global_registry) {
global_registry->Register(std::make_unique<SidePanelEntry>(
SidePanelEntry::Id::kBookmarks,
l10n_util::GetStringUTF16(IDS_BOOKMARK_MANAGER_TITLE),
ui::ImageModel::FromVectorIcon(omnibox::kStarIcon, ui::kColorIcon),
base::BindRepeating(
&BraveBookmarksSidePanelCoordinator::CreateBookmarksPanelView,
base::Unretained(this))));
}

std::unique_ptr<views::View>
BraveBookmarksSidePanelCoordinator::CreateBookmarksPanelView() {
return std::make_unique<BraveBookmarksSidePanelView>(&GetBrowser());
}

BROWSER_USER_DATA_KEY_IMPL(BraveBookmarksSidePanelCoordinator);
Original file line number Diff line number Diff line change
@@ -0,0 +1,50 @@
/* Copyright (c) 2023 The Brave Authors. All rights reserved.
* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this file,
* You can obtain one at https://mozilla.org/MPL/2.0/. */

#ifndef BRAVE_BROWSER_UI_VIEWS_SIDE_PANEL_BOOKMARKS_BRAVE_BOOKMARKS_SIDE_PANEL_COORDINATOR_H_
#define BRAVE_BROWSER_UI_VIEWS_SIDE_PANEL_BOOKMARKS_BRAVE_BOOKMARKS_SIDE_PANEL_COORDINATOR_H_

#include <memory>

#include "chrome/browser/ui/browser_user_data.h"

class Browser;
class SidePanelRegistry;

namespace views {
class View;
} // namespace views

// Introduced to give custom contents view(BraveBookmarksSidePanelView) for
// bookmarks panel entry. That contents view includes bookmarks panel specific
// header view and web view.
// Note that this is not the subclass of upstream BookmarksSidePanelCoordinator.
// As it inherits BrowserUserData, subclassig doesn't work well when its
// instance is created via BrowserUserData<>::CreateForBrowser(). So, new
// coordinator class is introduced and
// BookmarksSidePanelCoordinator::CreateBookmarksWebView() is reused from
// BraveBookmarksSidePanelView. That's why BraveBookmarksSidePanelView is set
// as BookmarksSidePanelCoordinator's friend.
class BraveBookmarksSidePanelCoordinator
: public BrowserUserData<BraveBookmarksSidePanelCoordinator> {
public:
explicit BraveBookmarksSidePanelCoordinator(Browser* browser);
BraveBookmarksSidePanelCoordinator(
const BraveBookmarksSidePanelCoordinator&) = delete;
BraveBookmarksSidePanelCoordinator& operator=(
const BraveBookmarksSidePanelCoordinator&) = delete;
~BraveBookmarksSidePanelCoordinator() override;

void CreateAndRegisterEntry(SidePanelRegistry* global_registry);

private:
friend class BrowserUserData<BraveBookmarksSidePanelCoordinator>;

std::unique_ptr<views::View> CreateBookmarksPanelView();

BROWSER_USER_DATA_KEY_DECL();
};

#endif // BRAVE_BROWSER_UI_VIEWS_SIDE_PANEL_BOOKMARKS_BRAVE_BOOKMARKS_SIDE_PANEL_COORDINATOR_H_
128 changes: 128 additions & 0 deletions browser/ui/views/side_panel/brave_bookmarks_side_panel_view.cc
Original file line number Diff line number Diff line change
@@ -0,0 +1,128 @@
/* Copyright (c) 2023 The Brave Authors. All rights reserved.
* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this file,
* You can obtain one at https://mozilla.org/MPL/2.0/. */

#include "brave/browser/ui/views/side_panel/brave_bookmarks_side_panel_view.h"

#include <memory>

#include "base/memory/raw_ref.h"
#include "brave/browser/ui/color/brave_color_id.h"
#include "brave/components/vector_icons/vector_icons.h"
#include "brave/grit/brave_generated_resources.h"
#include "brave/grit/brave_theme_resources.h"
#include "chrome/browser/ui/singleton_tabs.h"
#include "chrome/browser/ui/views/side_panel/bookmarks/bookmarks_side_panel_coordinator.h"
#include "chrome/browser/ui/views/side_panel/read_later_side_panel_web_view.h"
#include "chrome/common/webui_url_constants.h"
#include "chrome/grit/generated_resources.h"
#include "ui/base/l10n/l10n_util.h"
#include "ui/base/models/image_model.h"
#include "ui/base/resource/resource_bundle.h"
#include "ui/gfx/font_list.h"
#include "ui/gfx/geometry/insets.h"
#include "ui/views/background.h"
#include "ui/views/controls/button/image_button.h"
#include "ui/views/controls/image_view.h"
#include "ui/views/controls/label.h"
#include "ui/views/controls/separator.h"
#include "ui/views/layout/flex_layout.h"
#include "ui/views/layout/layout_types.h"

namespace {

// Renders icon, title and launch button.
class BookmarksSidePanelHeaderView : public views::View {
public:
explicit BookmarksSidePanelHeaderView(Browser* browser) {
constexpr int kHeaderInteriorMargin = 16;
SetLayoutManager(std::make_unique<views::FlexLayout>())
->SetOrientation(views::LayoutOrientation::kHorizontal)
.SetInteriorMargin(gfx::Insets(kHeaderInteriorMargin))
.SetMainAxisAlignment(views::LayoutAlignment::kStart)
.SetCrossAxisAlignment(views::LayoutAlignment::kCenter);

ui::ResourceBundle& rb = ui::ResourceBundle::GetSharedInstance();
auto* header_image = AddChildView(
std::make_unique<views::ImageView>(ui::ImageModel::FromImageSkia(
*rb.GetImageSkiaNamed(IDR_SIDEBAR_BOOKMARKS_PANEL_HEADER))));
constexpr int kSpacingBetweenHeaderImageAndLabel = 8;
header_image->SetProperty(
views::kMarginsKey,
gfx::Insets::TLBR(0, 0, 0, kSpacingBetweenHeaderImageAndLabel));
header_image->SetProperty(
views::kFlexBehaviorKey,
views::FlexSpecification(views::MinimumFlexSizeRule::kPreferred,
views::MaximumFlexSizeRule::kPreferred));

auto* header_label = AddChildView(std::make_unique<views::Label>(
l10n_util::GetStringUTF16(IDS_BOOKMARK_MANAGER_TITLE)));
header_label->SetFontList(gfx::FontList("Poppins, Semi-Bold 16px"));
header_label->SetEnabledColorId(kColorSidebarPanelHeaderTitle);
header_label->SetProperty(
views::kFlexBehaviorKey,
views::FlexSpecification(views::MinimumFlexSizeRule::kPreferred,
views::MaximumFlexSizeRule::kPreferred));
auto* spacer = AddChildView(std::make_unique<views::View>());
spacer->SetProperty(
views::kFlexBehaviorKey,
views::FlexSpecification(views::MinimumFlexSizeRule::kScaleToZero,
views::MaximumFlexSizeRule::kUnbounded)
.WithOrder(2));
// Safe to use Unretained(this) here as |button| will be destroyed before
// this class.
auto* button = AddChildView(std::make_unique<views::ImageButton>(
base::BindRepeating(&BookmarksSidePanelHeaderView::OnButtonPressed,
base::Unretained(this), browser)));
button->SetTooltipText(l10n_util::GetStringUTF16(
IDS_SIDEBAR_READING_LIST_PANEL_HEADER_BOOKMARKS_BUTTON_TOOLTIP));

constexpr int kHeaderButtonSize = 20;
button->SetImageModel(
views::Button::STATE_NORMAL,
ui::ImageModel::FromVectorIcon(
kLeoLaunchIcon, kColorSidebarPanelHeaderButton, kHeaderButtonSize));
button->SetImageModel(
views::Button::STATE_HOVERED,
ui::ImageModel::FromVectorIcon(kLeoLaunchIcon,
kColorSidebarPanelHeaderButtonHovered,
kHeaderButtonSize));

SetBackground(
views::CreateThemedSolidBackground(kColorSidebarPanelHeaderBackground));
}

~BookmarksSidePanelHeaderView() override = default;
BookmarksSidePanelHeaderView(const BookmarksSidePanelHeaderView&) = delete;
BookmarksSidePanelHeaderView& operator=(const BookmarksSidePanelHeaderView&) =
delete;

private:
void OnButtonPressed(Browser* browser, const ui::Event& event) {
ShowSingletonTab(browser, GURL(chrome::kChromeUIBookmarksURL));
}
};

} // namespace

BraveBookmarksSidePanelView::BraveBookmarksSidePanelView(Browser* browser) {
SetLayoutManager(std::make_unique<views::FlexLayout>())
->SetOrientation(views::LayoutOrientation::kVertical);
AddChildView(std::make_unique<BookmarksSidePanelHeaderView>(browser));
AddChildView(std::make_unique<views::Separator>())
->SetColorId(kColorSidebarPanelHeaderSeparator);

// Reuse upstream's bookmarks panl nwebui.
auto* web_view =
AddChildView(BookmarksSidePanelCoordinator::GetOrCreateForBrowser(browser)
->CreateBookmarksWebView());
web_view->SetProperty(
views::kFlexBehaviorKey,
views::FlexSpecification(views::MinimumFlexSizeRule::kPreferred,
views::MaximumFlexSizeRule::kUnbounded));

StartObservingWebWebViewVisibilityChange(web_view);
}

BraveBookmarksSidePanelView::~BraveBookmarksSidePanelView() = default;
23 changes: 23 additions & 0 deletions browser/ui/views/side_panel/brave_bookmarks_side_panel_view.h
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
/* Copyright (c) 2023 The Brave Authors. All rights reserved.
* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this file,
* You can obtain one at https://mozilla.org/MPL/2.0/. */

#ifndef BRAVE_BROWSER_UI_VIEWS_SIDE_PANEL_BRAVE_BOOKMARKS_SIDE_PANEL_VIEW_H_
#define BRAVE_BROWSER_UI_VIEWS_SIDE_PANEL_BRAVE_BOOKMARKS_SIDE_PANEL_VIEW_H_

#include "brave/browser/ui/views/side_panel/brave_side_panel_view_base.h"

class Browser;

// Gives bookmarks panel specific header view with web view.
class BraveBookmarksSidePanelView : public BraveSidePanelViewBase {
public:
explicit BraveBookmarksSidePanelView(Browser* browser);
~BraveBookmarksSidePanelView() override;
BraveBookmarksSidePanelView(const BraveBookmarksSidePanelView&) = delete;
BraveBookmarksSidePanelView& operator=(const BraveBookmarksSidePanelView&) =
delete;
};

#endif // BRAVE_BROWSER_UI_VIEWS_SIDE_PANEL_BRAVE_BOOKMARKS_SIDE_PANEL_VIEW_H_
26 changes: 1 addition & 25 deletions browser/ui/views/side_panel/brave_read_later_side_panel_view.cc
Original file line number Diff line number Diff line change
Expand Up @@ -11,8 +11,6 @@
#include "brave/grit/brave_generated_resources.h"
#include "brave/grit/brave_theme_resources.h"
#include "chrome/browser/ui/views/side_panel/read_later_side_panel_web_view.h"
#include "chrome/browser/ui/views/side_panel/side_panel_content_proxy.h"
#include "chrome/browser/ui/views/side_panel/side_panel_util.h"
#include "ui/base/l10n/l10n_util.h"
#include "ui/base/resource/resource_bundle.h"
#include "ui/gfx/font_list.h"
Expand Down Expand Up @@ -87,29 +85,7 @@ BraveReadLaterSidePanelView::BraveReadLaterSidePanelView(
views::FlexSpecification(views::MinimumFlexSizeRule::kPreferred,
views::MaximumFlexSizeRule::kUnbounded));

// Originally SidePanelEntry's Content was ReadLaterSidePanelWebView
// and it's availability is set to true when SidePanelWebUIView::ShowUI()
// and then proxy's availability callback is executed.
// However, we use parent view(BraveReadLaterSidePanelView) to have
// panel specific header view and this class becomes SidePanelEntry's Content.
// To make this content available when SidePanelWebUIVew::ShowUI() is called,
// this observes WebView's visibility because it's set as visible when
// ShowUI() is called.
// NOTE: If we use our own reading list page and it has loading spinner, maybe
// we can set `true` here.
SidePanelUtil::GetSidePanelContentProxy(this)->SetAvailable(false);
observation_.Observe(web_view);
}

void BraveReadLaterSidePanelView::OnViewVisibilityChanged(
views::View* observed_view,
views::View* starting_view) {
// Once it becomes available, stop observing becuase its availablity is
// not changed from now on.
if (observed_view->GetVisible()) {
SidePanelUtil::GetSidePanelContentProxy(this)->SetAvailable(true);
observation_.Reset();
}
StartObservingWebWebViewVisibilityChange(web_view);
}

BraveReadLaterSidePanelView::~BraveReadLaterSidePanelView() = default;
13 changes: 2 additions & 11 deletions browser/ui/views/side_panel/brave_read_later_side_panel_view.h
Original file line number Diff line number Diff line change
Expand Up @@ -7,28 +7,19 @@
#define BRAVE_BROWSER_UI_VIEWS_SIDE_PANEL_BRAVE_READ_LATER_SIDE_PANEL_VIEW_H_

#include "base/functional/callback_forward.h"
#include "base/scoped_observation.h"
#include "ui/views/view.h"
#include "ui/views/view_observer.h"
#include "brave/browser/ui/views/side_panel/brave_side_panel_view_base.h"

class Browser;

// Gives reading list specific header view with web view.
class BraveReadLaterSidePanelView : public views::View,
public views::ViewObserver {
class BraveReadLaterSidePanelView : public BraveSidePanelViewBase {
public:
BraveReadLaterSidePanelView(Browser* browser,
base::RepeatingClosure close_cb);
~BraveReadLaterSidePanelView() override;
BraveReadLaterSidePanelView(const BraveReadLaterSidePanelView&) = delete;
BraveReadLaterSidePanelView& operator=(const BraveReadLaterSidePanelView&) =
delete;

private:
void OnViewVisibilityChanged(views::View* observed_view,
views::View* starting_view) override;

base::ScopedObservation<views::View, views::ViewObserver> observation_{this};
};

#endif // BRAVE_BROWSER_UI_VIEWS_SIDE_PANEL_BRAVE_READ_LATER_SIDE_PANEL_VIEW_H_
Loading

0 comments on commit 4a53732

Please sign in to comment.