SettingsCell: use custom disclosure indicator image

3 files changed, 23 insertions, 33 deletions

diff --git a/ios/MullvadVPN/SettingsCell.swift b/ios/MullvadVPN/SettingsCell.swift
index e1ee83f99e..5099c1f496 100644
--- a/ios/MullvadVPN/SettingsCell.swift
+++ b/ios/MullvadVPN/SettingsCell.swift
@@ -13,6 +13,14 @@ class SettingsCell: UITableViewCell {
     let titleLabel = UILabel()
     let detailTitleLabel = UILabel()
 
+    lazy var customDisclosureIndicator: UIImageView = {
+        let disclosureImage = UIImage(named: "IconChevron")?
+            .backport_withTintColor(UIColor.Cell.disclosureIndicatorColor, renderingMode: .alwaysOriginal)
+
+        return UIImageView(image: disclosureImage)
+    }()
+
+
     override init(style: UITableViewCell.CellStyle, reuseIdentifier: String?) {
         super.init(style: style, reuseIdentifier: reuseIdentifier)
 
@@ -68,21 +76,13 @@ class SettingsCell: UITableViewCell {
         setLayoutMargins()
     }
 
-    override func didAddSubview(_ subview: UIView) {
-        super.didAddSubview(subview)
-
-        if let button = subview as? UIButton {
-            updateDisclosureIndicatorTintColor(button)
-        }
-    }
-
     override func layoutSubviews() {
         super.layoutSubviews()
 
         if #available(iOS 13, *) {
             // no-op
         } else {
-            layoutSubviewsiOS12()
+            layoutSubviews_iOS12()
         }
     }
 
@@ -94,30 +94,19 @@ class SettingsCell: UITableViewCell {
         contentView.layoutMargins = UIMetrics.settingsCellLayoutMargins
     }
 
-    /// Standard disclosure views do not provide customization of a tint color.
-    /// This method adjusts a disclosure tint color by replacing the button image rendering mode on iOS 12 and by
-    /// switching graphics on iOS 13 or newer.
-    private func updateDisclosureIndicatorTintColor(_ button: UIButton) {
-        guard accessoryType == .disclosureIndicator else { return }
-
-        if #available(iOS 13, *) {
-            let configuration = UIImage.SymbolConfiguration(pointSize: 11, weight: .bold)
-            let chevron = UIImage(systemName: "chevron.right", withConfiguration: configuration)?
-                .withTintColor(.white, renderingMode: .alwaysOriginal)
-                .imageFlippedForRightToLeftLayoutDirection()
+    func setCustomDisclosureIndicator() {
+        accessoryType = .none
+        accessoryView = customDisclosureIndicator
+    }
 
-            button.setImage(chevron, for: .normal)
-        } else {
-            if let image = button.backgroundImage(for: .normal)?.withRenderingMode(.alwaysTemplate) {
-                button.setBackgroundImage(image, for: .normal)
-                button.tintColor = .white
-            }
-        }
+    func unsetCustomDisclosureIndicator() {
+        accessoryView = nil
+        accessoryType = .none
     }
 
     /// On iOS 12, standard edit and reorder controls do not respect layout margins.
     /// This method does layout adjustments to fix that.
-    private func layoutSubviewsiOS12() {
+    private func layoutSubviews_iOS12() {
         guard isEditing || showsReorderControl else { return }
 
         var leftOffset: CGFloat = 0
diff --git a/ios/MullvadVPN/SettingsDataSource.swift b/ios/MullvadVPN/SettingsDataSource.swift
index 9d1d48be6b..f4a2267492 100644
--- a/ios/MullvadVPN/SettingsDataSource.swift
+++ b/ios/MullvadVPN/SettingsDataSource.swift
@@ -114,7 +114,7 @@ class SettingsDataSource: NSObject, AccountObserver, UITableViewDataSource, UITa
             cell.titleLabel.text = NSLocalizedString("ACCOUNT_CELL_LABEL", tableName: "Settings", value: "Account", comment: "")
             cell.accountExpiryDate = Account.shared.expiry
             cell.accessibilityIdentifier = "AccountCell"
-            cell.accessoryType = .disclosureIndicator
+            cell.setCustomDisclosureIndicator()
 
             return cell
 
@@ -123,7 +123,7 @@ class SettingsDataSource: NSObject, AccountObserver, UITableViewDataSource, UITa
             cell.titleLabel.text = NSLocalizedString("PREFERENCES_CELL_LABEL", tableName: "Settings", value: "Preferences", comment: "")
             cell.detailTitleLabel.text = nil
             cell.accessibilityIdentifier = nil
-            cell.accessoryType = .disclosureIndicator
+            cell.setCustomDisclosureIndicator()
 
             return cell
 
@@ -132,7 +132,7 @@ class SettingsDataSource: NSObject, AccountObserver, UITableViewDataSource, UITa
             cell.titleLabel.text = NSLocalizedString("WIREGUARD_KEY_CELL_LABEL", tableName: "Settings", value: "WireGuard key", comment: "")
             cell.detailTitleLabel.text = nil
             cell.accessibilityIdentifier = "WireGuardKeyCell"
-            cell.accessoryType = .disclosureIndicator
+            cell.setCustomDisclosureIndicator()
 
             return cell
 
@@ -141,7 +141,7 @@ class SettingsDataSource: NSObject, AccountObserver, UITableViewDataSource, UITa
             cell.titleLabel.text = NSLocalizedString("APP_VERSION_CELL_LABEL", tableName: "Settings", value: "App version", comment: "")
             cell.detailTitleLabel.text = Bundle.main.productVersion
             cell.accessibilityIdentifier = nil
-            cell.accessoryType = .none
+            cell.unsetCustomDisclosureIndicator()
 
             return cell
 
@@ -150,7 +150,7 @@ class SettingsDataSource: NSObject, AccountObserver, UITableViewDataSource, UITa
             cell.titleLabel.text = NSLocalizedString("REPORT_PROBLEM_CELL_LABEL", tableName: "Settings", value: "Report a problem", comment: "")
             cell.detailTitleLabel.text = nil
             cell.accessibilityIdentifier = nil
-            cell.accessoryType = .disclosureIndicator
+            cell.setCustomDisclosureIndicator()
 
             return cell
         }
diff --git a/ios/MullvadVPN/UIColor+Palette.swift b/ios/MullvadVPN/UIColor+Palette.swift
index 60d1fe6c23..8eae81d2c6 100644
--- a/ios/MullvadVPN/UIColor+Palette.swift
+++ b/ios/MullvadVPN/UIColor+Palette.swift
@@ -77,6 +77,7 @@ extension UIColor {
         static let disabledSelectedBackgroundColor = selectedBackgroundColor.darkened(by: 0.3)!
 
         static let selectedAltBackgroundColor = backgroundColor.darkened(by: 0.2)!
+        static let disclosureIndicatorColor = UIColor(white: 1.0, alpha: 0.6)
     }
 
     enum SubCell {