Merge pull request #4996 from brave/bsc-revert-dnd

Revert "Merge pull request #4325 from brave/ca-2971"

components/brave_new_tab_ui/actions/new_tab_actions.ts

@@ -1,7 +1,6 @@
-// Copyright (c) 2020 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 http://mozilla.org/MPL/2.0/.
+/* 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 http://mozilla.org/MPL/2.0/. */
 
 import { action } from 'typesafe-actions'
 
@@ -12,6 +11,56 @@ import { Stats } from '../api/stats'
 import { PrivateTabData } from '../api/privateTabData'
 import { InitialData, InitialRewardsData, PreInitialRewardsData } from '../api/initialData'
 
+export const bookmarkAdded = (url: string) => action(types.BOOKMARK_ADDED, {
+  url
+})
+
+export const bookmarkRemoved = (url: string) => action(types.BOOKMARK_REMOVED, {
+  url
+})
+
+export const sitePinned = (url: string) => action(types.NEW_TAB_SITE_PINNED, {
+  url
+})
+
+export const siteUnpinned = (url: string) => action(types.NEW_TAB_SITE_UNPINNED, {
+  url
+})
+
+export const siteIgnored = (url: string) => action(types.NEW_TAB_SITE_IGNORED, {
+  url
+})
+
+export const undoSiteIgnored = (url: string) => action(types.NEW_TAB_UNDO_SITE_IGNORED, {
+  url
+})
+
+export const undoAllSiteIgnored = (url: string) => action(types.NEW_TAB_UNDO_ALL_SITE_IGNORED, {
+  url
+})
+
+export const siteDragged = (fromUrl: string, toUrl: string, dragRight: boolean) => action(types.NEW_TAB_SITE_DRAGGED, {
+  fromUrl,
+  toUrl,
+  dragRight
+})
+
+export const siteDragEnd = (url: string, didDrop: boolean) => action(types.NEW_TAB_SITE_DRAG_END, {
+  url,
+  didDrop
+})
+
+export const onHideSiteRemovalNotification = () => action(types.NEW_TAB_HIDE_SITE_REMOVAL_NOTIFICATION)
+
+export const bookmarkInfoAvailable = (queryUrl: string, bookmarkTreeNode: NewTab.Bookmark) => action(types.NEW_TAB_BOOKMARK_INFO_AVAILABLE, {
+  queryUrl,
+  bookmarkTreeNode
+})
+
+export const gridSitesUpdated = (gridSites: NewTab.Site[]) => action(types.NEW_TAB_GRID_SITES_UPDATED, {
+  gridSites
+})
+
 export const statsUpdated = (stats: Stats) =>
   action(types.NEW_TAB_STATS_UPDATED, {
     stats

components/brave_new_tab_ui/api/getActions.ts

@@ -1,22 +1,19 @@
-// Copyright (c) 2020 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 http://mozilla.org/MPL/2.0/.
+/* 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 http://mozilla.org/MPL/2.0/. */
 
 import { bindActionCreators } from 'redux'
 import * as newTabActions from '../actions/new_tab_actions'
-import * as gridSitesActions from '../actions/grid_sites_actions'
 import store from '../store'
 
 /**
  * Get actions from the C++ back-end down to front-end components
  */
-let actions: typeof newTabActions & typeof gridSitesActions
+let actions: typeof newTabActions
 export default function getActions () {
   if (actions) {
     return actions
   }
-  const allActions = Object.assign({}, newTabActions, gridSitesActions)
-  actions = bindActionCreators(allActions, store.dispatch.bind(store))
+  actions = bindActionCreators(newTabActions, store.dispatch.bind(store))
   return actions
 }

components/brave_new_tab_ui/api/initialData.ts

@@ -13,7 +13,7 @@ export type InitialData = {
   preferences: preferencesAPI.Preferences
   stats: statsAPI.Stats
   privateTabData: privateTabDataAPI.PrivateTabData
-  topSites: chrome.topSites.MostVisitedURL[]
+  topSites: topSitesAPI.TopSitesData,
   brandedWallpaperData: undefined | NewTab.BrandedWallpaper
 }
 

components/brave_new_tab_ui/api/topSites/bookmarks.ts

@@ -0,0 +1,39 @@
+/* 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 http://mozilla.org/MPL/2.0/. */
+
+import getActions from '../getActions'
+
+/**
+ * Obtains the URL's bookmark info and calls an action with the result
+ */
+export const fetchBookmarkInfo = (url: string) => {
+  chrome.bookmarks.search(url.replace(/^https?:\/\//, ''),
+    (bookmarkTreeNodes) => getActions().bookmarkInfoAvailable(url, bookmarkTreeNodes[0] as NewTab.Bookmark)
+  )
+}
+
+/**
+ * Updates bookmark info for top sites based on their state
+ */
+export const updateBookmarkInfo = (state: NewTab.State, url: string, bookmarkTreeNode?: NewTab.Bookmark) => {
+  const bookmarks = state.bookmarks
+  const gridSites = state.gridSites.slice()
+  const topSites = state.topSites.slice()
+  const pinnedTopSites = state.pinnedTopSites.slice()
+  // The default empty object is just to avoid null checks below
+  const gridSite: Partial<NewTab.Site> = gridSites.find((s) => s.url === url) || {}
+  const topSite: Partial<NewTab.Site> = topSites.find((s) => s.url === url) || {}
+  const pinnedTopSite: Partial<NewTab.Site> = pinnedTopSites.find((s) => s.url === url) || {}
+
+  if (bookmarkTreeNode) {
+    bookmarks[url] = bookmarkTreeNode
+    gridSite.bookmarked = topSite.bookmarked = pinnedTopSite.bookmarked = bookmarkTreeNode
+  } else {
+    delete bookmarks[url]
+    gridSite.bookmarked = topSite.bookmarked = pinnedTopSite.bookmarked = undefined
+  }
+  state = { ...state, bookmarks, gridSites }
+
+  return state
+}

components/brave_new_tab_ui/api/topSites/dnd.ts

@@ -0,0 +1,42 @@
+/* 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 http://mozilla.org/MPL/2.0/. */
+
+import * as gridAPI from './grid'
+
+export const onDraggedSite = (state: NewTab.State, url: string, destUrl: string) => {
+  const gridSitesWithoutPreview = gridAPI.getGridSites(state)
+  const currentPositionIndex = gridSitesWithoutPreview.findIndex(site => site.url === url)
+  const finalPositionIndex = gridSitesWithoutPreview.findIndex(site => site.url === destUrl)
+  let pinnedTopSites = state.pinnedTopSites.slice()
+
+  // A site that is not pinned yet will become pinned
+  const pinnedMovingSite = pinnedTopSites.find(site => site.url === url)
+  if (!pinnedMovingSite) {
+    const movingTopSite = Object.assign({}, gridSitesWithoutPreview.find(site => site.url === url))
+    movingTopSite.index = currentPositionIndex
+    movingTopSite.pinned = true
+    pinnedTopSites.push(movingTopSite)
+  }
+
+  pinnedTopSites = pinnedTopSites.map((pinnedTopSite) => {
+    pinnedTopSite = Object.assign({}, pinnedTopSite)
+    const currentIndex = pinnedTopSite.index
+    if (currentIndex === currentPositionIndex) {
+      pinnedTopSite.index = finalPositionIndex
+    } else if (currentIndex > currentPositionIndex && pinnedTopSite.index <= finalPositionIndex) {
+      pinnedTopSite.index = pinnedTopSite.index - 1
+    } else if (currentIndex < currentPositionIndex && pinnedTopSite.index >= finalPositionIndex) {
+      pinnedTopSite.index = pinnedTopSite.index + 1
+    }
+    return pinnedTopSite
+  })
+  state = { ...state, pinnedTopSites }
+  state = { ...state, gridSites: gridAPI.getGridSites(state) }
+  return state
+}
+
+export const onDragEnd = (state: NewTab.State) => {
+  state = { ...state, gridSites: gridAPI.getGridSites(state) }
+  return state
+}

components/brave_new_tab_ui/api/topSites/grid.ts

@@ -0,0 +1,60 @@
+/* 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 http://mozilla.org/MPL/2.0/. */
+
+// API
+import getActions from '../getActions'
+import * as bookmarksAPI from './bookmarks'
+import { getCharForSite } from '../../helpers/newTabUtils'
+
+// Utils
+import { debounce } from '../../../common/debounce'
+
+export const getGridSites = (state: NewTab.State, checkBookmarkInfo?: boolean) => {
+  const sizeToCount = { large: 18, medium: 12, small: 6 }
+  const count = sizeToCount[state.gridLayoutSize || 'small']
+  const defaultChromeWebStoreUrl = 'https://chrome.google.com/webstore'
+
+  // Start with top sites with filtered out ignored sites and pinned sites
+  let gridSites = state.topSites.slice()
+  .filter((site) =>
+    !state.ignoredTopSites.find((ignoredSite) => ignoredSite.url === site.url) &&
+    !state.pinnedTopSites.find((pinnedSite) => pinnedSite.url === site.url) &&
+    // see https://github.com/brave/brave-browser/issues/5376
+    !site.url.startsWith(defaultChromeWebStoreUrl)
+  )
+
+  // Then add in pinned sites at the specified index, these need to be added in the same
+  // order as the index they are.
+  const pinnedTopSites = state.pinnedTopSites
+    .slice()
+    .sort((x, y) => x.index - y.index)
+  pinnedTopSites.forEach((pinnedSite) => {
+    gridSites.splice(pinnedSite.index, 0, pinnedSite)
+  })
+
+  gridSites = gridSites.slice(0, count)
+  gridSites.forEach((gridSite: NewTab.Site) => {
+    gridSite.letter = getCharForSite(gridSite)
+    gridSite.thumb = `chrome://thumb/${gridSite.url}`
+    gridSite.favicon = `chrome://favicon/size/64@1x/${gridSite.url}`
+    gridSite.bookmarked = state.bookmarks[gridSite.url]
+
+    if (checkBookmarkInfo && !gridSite.bookmarked) {
+      bookmarksAPI.fetchBookmarkInfo(gridSite.url)
+    }
+  })
+  return gridSites
+}
+
+/**
+ * Calculates the top sites grid and calls an action with the results
+ */
+export const calculateGridSites = debounce((state: NewTab.State) => {
+  // TODO(petemill):
+  // Instead of debouncing at the point of reducing actions to state,
+  // and having the reducer call this, it may be more understandable
+  // (and performant) to have this be a selector so that the calculation
+  // is only performed when the relevant state data is changed.
+  getActions().gridSitesUpdated(getGridSites(state, true))
+}, 10)

components/brave_new_tab_ui/api/topSites.ts → components/brave_new_tab_ui/api/topSites/index.ts

@@ -1,14 +1,16 @@
-// Copyright (c) 2020 The Brave Authors. All rights reserved.
+// Copyright (c) 2019 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 http://mozilla.org/MPL/2.0/.
 
+export type TopSitesData = NewTab.Site[]
+
 /**
  * Obtains the top sites
  */
-export function getTopSites (): Promise<chrome.topSites.MostVisitedURL[]> {
+export function getTopSites (): Promise<TopSitesData> {
   return new Promise(resolve => {
-    chrome.topSites.get((topSites: chrome.topSites.MostVisitedURL[]) => {
+    chrome.topSites.get((topSites: NewTab.Site[]) => {
       resolve(topSites || [])
     })
   })

components/brave_new_tab_ui/apiEventsToStore.ts

@@ -38,8 +38,6 @@ export function wireApiEventsToStore () {
       setRewardsFetchInterval()
     }
     getActions().setInitialData(initialData)
-    getActions().setFirstRenderGridSitesData(initialData)
-    getActions().updateGridSitesBookmarkInfo(initialData.topSites)
     // Listen for API changes and dispatch to store
     statsAPI.addChangeListener(updateStats)
     preferencesAPI.addChangeListener(updatePreferences)