Be able to edit and add "top sites" shown on the Dashboard (new tab page)

[Xyncgas]

Test plan

See brave/brave-core#7859

[HubDanDevMan]

Can you specify what the problem is? And do you mean with Top Site? Do you mean warez FTP servers or do you mean a startpage you made?

[Xyncgas]

let me elaborate.

By top sites I mean the ones that displays during brave's start page, like when you click a new tap or from starting the browsers, now brave puts those sites that you most frequently visits as those little icons like a short cut that you can pin or remove, which I found much useful.

one day I unpinned one, and by accident, and it's gone like south park, and usually there is something that says you can undo if you delete the top sites, it wasn't showing up, so by accident it was gone, and sometimes in december I had this issue with deleting too, the confirmation wasn't showing up, and right after I deleted it by accident while using touch screen, and it's gone. I wish I could edit these short cuts so I can have the freedom to add anysite I want and manage their address etc...... Instead of being stucked to them forever (when you have a lots browsing, don't forget these are the sites that you most frequently visits, so for other sites you want it to be there, I feel like more time is needed to visit them everday in order for them to show up at the start page, which the fact that you got to spam visiting them to get it to the start page is annoying) and no way to get them back after deleting them

[bsclifton]

@Xyncgas thanks for the detailed description; this is something that @cezaraugusto is currently working on 😄 I couldn't find an existing issue for this feature request, so we can use this one

Here's a quick prototype interface that @cezaraugusto put together in a demo. @karenkliu I believe is working on the actual design with @rebron

• Besides having a way to add them (ex: the "+" tile), it would be good to be able to edit ones being shown.
• If a top site is deleted by pressing the X in top right, can there be a better way to restore one single site? For example, maybe a "top sites recycle bin" that can be shown, letting user restore one specific site instead of having to restore ALL of them

[Shudouken]

I would like to see this feature implented as well.
By default the top sites link to the base url for a website, but for youtube I'd like to edit it to take me to my subscriptions feed instead.
Also it's not really clear to me how these top sites are chosen. It would be nice if I could turn that off as well and only add my own sites.
The prototype above looks great!

[CaptainSiberia13]

I agree that this feature needs to be a priority. I just started using Brave as it was recommended by a friend. I like the browser, but miss the speed-dial on my old "Opera" browser. Adding that sort of home page functionality would be great!

[rwilliams]

This new tab plugin has some killer features along these lines. Editable favorites, adjustable rows, columns. Folders for favorites and pages similar to iOS and Android.

https://chrome.google.com/webstore/detail/infinity-new-tab-pro/nnnkddnnlpamobajfibfdgfnbcnkgngh

I was using this in the past but now that we're getting paid to look at the new tab page it'd be nice to have more features.

[Vantiveman]

I agree completely with the above. The ability to edit/add/change number of top sites would be extremely useful. It's annoying when one that I'm sure was pinned (as I pin all six, which seems to be the max) was suddenly replaced by another site that I had just used.
The layout/positioning/number of top sites should all be configurable options. It this is already being worked on as seems to be the case - Great! and thank you. I'm having a great experience with Brave, but this one aspect is a bit of a spoiler.

[Xyncgas]

let's make our browser to an operating system...
wait WHOOA GOOGLE ?
We can't just use extensions though, it's essential and gotta be open source and staying alive, I mean it'd really makes me feel the freedom if I get to laugh at people how they are stuck in their home page

[rwilliams]

We get paid money to use this new tab page. It would be nice if it has some of the features that many new tab page extensions have. We're just talking about editable favorites here.

[finseiz]

We need this!!!! almost 8 months since this issue was created

[Xyncgas]

I totally think I can write codes, only if there's a way for me to get my hands on the dirt and make things change, I would really wanna do it and now I am still not even one foot in the doorway for writing patches for open source projects I've gotta start doing it

[water-chip]

I made an account just so I could post in this thread. This is so ridiculous. Could you PLEASE add this extremely basic function to Brave already? It's been EIGHT MONTHS since this thread started. What tf is this, internet explorer 8? It's starting to feel that way. Get your sh** together, ffs.

[shunting65]

How about a choice in history, to add this entry as a top site? No doubt someone has navigated to a site they are interested in.

[bsclifton]

Awesome job @simonhong! This is live now in Nightly - it includes designs by @karenkliu with help from @rebron 😄

This has been a long time coming - I really hope everybody enjoys this one 😄

This will be live on Release channel April 13th. Feedback extremely welcome as this goes from Nightly to Beta

[claudioluciano]

First of all, thanks for this feature!

It would be nice if we could add more than 12 sites.
Another point i think the sites are not saved as bookmark, it would be nice if they are bookmarked as well.

[rhinounicorn]

This is awesome. I recently started using Brave and have been wanting something like this. I also agree with @claudioluciano that we should be able to add more than 12 sites. Somethings as customizable as that extension that @rwilliams posted would be really nice. Thanks for the great work though!

[rwilliams]

@bsclifton Do the top sites get synced? I love it, have been testing it on nightly. It's simple and clean and gets the job done.

[stephendonner]

Verified PASSED using the testplan in brave/brave-core#7859 and the (internal) spec.

Brave	1.23.25 Chromium: 89.0.4389.86 (Official Build) nightly (x86_64)
Revision	0c2dac31bc21e806a791641316e99920f84ea52c-refs/branch-heads/4389@{#1472}
OS	macOS Version 11.2.3 (Build 20D91)

Areas covered:

1. Blank by default:

• Verified with a new profile that the Top Sites widget is blank, default

screenshot

2. Dark and light themes:

• Verified that UI elements were appropriately themed to their dark and light-theme counterparts

screenshots

3. Frequently Visited sites:

• verified context-menu items, from clicking ellipsis ..., which appears on hover, to the upper-right of the Top Sites widget

screenshot

• verified a max of the top 6, fills in from the right (and orders by comparing number of sites visits, importantly), replacing older (less-visited) ones on the left

screenshot

4. Favorite sites:

• Verified context-menu items from ellipsis

screenshot

• Verified Add site appears when fewer than 12 sites are populated

screenshot

• verified max of 12 Favorite sites; Add site disappears when we reach 12 sites

screenshot

5. Drag and Drop (to reorder):

• Verified that dragging and dropping allows the user to reorder the Top Sites dynamically

screencast

6. Add site:

• Verified successfully added site name and its URL (CNN, https://www.cnn.com)

screenshots

7. Edit site:

• Verified successfully renamed site and changed its URL (weather.com -> accuweather.com)

screencast

8. Remove (site), Undo, Restore all

• Verified (separately) successfully removed both Favorite and Frequently Visited sites
• Verified successfully undid removal; site was re-populated, using Undo
• Verified successfully restored all deleted sites, using Restore all

screencast

9. Hiding and restoring both Top Sites widgets

• Verified the user can Hide the entire Top Sites widget
• Verified user can then Restore using Customize -> Top Sites -> and then clicking to choose either Favorites or Frequently Visited

screencast

10. Upgrade/migration from 1.22.x

• Verified seeding 1.22.71 profile with 13 Favorites and updating to 1.23.58 retained all 13 Favorites, and only displayed 12 in the new-tab page, as expected

1.22.71	1.23.58

• Verified order of Favorites displayed in original 1.22.71 profile was persisted when updating to 1.23.58 on the new-tab page
• Verified all links were correct/worked
• titles and site icons/favicons were correct

==========
Known issues:

• editing a Frequently Visited site doesn't apply changes, and changes display mode to Favorites (Changes made via Edit site for Frequently Visited site don't persist #14606)
• newly-added sites don't get a favicon until they're loaded (Newly added site doesn't fetch favicon until the site is visited  #14481)
• difficult to read site names against white backgrounds in the new-tab page (Custom favourites names not visible on certain NTP images #14484)
• newly-added Frequently Visited sites don't always dynamically populate the new-tab page (After Frequently Visited sites reaches max of 6, need to open new tab to see site replace #14607)

---

Verification passed on

Brave | 1.23.59 Chromium: 89.0.4389.114 (Official Build) dev (64-bit)
-- | --
Revision | 1ea76e193b4fadb723bfea2a19a66c93a1bc0ca6-refs/branch-heads/4389@{#1616}
OS | Windows 10 OS Version 2004 (Build 19041.867)

• Verified the test plan from Improve topsite tiles in NTP brave-core#7859

####################### Clean profile########################

• Ensured that Top Sites widget is blank by default in NTP

Screenshot

Dark and Light themes

• Verified that UI elements were appropriately themed to their dark and light-theme counterparts

Screenshots

Light theme:

Dark Theme:

Top sites context-menu items

• Verified context menu items for top sites in NTP
• Verified Add site option appears in the context menu when fewer than 12 sites are populated
• Verified max of 12 Favorite sites can be added and the Add site option disappears when we reach 12 sites
• Verified click on 3dot menu ... displays Show frequently visited sites, Show favorites and Hide top sites context menu items in NTP

Screenshots

context-menu item - Add sites

• Verified Top sites can be added via Add sites context menu from ... menu
• Verified Top sites can be added via + /Add sites menu from NTP
• Verified that the Add site popup modal is displayed with Name and URL fields
• Verified after entering Name and URL, click on save created the top sites and added top sites is shown in the NTP
• Open multiple windows and ensure that added top sites appear in all the windows
• Restart the browser and ensured that added top sites are retained in all the opened windows
• Verified click on Cancel won't create the top sites

Screenshots

Show favorites and show frequently visited

• Add few top sites in NTP and ensure that click on 3 dot menu ... shows the context menu option Show favorites as by default shown frequently visited sites settings is selected in Top sites settings in customize dashboard settings
• Click on Show favorites in 3 dot menu ... and ensured that Show frequently visited settings is shown in the context menu
• Open customize dashboard settings and ensured that the Favorites widget is selected
• Restart the browser and ensure that context menu items are retained in NTP
• Toggle the Show frequently visited settings in 3dot menu ... and ensured that Show favorites is shown in the context menu and ensured Frequently Visited settings are selected in dashboard settings

Screenshots

Edit/Remove top sites

• Verified that mouse hover on the top sites shown the Edit/Remove options
• Verified click on Edit displays the Edit site popup modal
• Verified that Top sites can be edited and edited name or url is shown in the top sites
• Verified that top sites can be removed, after removing the top site is removed and not listed in the NTP
• Restart the browser and ensured that removed top sites are not re-appeared in NTP
• Add few Top sites in NTP in 1st window and open a second window and ensure the added top sites appear in 2nd window
• Edit the top sites in 2nd window and ensured changes reflected in 1st window
• Restart the browser and ensured that changes are retained in both the windows

Screenshot

Undo/Restore all

• Verified (separately) successfully removed both Favorite and Frequently Visited sites
• successfully undid removal; site was re-populated, using Undo
• Verified successfully restored all deleted Frequently visited top sites, using Restore all
• Verified Restore all options isn't shown after removing Favorites top site

Screenshot

Drag and Drop

• Verified that dragging and dropping of Favorite sites allows the user to reorder the Top Sites dynamically
• Verified that Frequently visited top sites cannot be dragged and dropped in NTP

screencast

Hide top sites

• Verified click on 3 dot menu ... shows the Hide top site context menu option
• Verified click on hide top sites hides all the top sites from the NTP
• Restart the browser and ensured hidden top sites are not re-appeared in NTP
• Open a new window and ensure top sites are hidden in new window also
• Verified Top sites switch becomes OFF in Customize dashboard settings modal popup
• Enable the Top sites switch in dashboard settings and ensured that the Frequently Visited widget is selected and frequently visited sites are shown in the NTP
• Select the Favorites widget from dashboard settings and ensured all the favorites top sites are shown in the NTP

Screenshots

Frequently visited settings

• Verified Frequently Visites settings is enabled by default when Top sites are not added in the NTP
• Add few Top sites and come back to customize dashboard top site settings and ensured that Frequently Visites settings is still enabled
• Select Favorites settings in the dashboard customize top site settings and ensured that + Add site option is added next to the added top sites in the NTP
• Toggle Frequently Visites settings and ensured + Add site option is removed from the top sites in the NTP

Screenshots

Favorites settings

• In a clean profile, navigate to cutomoze dashboard settings and select Favorites widget and ensured + Add sites option is added in NTP
• Add few Top sites and come back to customize dashboard top site settings and ensured that Favorites settings is still enabled
• Restart the browser and ensured that Favorites settings is still enabled in customize dashboard top site settings

Screenshots

Top sites switch

• Verified Top sites switch is ON by default in Customize Dashboard settings
• Add few top sites and restart the browser and ensured that Top sites switch is still ON in the Customize Dashboard settings
• Open a new window and navigate to Customize Dashboard settings and turn OFF the Top sites switch and ensure that Top sites are hidden from NTP
• Open the default window and ensure that top sites are hidden from there as well and Top sites switch is OFF in default window as well
• Restart the browser and ensured that Top sites settings are retained in both windows (Top site switch is OFF)

Screenshots

####################### Upgrade profile########################

• Installed 1.22.52 added few Top sites and upgraded profile to 1.23.59 and ensured top sites are retained in NTP
• Restart the browser and ensure that Top sites retained in the NTP
• Verified context menu items display after upgrade to 1.23.59
• Verified that new Top sites can be added into NTP after upgrade
• Verified that added Top sites can be removed from NTP after upgrade
• Restart the browser and ensured removed sites are not re-appeared in NTP
• Installed 1.22.52 added few Top sites and hidden the top sites and upgraded the profile to 1.23.59 and ensured that Top sites are still hidden after the upgrade

Screenshots

Before upgrade:

After upgrade:

========== Issues encountered:

• editing a Frequently Visited site doesn't apply changes, and changes display mode to Favorites (Changes made via Edit site for Frequently Visited site don't persist #14606 (comment))
• newly-added sites don't get a favicon until they're loaded (Newly added site doesn't fetch favicon until the site is visited  #14481)
• Customize Dashboard modal window heading text not visible in dark theme ([Desktop] Customize Dashboard modal window heading text not visible in dark theme - follow up to 14754 #14785)
• Custom favourites names not visible on certain NTP images (Custom favourites names not visible on certain NTP images #14484)
• newly-added Frequently Visited sites don't always dynamically populate the new-tab page (After Frequently Visited sites reaches max of 6, need to open new tab to see site replace #14607)
• Site-icon's focus ring is too tall, and is clipped beneath the site icon below it (Site-icon's focus ring is too tall, and is clipped beneath the site icon below it #14802)

---

Verification PASSED on Ubuntu 20.04 x64 using the following build:

Brave | 1.23.69 Chromium: 90.0.4430.61 (Official Build) (64-bit)
--- | ---
Revision | dced74d4124b26b14126b611853d33512b60c7b6-refs/branch-heads/4430@{#1115}
OS | Linux

Clean Profile Tests/Cases

Ensured that the Top Sites widget on NTP is completely blank on a new install/profile

Screenshot/Example

Dark and Light themes Tests/Cases

Light Theme Screenshot/Example

Light Theme Example	Light Theme Example	Light Theme Example

Dark Theme Screenshot/Example

Dark Theme Example	Dark Theme Example	Dark Theme Example

GTK Theme Screenshot/Example

GTK Theme Example	GTK Theme Example	GTK Theme Example

Top Sites context-menu Tests/Cases

• ensured that pressing clicking on ... correctly opens the Top Sites context menu
• ensured that Add Site opens the Add Sites modal
• ensured that switching between Show frequently visited & Show favorites works as expected
• ensured that you add websites via Favorites when there's less than 12 websites
• ensured that Add Site is removed from NTP & the context menu when there's 12 favorite websites

Context Menu Screenshot/Example

Context Menu	Show frequently visited	Show favorites

Less than 12 Favs	More than 12 Favs

Adding Favorites

• ensure that you can add a website by via Add Site on both NTP & the context menu
• ensured that you can type in a Name & Address without any issues
• ensured that pressing on Save correctly saves the website on the NTP
• ensured that pressing Cancel correctly closes the Add Site modal and doesn't add anything into NTP
• ensured that changes are correctly propagated to other opened NTP tabs
• ensured that the current state is currently retained when restarting the browser several times

Show favorites & Show frequently visited

• ensured that toggling between Show favorites & Frequently Visited works as expected
• ensured that the context menu is correctly displaying either Show favorites & Frequently Visited as the selected option
• ensured that each option (both Show favorites & Frequently Visited) are retained when restarting the browser
• ensured that switching between both Show favorites & Frequently Visited works as expected via Customize Dashboard
• ensured that Customize Dashboard appears as Show favorites when selected via the context menu under NTP
• • ensured that Customize Dashboard appears as ``Frequently Visited` when selected via the context menu under NTP

Context Menu Screenshot/Example

Show frequently visited	Show favorites

Edit/Remove

• ensured that the hover over entries displays the Edit button under both Show favorites & Frequently Visited
• ensured that clicking on the Edit icon opens a context menu with both Edit site & Remove
• ensured that you can edit both the Name & URL
• ensured that you can remove entries from Top Sites and they don't re-appear once removed
• ensured that you can re-add removed sites from Show favorites
• ensured that the current state is currently retained when restarting the browser several times

Drag and Drop

• ensured that dragging & dropping while Show favorites is selected works without any issues
• ensured that there's no noticeable jank/lag when dragging & dropping
• ensured that changes are propagated into other NTP windows
• ensured that you cannot drag/drop while Frequently Visited is selected

Undo/Restore All

• ensured that you can restore a removed websites while having Frequently visited via Restore & Restore All
• ensured that Restore All isn't available when removing a website while having Show favorites selected as the default view

Upgraded Profiles

• installed 1.22.71 CR 89.0.4389.114 and added several top sites, upgraded to 1.23.69 CR: 90.0.4430.61 and ensured that the sites are retained/visible under NTP
• Went through all of the above and ensured that all the context menu items/settings were working as expected
• ensured that you can remove/re-add websites
• ensured that restarting the browser several times retains the current state of Top Site/NTP

[bsclifton]

@rwilliams the top sites are not synced... yet! That would be a cool feature 😄 If we treated them (in favorites mode) as bookmarks, it would be quite easy to sync across all platforms (and that would cover concern by @claudioluciano)
cc: @rebron (not sure if we have an issue for that? wasn't able to find one - but could be cool to sync to iOS Favorites / sites on Android NTP)

@claudioluciano there is an issue for larger number of top site tiles which you can track here (subscribe, give thumbs up!):
#6619

[WriterDad]

Is there any news on when the top sites issue will be remedied for Windows? I'd mistakenly thought that March 23rd was when it would be implemented via update, but upon re-reading it, I see it was for a release channel?

Thanks for any insight.

[bsclifton]

@WriterDad March 23rd we did have an update to 1.22 - our next major release version (1.23) has the new top sites functionality in it 😄 That will be going out April 13th

Would be great for someone to confirm - but I believe top sites will now sync across your Desktop instances. We might be able to pull in that same work for Android too (and then eventually iOS too)

[WriterDad]

Very strange. I've been on Brave up on my Windows every day this week week and it hasn't indicated there's an update. I was prompted for that on my Mac a day or two ago, but honestly it had been so long since I'd sat down to use Brave there I thought it may've been overdue for even the previous update.

The About info says I'm at 1.21.77 but is checking for updates as I type...

...

... just finished and says I'm "nearly up to date"?
Hmm.

I'll relaunch and see what that does.

[WriterDad]

1.22.67 is what it bumped me up to. I'll take a look at how the top sites behave and get back here if needed.

Thanks!

[WriterDad]

@bsclifton The top sites still don't seem to be working properly for me.

Upon my forcing the update mentioned above, I deleted three of the six top sites that were showing at the time to allow for newly visited sites to populate the slots.

Left in the first three slots--this matters for a point later--were: My own site (accurate anyway), Google Maps (I have two persistent tabs open for some writing I'm doing, so again, accurate), and ProtonMail (usually open all the time, so accurate). The last three were wide open for whatever Brave wanted to populate them with.

Since then I've only opened one new tab for the Mastodon social media site, plus then a new one in the last few minutes to check on what the top sites were looking like.

The result? My first three sites are remaining intact, but now the second set of three are, in order: Global News live streaming (I'd gone to a video there weeks ago but haven't since, and there's no tabs open with Global News currently, but that's been a recurring top site regardless), then Brave itself (which I guess makes sense, as I'm in the default Brave environment page when I open a new tab and did that twice), and then Google Maps again (which is odd, since a) it was already among the previous three sites, and b) I didn't go to the Google Maps tab nor open a new one for it).

Any suggestions for how to give the top sites a bit of a poke in the hopes they start behaving? I'm happy to wipe them all clear, but given what's popped up into the last three slots when they were empty, I don't know if that'll do much.

Thanks again.

[WriterDad]

@bsclifton @simonhong Update on my top sites populating: One of the open three slots (see above for why only three) populated with a site I went to a couple of times yesterday and once this morning. Which makes sense, though oddly the Mastodon Social website, which I'm on regularly and sometimes at length, hasn't come up in those top sites in probably a couple of months. It did briefly, several weeks back, but then disappeared again, and hasn't been back since.
A site I was on two times yesterday, however, did show up in the top sites. Twice, actually. It's currently taking up two of those three slots.

Related: To try to both kick one of those repeated ones loose and to get Mastodon to show up again, I just opened a new tab to get onto Mastodon, then closed it and loaded up a new tab with it, four times in a row. The place I visited twice yesterday was reduced to one slot, but the other wasn't taken by Mastodon--I'm very curious why it isn't showing up in top sites at all lately--but now two of the three slots are taken up with Github, despite it not being in any slots at all this morning and my only loading it up once in one tab to log on and post this update.

Conclusion: The changes made to the top sites seems to definitely be paying more attention to what are actually recently (although that more than frequently) used websites, but not to all (e.g. Mastodon), and the ones it is paying to will at times be doubled up in multiple top sites slots.
Hoping that can be addressed soon.

All the best.

[bsclifton]

@WriterDad the improvements mentioned are only in version 1.23. Basically, this new add/edit top sites feature is on [https://brave.com/download-beta](Beta channel) at the moment and for release channel (what you're on) it's is looking at an April 13th release

If you wanna see how it looks, you can definitely try it with Beta - but Beta channel uses a different profile... so you won't have any bookmarks, etc. The best thing to do would be wait until it lands on release channel 😄

With the changes I made a while back, the "frecency" (how often you visit, when it was recently visited) algorithm used to pick the most visited sites is now exactly the same as Chromium. We don't have any plans of changing that

[TechnoRobert]

Looks as if people have been complaining about this since roughly the week that COVID-19 was discovered. I updated Brave a day or two ago (to 1.22.70), and I still don't see how to add a Top Site to the New Tab page. Still looking for the solution...

[simonhong]

@TechnoRobert I think you're using previous version. Current stable version is 1.23.71 and this topsite editing feature is available since 1.23.x.

[crabtreeak]

I am not sure why there is an artificial limit of 12 sites on this favorite sites speed dial. My new tab window has room for more than double that. Can we have the option to add more than 12? This feature other than that is wonderful with a great GUI interface. Thanks!

I just converted over to this Brave browser. It works great.

[DarrenSem]

The ANDROID app needs this feature! I accidentally clicked Remove on a frequent site and now it thinks I wanted it permanently hidden from the list :-(

#17217