SelectLocationCell: replace RelayStatusIndicatorView with a plain old UIView

4 files changed, 34 insertions, 91 deletions

diff --git a/ios/MullvadVPN/RelayStatusIndicatorView.swift b/ios/MullvadVPN/RelayStatusIndicatorView.swift
deleted file mode 100644
index ab8626001e..0000000000
--- a/ios/MullvadVPN/RelayStatusIndicatorView.swift
+++ /dev/null
@@ -1,86 +0,0 @@
-//
-//  RelayStatusIndicatorView.swift
-//  MullvadVPN
-//
-//  Created by pronebird on 01/05/2019.
-//  Copyright © 2019 Mullvad VPN AB. All rights reserved.
-//
-
-import UIKit
-
-@IBDesignable class RelayStatusIndicatorView: UIControl {
-
-    private let circleLayer: CALayer = {
-        let layer = CALayer()
-        layer.needsDisplayOnBoundsChange = true
-        return layer
-    }()
-
-    @IBInspectable var isActive: Bool = false {
-        didSet {
-            updateCircleLayerColor()
-        }
-    }
-
-    override var isHighlighted: Bool {
-        didSet {
-            updateCircleLayerColor()
-        }
-    }
-
-    override init(frame: CGRect) {
-        super.init(frame: frame)
-
-        setup()
-    }
-
-    required init?(coder aDecoder: NSCoder) {
-        super.init(coder: aDecoder)
-
-        setup()
-    }
-
-    override func tintColorDidChange() {
-        super.tintColorDidChange()
-
-        updateCircleLayerColor()
-    }
-
-    override func layoutSublayers(of layer: CALayer) {
-        super.layoutSublayers(of: layer)
-
-        guard layer == self.layer else { return }
-
-        // keep the circular layer square
-        let shortSide = min(layer.bounds.width, layer.bounds.height)
-        let circleOrigin = CGPoint(
-            x: (layer.bounds.width - shortSide) * 0.5,
-            y: (layer.bounds.height - shortSide) * 0.5
-        )
-        let circleSize = CGSize(width: shortSide, height: shortSide)
-
-        circleLayer.frame = CGRect(origin: circleOrigin, size: circleSize)
-        circleLayer.cornerRadius = shortSide * 0.5
-    }
-
-    private func setup() {
-        isUserInteractionEnabled = false
-        backgroundColor = UIColor.clear
-
-        layer.addSublayer(circleLayer)
-        updateCircleLayerColor()
-    }
-
-    private func updateCircleLayerColor() {
-        let baseColor = isActive
-            ? UIColor.RelayStatusIndicator.activeColor
-            : UIColor.RelayStatusIndicator.inactiveColor
-
-        let circleColor: UIColor = isHighlighted ? tintColor : baseColor
-
-        CATransaction.begin()
-        CATransaction.setDisableActions(true)
-        circleLayer.backgroundColor = circleColor.cgColor
-        CATransaction.commit()
-    }
-}
diff --git a/ios/MullvadVPN/SelectLocationCell.swift b/ios/MullvadVPN/SelectLocationCell.swift
index ef41257303..a86543d430 100644
--- a/ios/MullvadVPN/SelectLocationCell.swift
+++ b/ios/MullvadVPN/SelectLocationCell.swift
@@ -9,12 +9,20 @@
 import UIKit
 
 private let kCollapseButtonWidth: CGFloat = 24
+private let kRelayIndicatorSize: CGFloat = 16
 
 class SelectLocationCell: BasicTableViewCell {
     typealias CollapseHandler = (SelectLocationCell) -> Void
 
     let locationLabel = UILabel()
-    let statusIndicator = RelayStatusIndicatorView()
+    let statusIndicator: UIView = {
+        let view = UIView()
+        view.layer.cornerRadius = kRelayIndicatorSize * 0.5
+        if #available(iOS 13.0, *) {
+            view.layer.cornerCurve = .circular
+        }
+        return view
+    }()
     let tickImageView = UIImageView(image: UIImage(named: "IconTick"))
     let collapseButton = UIButton(type: .custom)
 
@@ -25,6 +33,7 @@ class SelectLocationCell: BasicTableViewCell {
         didSet {
             updateDisabled()
             updateBackgroundColor()
+            updateStatusIndicatorColor()
         }
     }
 
@@ -75,10 +84,17 @@ class SelectLocationCell: BasicTableViewCell {
         )
     }
 
+    override func setHighlighted(_ highlighted: Bool, animated: Bool) {
+        super.setHighlighted(highlighted, animated: animated)
+
+        updateStatusIndicatorColor()
+    }
+
     override func setSelected(_ selected: Bool, animated: Bool) {
         super.setSelected(selected, animated: animated)
 
         updateTickImage()
+        updateStatusIndicatorColor()
     }
 
     private func setupCell() {
@@ -90,7 +106,6 @@ class SelectLocationCell: BasicTableViewCell {
         locationLabel.font = UIFont.systemFont(ofSize: 17)
         locationLabel.textColor = .white
 
-        statusIndicator.tintColor = .white
         tickImageView.tintColor = .white
 
         collapseButton.accessibilityIdentifier = "CollapseButton"
@@ -112,8 +127,8 @@ class SelectLocationCell: BasicTableViewCell {
             tickImageView.leadingAnchor.constraint(equalTo: contentView.layoutMarginsGuide.leadingAnchor),
             tickImageView.centerYAnchor.constraint(equalTo: contentView.centerYAnchor),
 
-            statusIndicator.widthAnchor.constraint(equalToConstant: 16),
-            statusIndicator.heightAnchor.constraint(equalToConstant: 16),
+            statusIndicator.widthAnchor.constraint(equalToConstant: kRelayIndicatorSize),
+            statusIndicator.heightAnchor.constraint(equalTo: statusIndicator.widthAnchor),
             statusIndicator.centerXAnchor.constraint(equalTo: tickImageView.centerXAnchor),
             statusIndicator.centerYAnchor.constraint(equalTo: tickImageView.centerYAnchor),
 
@@ -134,6 +149,10 @@ class SelectLocationCell: BasicTableViewCell {
         tickImageView.isHidden = !isSelected
     }
 
+    private func updateStatusIndicatorColor() {
+        statusIndicator.backgroundColor = statusIndicatorColor()
+    }
+
     private func updateDisabled() {
         locationLabel.alpha = isDisabled ? 0.2 : 1
         collapseButton.alpha = isDisabled ? 0.2 : 1
@@ -169,6 +188,16 @@ class SelectLocationCell: BasicTableViewCell {
         }
     }
 
+    private func statusIndicatorColor() -> UIColor {
+        if isDisabled {
+            return UIColor.RelayStatusIndicator.inactiveColor
+        } else if isHighlighted {
+            return UIColor.RelayStatusIndicator.highlightColor
+        } else {
+            return UIColor.RelayStatusIndicator.activeColor
+        }
+    }
+
     @objc private func handleCollapseButton(_ sender: UIControl) {
         didCollapseHandler?(self)
     }
diff --git a/ios/MullvadVPN/SelectLocationViewController.swift b/ios/MullvadVPN/SelectLocationViewController.swift
index 947b138863..2e17e44a15 100644
--- a/ios/MullvadVPN/SelectLocationViewController.swift
+++ b/ios/MullvadVPN/SelectLocationViewController.swift
@@ -81,7 +81,6 @@ class SelectLocationViewController: UIViewController, UITableViewDelegate {
                 cell.accessibilityIdentifier = item.location.stringRepresentation
                 cell.isDisabled = !item.isActive
                 cell.locationLabel.text = item.displayName
-                cell.statusIndicator.isActive = item.isActive
                 cell.showsCollapseControl = item.isCollapsible
                 cell.isExpanded = item.showsChildren
                 cell.didCollapseHandler = { [weak self] (cell) in
diff --git a/ios/MullvadVPN/UIColor+Palette.swift b/ios/MullvadVPN/UIColor+Palette.swift
index b50b31fe70..edcc13d2b7 100644
--- a/ios/MullvadVPN/UIColor+Palette.swift
+++ b/ios/MullvadVPN/UIColor+Palette.swift
@@ -51,6 +51,7 @@ extension UIColor {
     enum RelayStatusIndicator {
         static let activeColor = successColor.withAlphaComponent(0.9)
         static let inactiveColor = dangerColor.withAlphaComponent(0.95)
+        static let highlightColor = UIColor.white
     }
 
     enum MainSplitView {