Add FXIOS-10022 ⁃ Add themeing to the menu (#22059)

FXIOS-10022 #21993 ⁃ Add themeing to the menu
mozilla-mobile · Sep 18, 2024 · db79da6 · db79da6
1 parent f524add
commit db79da6
Show file tree

Hide file tree

Showing 8 changed files with 57 additions and 19 deletions.
diff --git a/BrowserKit/Sources/MenuKit/MenuAccountHeaderView.swift b/BrowserKit/Sources/MenuKit/MenuAccountHeaderView.swift
@@ -4,8 +4,9 @@
 
 import Foundation
 import UIKit
+import Common
 
-final class MenuAccountHeaderView: UIView {
+final class MenuAccountHeaderView: UIView, ThemeApplicable {
     // MARK: - UI Elements
 
     // MARK: - Properties
@@ -22,9 +23,12 @@ final class MenuAccountHeaderView: UIView {
 
     // MARK: - UI Setup
     private func setupView() {
-        backgroundColor = .systemPink
-
         NSLayoutConstraint.activate([
         ])
     }
+
+    // MARK: - Theme Applicable
+    func applyTheme(theme: Theme) {
+        backgroundColor = theme.colors.layer3
+    }
 }
diff --git a/BrowserKit/Sources/MenuKit/MenuCell.swift b/BrowserKit/Sources/MenuKit/MenuCell.swift
@@ -86,7 +86,7 @@ public class MenuCell: UITableViewCell, ReusableCell, ThemeApplicable {
         action()
     }
 
-    // TODO: FXIOS-10022 ⁃ Add themeing to the menu (applying this method remained)
+    // MARK: - Theme Applicable
     public func applyTheme(theme: Theme) {
         guard let model else { return }
         backgroundColor = theme.colors.layer2

diff --git a/BrowserKit/Sources/MenuKit/MenuDetailView.swift b/BrowserKit/Sources/MenuKit/MenuDetailView.swift
@@ -6,7 +6,7 @@ import Common
 import UIKit
 
 public final class MenuDetailView: UIView,
-                                   MenuTableViewDataDelegate {
+                                   MenuTableViewDataDelegate, ThemeApplicable {
     private struct UX {
         static let headerHeight: CGFloat = 70
     }
@@ -27,7 +27,6 @@ public final class MenuDetailView: UIView,
 
     // MARK: - UI Setup
     private func setupView() {
-        backgroundColor = .clear
         addSubview(detailHeaderView)
         addSubview(tableView)
 
@@ -52,4 +51,11 @@ public final class MenuDetailView: UIView,
     public func setupHeaderNavigation(from delegate: MainMenuDetailNavigationHandler) {
         detailHeaderView.navigationDelegate = delegate
     }
+
+    // MARK: - Theme Applicable
+    public func applyTheme(theme: Theme) {
+        backgroundColor = .clear
+        tableView.applyTheme(theme: theme)
+        detailHeaderView.applyTheme(theme: theme)
+    }
 }
diff --git a/BrowserKit/Sources/MenuKit/MenuMainView.swift b/BrowserKit/Sources/MenuKit/MenuMainView.swift
@@ -6,7 +6,7 @@ import Common
 import UIKit
 
 public final class MenuMainView: UIView,
-                                 MenuTableViewDataDelegate {
+                                 MenuTableViewDataDelegate, ThemeApplicable {
     // MARK: - UI Elements
     private var tableView: MenuTableView = .build()
     private var accountHeaderView: MenuAccountHeaderView = .build()
@@ -25,7 +25,6 @@ public final class MenuMainView: UIView,
 
     // MARK: - UI Setup
     private func setupView() {
-        backgroundColor = .clear
         self.addSubview(accountHeaderView)
         self.addSubview(tableView)
 
@@ -46,4 +45,11 @@ public final class MenuMainView: UIView,
     public func reloadTableView(with data: [MenuSection]) {
         tableView.reloadTableView(with: data)
     }
+
+    // MARK: - ThemeApplicable
+    public func applyTheme(theme: Theme) {
+        backgroundColor = .clear
+        tableView.applyTheme(theme: theme)
+        accountHeaderView.applyTheme(theme: theme)
+    }
 }
diff --git a/BrowserKit/Sources/MenuKit/MenuSubmenuHeaderView.swift b/BrowserKit/Sources/MenuKit/MenuSubmenuHeaderView.swift
@@ -10,10 +10,9 @@ public protocol MainMenuDetailNavigationHandler: AnyObject {
     func backToMainView()
 }
 
-final class MenuSubmenuHeaderView: UIView {
+final class MenuSubmenuHeaderView: UIView, ThemeApplicable {
     // MARK: - UI Elements
     private lazy var backButton: UIButton = .build { button in
-        button.backgroundColor = .systemRed
         button.addTarget(self, action: #selector(self.backButtonTapped), for: .touchUpInside)
     }
 
@@ -32,7 +31,6 @@ final class MenuSubmenuHeaderView: UIView {
 
     // MARK: - UI Setup
     private func setupView() {
-        backgroundColor = .systemCyan
         addSubviews(backButton)
 
         NSLayoutConstraint.activate([
@@ -47,4 +45,10 @@ final class MenuSubmenuHeaderView: UIView {
     private func backButtonTapped() {
         navigationDelegate?.backToMainView()
     }
+
+    // MARK: Theme Applicable
+    func applyTheme(theme: Theme) {
+        backgroundColor = theme.colors.layer3
+        backButton.tintColor = theme.colors.textAccent
+    }
 }
diff --git a/BrowserKit/Sources/MenuKit/MenuTableView.swift b/BrowserKit/Sources/MenuKit/MenuTableView.swift
@@ -4,16 +4,18 @@
 
 import Foundation
 import UIKit
+import Common
 
 public protocol MenuTableViewDataDelegate: AnyObject {
     func reloadTableView(with data: [MenuSection])
 }
 
 class MenuTableView: UIView,
                      UITableViewDelegate,
-                     UITableViewDataSource {
+                     UITableViewDataSource, ThemeApplicable {
     private var tableView: UITableView
     private var menuData: [MenuSection]
+    private var theme: Theme?
 
     override init(frame: CGRect) {
         tableView = UITableView(frame: .zero, style: .insetGrouped)
@@ -32,8 +34,6 @@ class MenuTableView: UIView,
     }
 
     private func setupUI() {
-        backgroundColor = .clear
-        tableView.backgroundColor = .clear
         tableView.translatesAutoresizingMaskIntoConstraints = false
         self.addSubview(tableView)
 
@@ -76,7 +76,7 @@ class MenuTableView: UIView,
         ) as! MenuCell
 
         cell.configureCellWith(model: menuData[indexPath.section].options[indexPath.row])
-
+        if let theme { cell.applyTheme(theme: theme) }
         return cell
     }
 
@@ -96,4 +96,11 @@ class MenuTableView: UIView,
         menuData = data
         tableView.reloadData()
     }
+
+    // MARK: - Theme Applicable
+    func applyTheme(theme: Theme) {
+        self.theme = theme
+        backgroundColor = .clear
+        tableView.backgroundColor = .clear
+    }
 }
diff --git a/firefox-ios/Client/Frontend/Browser/MainMenu/Views/MainMenuDetailViewController.swift b/firefox-ios/Client/Frontend/Browser/MainMenu/Views/MainMenuDetailViewController.swift
@@ -54,8 +54,19 @@ class MainMenuDetailViewController: UIViewController,
         submenuContent.setupHeaderNavigation(from: self)
     }
 
+    override func viewWillAppear(_ animated: Bool) {
+        super.viewWillAppear(animated)
+        applyTheme()
+    }
+
+    // MARK: - UX related
+    func applyTheme() {
+        let theme = themeManager.getCurrentTheme(for: windowUUID)
+        view.backgroundColor = theme.colors.layer3
+        submenuContent.applyTheme(theme: theme)
+    }
+
     private func setupView() {
-        view.backgroundColor = .systemMint
         view.addSubview(submenuContent)
 
         NSLayoutConstraint.activate([

diff --git a/firefox-ios/Client/Frontend/Browser/MainMenu/Views/MainMenuViewController.swift b/firefox-ios/Client/Frontend/Browser/MainMenu/Views/MainMenuViewController.swift
@@ -145,9 +145,9 @@ class MainMenuViewController: UIViewController,
 
     // MARK: - UX related
     func applyTheme() {
-//        let theme = themeManager.getCurrentTheme(for: windowUUID)
-//        view.backgroundColor = theme.colors.layer1
-        view.backgroundColor = .systemPurple
+        let theme = themeManager.getCurrentTheme(for: windowUUID)
+        view.backgroundColor = theme.colors.layer3
+        menuContent.applyTheme(theme: theme)
     }
 
     // MARK: - Notifications