New Tab Page favorites section #3083

dus7 · 2024-07-15T17:16:47Z

Task/Issue URL: https://app.asana.com/0/72649045549333/1207806244251268/f
Tech Design URL:
CC:

Description:
Favorites section ported to SwiftUI, integrated with New Tab Page. See figma for design details.

Steps to test this PR:
-- Enable NTP Sections in debug menu --

Single row of favorites placeholders is visible if there are no favorites.

Add a few favorites and verify the following:

Collapse/expand button is not visible when there is less than 2 rows of favorites.
Tapping a favorite opens it in current tab.
Long-pressing a favorite opens context menu with Edit and Delete - verify both actions work.
On landscape and iPad there are 6 columns of favorites.
Pixels are sent on:
1. opening favorite (regular and daily)
2. deleting favorite
3. editing favorite
4. opening NTP (regular and daily)

Definition of Done (Internal Only):

Does this PR satisfy our Definition of Done?

Copy Testing:

Use of correct apostrophes in new copy, ie ’ rather than '

Orientation Testing:

Portrait
Landscape

Device Testing:

OS Testing:

iOS 15
iOS 16
iOS 17

Theme Testing:

Light theme
Dark theme

Internal references:

Software Engineering Expectations
Technical Design Template

github-actions · 2024-07-15T17:34:29Z

	Warnings
⚠️	PR has more than 500 lines of code changing. Consider splitting into smaller PRs if possible.

Generated by 🚫 dangerJS against 713471c

dus7 · 2024-07-16T14:32:47Z

DuckDuckGo/Favorite.swift

+    var menuTitle: String {
+        [title, truncatedUrlString].compactMap { $0 }.joined(separator: "\n")
+    }
+
+    private var truncatedUrlString: String? {
+        guard let url = urlObject?.absoluteString else { return nil }
+        let urlString = url.prefix(100).description
+        let ellipsis = url.count != urlString.count ? "…" : ""
+        return urlString + ellipsis
+    }


Copied from FavoritesHomeViewSectionRenderer.

dus7 · 2024-07-16T14:35:13Z

DuckDuckGo/FavoriteItemView.swift

+                    onFaviconMissing: onFaviconMissing
+                )
+            )
+            .contextMenu {


It's defined here just because there's no way to provide previews for context menu for iOS 15. This way only icon view is lifted. Downside is that only pressing on icon area allows to enter a context menu.

dus7 · 2024-07-16T14:39:02Z

DuckDuckGo/FavoritesDefaultModel.swift

+    var displayTitle: String {
+        if let title = title?.trimmingWhitespace(), !title.isEmpty {
+            return title
+        }
+
+        if let host = urlObject?.host?.droppingWwwPrefix() {
+            return host
+        }
+
+        assertionFailure("Unable to create display title")
+        return ""
+    }
+
+    var host: String {
+        return urlObject?.host ?? ""
+    }


Copied from FavoriteHomeCell.

dus7 · 2024-07-16T14:41:27Z

DuckDuckGo/FavoritesView.swift

 import SwiftUI

-struct FavoritesView: View {
+struct FavoritesView<Model: FavoritesModel>: View {


Making the view generic is the only way I can have a model that is behind an abstraction and use ObservedObject wrapper.

dus7 · 2024-07-16T14:43:39Z

DuckDuckGo/NewTabPageView.swift

-                // MARK: Favorites
-                if favoritesModel.isEmpty {
-                    FavoritesEmptyStateView()
+        GeometryReader { proxy in


I need that to expand scroll content height to at least the height of the scroll view.

dus7 · 2024-07-16T14:45:39Z

DuckDuckGo/ShortcutItemView.swift

-                .daxCaption()
+                .font(Font.system(size: 12))


Font used for caption is more compressed and wasn't looking good.

dus7 · 2024-07-17T14:58:20Z

DuckDuckGo/DeviceOrientationEnvironmentValue.swift

+extension EnvironmentValues {
+    var isLandscapeOrientation: Bool {
+        self[DeviceOrientationHolderKey.self].deviceOrientation.isLandscape
+    }
+
+    var deviceOrientation: UIDeviceOrientation {
+        self[DeviceOrientationHolderKey.self].deviceOrientation
+    }
+}


I assume this can be beneficial for everyone working with SwiftUI, so I defined it system-wide.

brindy

LGTM:

1/ Button animation when expanding collapsing might need to be looked at
2/ Tab details are missing and keyboard setting not respected but will get those in follows, they still work when the feature is off

dus7 · 2024-07-18T14:32:04Z

Thanks! For reference I created follow-up tasks here.

# By Mariusz Śpiewak (2) and others # Via GitHub * main: Remove print (#3101) Update Package.resolved file (#3102) New Tab Page favorites section (#3083) Properly compare actual value of the entitlement check (#3100) fix ui tests broken by new onboarding and use shared setup flow (#3081) # Conflicts: # DuckDuckGo.xcodeproj/project.xcworkspace/xcshareddata/swiftpm/Package.resolved

* main: Bump submodules/privacy-reference-tests from `a242bf0` to `afb4f61` (#3096) Updates BSK to 171.2.3 Remove print (#3101) Update Package.resolved file (#3102) New Tab Page favorites section (#3083) Properly compare actual value of the entitlement check (#3100) fix ui tests broken by new onboarding and use shared setup flow (#3081)

# By Christopher Brind (9) and others # Via Chris Brind (1) and GitHub (1) * main: (48 commits) Reduce VPN manager instances (#3097) Update BSK for Mac RMF changes (#3107) [DuckPlayer] 7- Open Settings (#3110) [DuckPlayer] 6 - Init updates and Watch on YouTube (#3066) New Tab Page Shortcuts section (#3104) Fix VPN configuration removal to stop the tunnel (#3099) avoid resizing webview when keyboard shows/hides (#3094) Add support for skipping sending usage pixels for remote messages (#3106) Bump submodules/privacy-reference-tests from `a242bf0` to `afb4f61` (#3096) Updates BSK to 171.2.3 Remove print (#3101) Update Package.resolved file (#3102) New Tab Page favorites section (#3083) Properly compare actual value of the entitlement check (#3100) fix ui tests broken by new onboarding and use shared setup flow (#3081) AdHoc lane: Make proper assignment to variable (#3095) Expand AdHoc build workflow, add debug bookmarks screen (#3086) Update BSK to latest - for macOS fix to AdAttribution (#3084) Revert "Fix tests" Fix tests ... # Conflicts: # DuckDuckGo.xcodeproj/project.pbxproj # DuckDuckGo.xcodeproj/project.xcworkspace/xcshareddata/swiftpm/Package.resolved # DuckDuckGo/NetworkProtectionStatusViewModel.swift

dus7 added 25 commits July 8, 2024 15:13

Improve NewTabPageGridView alignment

4fa2c1e

Adjust FavoriteItemView text alignment

4492a4f

Extract Favorite entity to separate file

73f1841

Use real data in FavoritesView

bd57565

Improve temporary favicon appearance

c31a7c6

Use proper font for titles

68c6dc5

Add Environment value for DeviceOrientation

7f1d3f4

Introduce abstraction over FavoritesModel

7fa2e38

Reorganize groups

3a4cd66

Use 6 column grid for landscape orientation

436afa2

Fix grid spacing

044387f

Add collapse/expand button

d1f5308

Integrate FaviconsFetcherOnboarding

31334bb

Open favorites from NTP

763d805

Add haptic feedback on favorite selection

88e043f

Add context menu for favorites

98e5ffa

Update customize button position and behavior

d46bf2a

Increase preview items count

aa5f43d

Fix missing favicons issue

18a64bc

Improve collapse button design

550bff5

Prevent displaying empty favorite title

332af6f

Increase customize button top padding

e8fbc3e

Move collapse button image to label

d3cf2a6

Observe changes in favorites storage

a9729aa

Merge branch 'main' into mariusz/ntp-favorites

dab7d90

dus7 added 3 commits July 16, 2024 16:46

Remove leftover code

b1d167f

Move prefixing favorites logic to model

47860da

Extract favicon loading out of FavoriteIconViewModel

713471c

dus7 force-pushed the mariusz/ntp-favorites branch from c7dd9e4 to 713471c Compare July 17, 2024 15:01

dus7 requested a review from brindy July 17, 2024 15:13

dus7 commented Jul 17, 2024

View reviewed changes

dus7 marked this pull request as ready for review July 17, 2024 15:15

brindy approved these changes Jul 18, 2024

View reviewed changes

dus7 merged commit d9bd26c into main Jul 18, 2024
24 checks passed

dus7 deleted the mariusz/ntp-favorites branch July 18, 2024 14:32

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

New Tab Page favorites section #3083

New Tab Page favorites section #3083

dus7 commented Jul 15, 2024 •

edited

Loading

github-actions bot commented Jul 15, 2024 •

edited

Loading

dus7 Jul 16, 2024

dus7 Jul 16, 2024

dus7 Jul 16, 2024

dus7 Jul 16, 2024

dus7 Jul 16, 2024

dus7 Jul 16, 2024

dus7 Jul 17, 2024

brindy left a comment

dus7 commented Jul 18, 2024

New Tab Page favorites section #3083

New Tab Page favorites section #3083

Conversation

dus7 commented Jul 15, 2024 • edited Loading

Internal references:

github-actions bot commented Jul 15, 2024 • edited Loading

dus7 Jul 16, 2024

Choose a reason for hiding this comment

dus7 Jul 16, 2024

Choose a reason for hiding this comment

dus7 Jul 16, 2024

Choose a reason for hiding this comment

dus7 Jul 16, 2024

Choose a reason for hiding this comment

dus7 Jul 16, 2024

Choose a reason for hiding this comment

dus7 Jul 16, 2024

Choose a reason for hiding this comment

dus7 Jul 17, 2024

Choose a reason for hiding this comment

brindy left a comment

Choose a reason for hiding this comment

dus7 commented Jul 18, 2024

dus7 commented Jul 15, 2024 •

edited

Loading

github-actions bot commented Jul 15, 2024 •

edited

Loading