Add FXIOS-10021 ⁃ Add cell Accessory if item has a submenu (#22054)

FXIOS-10021 #21991 ⁃ Add cell Accessory if item has a submenu
mozilla-mobile · Sep 18, 2024 · f524add · f524add
1 parent 9881464
commit f524add
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 2 deletions.
diff --git a/BrowserKit/Sources/MenuKit/MenuCell.swift b/BrowserKit/Sources/MenuKit/MenuCell.swift
@@ -32,6 +32,8 @@ public class MenuCell: UITableViewCell, ReusableCell, ThemeApplicable {
         stackView.spacing = UX.contentSpacing
     }
 
+    private var accessoryArrowView: UIImageView = .build()
+
     // MARK: - Properties
     public var model: MenuElement?
 
@@ -49,12 +51,15 @@ public class MenuCell: UITableViewCell, ReusableCell, ThemeApplicable {
         self.titleLabel.text = model.title
         self.descriptionLabel.text = model.a11yLabel // TODO: to be updated with the correct value
         self.icon.image = UIImage(named: model.iconName)?.withRenderingMode(.alwaysTemplate)
+        self.accessoryArrowView.image =
+        UIImage(named: StandardImageIdentifiers.Large.chevronRight)?.withRenderingMode(.alwaysTemplate)
         setupView()
     }
 
     private func setupView() {
         self.addSubview(icon)
         self.addSubview(contentStackView)
+        self.addSubview(accessoryArrowView)
         contentStackView.addArrangedSubview(titleLabel)
         contentStackView.addArrangedSubview(descriptionLabel)
         NSLayoutConstraint.activate([
@@ -64,9 +69,15 @@ public class MenuCell: UITableViewCell, ReusableCell, ThemeApplicable {
             icon.heightAnchor.constraint(equalToConstant: UX.iconSize),
 
             contentStackView.leadingAnchor.constraint(equalTo: icon.trailingAnchor, constant: UX.contentMargin),
-            contentStackView.trailingAnchor.constraint(equalTo: trailingAnchor, constant: -UX.contentMargin),
             contentStackView.topAnchor.constraint(equalTo: topAnchor, constant: UX.contentMargin),
-            contentStackView.bottomAnchor.constraint(equalTo: bottomAnchor, constant: -UX.contentMargin)
+            contentStackView.bottomAnchor.constraint(equalTo: bottomAnchor, constant: -UX.contentMargin),
+
+            accessoryArrowView.leadingAnchor.constraint(equalTo: contentStackView.trailingAnchor,
+                                                        constant: UX.contentMargin),
+            accessoryArrowView.trailingAnchor.constraint(equalTo: trailingAnchor, constant: -UX.contentMargin),
+            accessoryArrowView.centerYAnchor.constraint(equalTo: centerYAnchor),
+            accessoryArrowView.widthAnchor.constraint(equalToConstant: UX.iconSize),
+            accessoryArrowView.heightAnchor.constraint(equalToConstant: UX.iconSize)
         ])
     }
 
@@ -79,6 +90,7 @@ public class MenuCell: UITableViewCell, ReusableCell, ThemeApplicable {
     public func applyTheme(theme: Theme) {
         guard let model else { return }
         backgroundColor = theme.colors.layer2
+        accessoryArrowView.isHidden = !model.hasSubmenu || model.isActive ? true : false
         if model.isActive {
             titleLabel.textColor = theme.colors.textAccent
             descriptionLabel.textColor = theme.colors.textSecondary
@@ -87,10 +99,12 @@ public class MenuCell: UITableViewCell, ReusableCell, ThemeApplicable {
             titleLabel.textColor = theme.colors.textDisabled
             descriptionLabel.textColor = theme.colors.textDisabled
             icon.tintColor = theme.colors.iconDisabled
+            accessoryArrowView.tintColor = theme.colors.iconDisabled
         } else {
             titleLabel.textColor = theme.colors.textPrimary
             descriptionLabel.textColor = theme.colors.textSecondary
             icon.tintColor = theme.colors.iconSecondary
+            accessoryArrowView.tintColor = theme.colors.iconSecondary
         }
     }
 }
diff --git a/BrowserKit/Sources/MenuKit/MenuElement.swift b/BrowserKit/Sources/MenuKit/MenuElement.swift
@@ -9,6 +9,7 @@ public struct MenuElement: Equatable {
     let iconName: String
     let isEnabled: Bool
     let isActive: Bool
+    let hasSubmenu: Bool
     let a11yLabel: String
     let a11yHint: String?
     let a11yId: String
@@ -21,6 +22,7 @@ public struct MenuElement: Equatable {
         iconName: String,
         isEnabled: Bool,
         isActive: Bool,
+        hasSubmenu: Bool = false,
         a11yLabel: String,
         a11yHint: String?,
         a11yId: String,
@@ -30,6 +32,7 @@ public struct MenuElement: Equatable {
         self.iconName = iconName
         self.isEnabled = isEnabled
         self.isActive = isActive
+        self.hasSubmenu = hasSubmenu
         self.a11yLabel = a11yLabel
         self.a11yHint = a11yHint
         self.a11yId = a11yId
@@ -41,6 +44,7 @@ public struct MenuElement: Equatable {
         lhs.iconName == rhs.iconName &&
         lhs.isEnabled == rhs.isEnabled &&
         lhs.isActive == rhs.isActive &&
+        lhs.hasSubmenu == rhs.hasSubmenu &&
         lhs.a11yLabel == rhs.a11yLabel &&
         lhs.a11yHint == rhs.a11yHint &&
         lhs.a11yId == rhs.a11yId