[MBL-1814] PLOT plan selector component

Kickstarter-iOS/Features/PledgeOverTime/Controller/PledgePaymentPlansViewController.swift

@@ -0,0 +1,102 @@
+import Library
+import Prelude
+import UIKit
+
+protocol PledgePaymentPlansViewControllerDelegate: AnyObject {
+  func pledgePaymentPlansViewController(
+    _ viewController: PledgePaymentPlansViewController,
+    didSelectPaymentPlan paymentPlan: PledgePaymentPlansType
+  )
+}
+
+final class PledgePaymentPlansViewController: UIViewController {
+  // MARK: Properties
+
+  private let dataSource = PledgePaymentPlansDataSource()
+
+  private lazy var tableView: UITableView = {
+    ContentSizeTableView(frame: .zero, style: .plain)
+      |> \.separatorInset .~ .zero
+      |> \.contentInsetAdjustmentBehavior .~ .never
+      |> \.isScrollEnabled .~ false
+      |> \.dataSource .~ self.dataSource
+      |> \.delegate .~ self
+      |> \.rowHeight .~ UITableView.automaticDimension
+  }()
+
+  internal weak var delegate: PledgePaymentPlansViewControllerDelegate?
+
+  private let viewModel: PledgePaymentPlansViewModelType = PledgePaymentPlansViewModel()
+
+  // MARK: Lifecycle
+
+  override func viewDidLoad() {
+    super.viewDidLoad()
+
+    self.configureSubviews()
+    self.setupConstraints()
+
+    self.viewModel.inputs.viewDidLoad()
+  }
+
+  private func configureSubviews() {
+    _ = (self.tableView, self.view)
+      |> ksr_addSubviewToParent()
+
+    self.tableView.registerCellClass(PledgePaymentPlanInFullCell.self)
+    self.tableView.registerCellClass(PledgePaymentPlanPlotCell.self)
+  }
+
+  private func setupConstraints() {
+    _ = (self.tableView, self.view)
+      |> ksr_constrainViewToEdgesInParent()
+  }
+
+  // MARK: - Bind Styles
+
+  override func bindStyles() {
+    super.bindStyles()
+    _ = self.view
+      |> checkoutBackgroundStyle
+
+    _ = self.tableView
+      |> checkoutWhiteBackgroundStyle
+  }
+
+  // MARK: - View model
+
+  override func bindViewModel() {
+    super.bindViewModel()
+
+    self.viewModel.outputs.reloadPaymentPlans.observeForUI().observeValues { [weak self] data in
+
+      guard let self = self else { return }
+
+      self.dataSource.load(data)
+      self.tableView.reloadData()
+    }
+
+    self.viewModel.outputs.notifyDelegatePaymentPlanSelected
+      .observeForUI()
+      .observeValues { [weak self] paymentPlan in
+        guard let self = self else { return }
+
+        self.delegate?.pledgePaymentPlansViewController(self, didSelectPaymentPlan: paymentPlan)
+      }
+  }
+
+  // MARK: - Configuration
+
+  func configure(with value: PledgePaymentPlansAndSelectionData) {
+    self.viewModel.inputs.configure(with: value)
+  }
+}
+
+// MARK: - UITableViewDelegate
+
+extension PledgePaymentPlansViewController: UITableViewDelegate {
+  func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
+    tableView.deselectRow(at: indexPath, animated: true)
+    self.viewModel.inputs.didSelectRowAtIndexPath(indexPath)
+  }
+}

Kickstarter-iOS/Features/PledgeOverTime/Controller/PledgePaymentPlansViewControllerTest.swift

@@ -0,0 +1,56 @@
+@testable import Kickstarter_Framework
+@testable import Library
+import Prelude
+import SnapshotTesting
+import UIKit
+
+final class PledgePaymentPlansViewControllerTest: TestCase {
+  override func setUp() {
+    super.setUp()
+    AppEnvironment.pushEnvironment(mainBundle: Bundle.framework)
+    UIView.setAnimationsEnabled(false)
+  }
+
+  override func tearDown() {
+    AppEnvironment.popEnvironment()
+    UIView.setAnimationsEnabled(true)
+
+    super.tearDown()
+  }
+
+  func testView_PledgeInFullSelected() {
+    combos(Language.allLanguages, [Device.pad, Device.phone4_7inch]).forEach { language, device in
+      withEnvironment(language: language) {
+        let controller = PledgePaymentPlansViewController.instantiate()
+
+        let data = PledgePaymentPlansAndSelectionData(selectedPlan: .pledgeinFull)
+        controller.configure(with: data)
+
+        let (parent, _) = traitControllers(device: device, orientation: .portrait, child: controller)
+        parent.view.frame.size.height = 400
+
+        self.scheduler.advance(by: .seconds(1))
+
+        assertSnapshot(matching: parent.view, as: .image, named: "lang_\(language)_device_\(device)")
+      }
+    }
+  }
+
+  func testView_PledgeOverTimeSelected() {
+    combos(Language.allLanguages, [Device.pad, Device.phone4_7inch]).forEach { language, device in
+      withEnvironment(language: language) {
+        let controller = PledgePaymentPlansViewController.instantiate()
+
+        let data = PledgePaymentPlansAndSelectionData(selectedPlan: .pledgeOverTime)
+        controller.configure(with: data)
+
+        let (parent, _) = traitControllers(device: device, orientation: .portrait, child: controller)
+        parent.view.frame.size.height = 400
+
+        self.scheduler.advance(by: .seconds(1))
+
+        assertSnapshot(matching: parent.view, as: .image, named: "lang_\(language)_device_\(device)")
+      }
+    }
+  }
+}

Kickstarter-iOS/Features/PledgeOverTime/Datasource/PledgePaymentPlansDataSource.swift

@@ -0,0 +1,33 @@
+import Library
+import UIKit
+
+internal final class PledgePaymentPlansDataSource: ValueCellDataSource {
+  internal func load(_ data: PledgePaymentPlansAndSelectionData) {
+    self.clearValues()
+
+    let isPledgeInFullSelected = data.selectedPlan == PledgePaymentPlansType.pledgeinFull
+
+    self.set(
+      values: [isPledgeInFullSelected],
+      cellClass: PledgePaymentPlanInFullCell.self,
+      inSection: PledgePaymentPlansType.pledgeinFull.rawValue
+    )
+
+    self.set(
+      values: [!isPledgeInFullSelected],
+      cellClass: PledgePaymentPlanPlotCell.self,
+      inSection: PledgePaymentPlansType.pledgeOverTime.rawValue
+    )
+  }
+
+  internal override func configureCell(tableCell cell: UITableViewCell, withValue value: Any) {
+    switch (cell, value) {
+    case let (cell as PledgePaymentPlanInFullCell, value as Bool):
+      cell.configureWith(value: value)
+    case let (cell as PledgePaymentPlanPlotCell, value as Bool):
+      cell.configureWith(value: value)
+    default:
+      assertionFailure("Unrecognized combo: \(cell), \(value).")
+    }
+  }
+}

Kickstarter-iOS/Features/PledgeOverTime/Datasource/PledgePaymentPlansDataSourceTest.swift

@@ -0,0 +1,35 @@
+@testable import Kickstarter_Framework
+@testable import KsApi
+@testable import Library
+import Prelude
+import XCTest
+
+final class PledgePaymentPlansDataSourceTest: XCTestCase {
+  private let dataSource = PledgePaymentPlansDataSource()
+  private let tableView = UITableView()
+
+  func testLoad_DefaultState() {
+    let defaultData = PledgePaymentPlansAndSelectionData(selectedPlan: .pledgeinFull)
+
+    self.dataSource.load(defaultData)
+
+    XCTAssertEqual(2, self.dataSource.numberOfSections(in: self.tableView))
+
+    XCTAssertEqual(1, self.dataSource.numberOfItems(in: PledgePaymentPlansType.pledgeinFull.rawValue))
+
+    XCTAssertEqual(1, self.dataSource.numberOfItems(in: PledgePaymentPlansType.pledgeOverTime.rawValue))
+
+    XCTAssertEqual(
+      "PledgePaymentPlanInFullCell",
+      self.dataSource.reusableId(item: 0, section: PledgePaymentPlansType.pledgeinFull.rawValue)
+    )
+
+    XCTAssertEqual(
+      "PledgePaymentPlanPlotCell",
+      self.dataSource.reusableId(
+        item: 0,
+        section: PledgePaymentPlansType.pledgeOverTime.rawValue
+      )
+    )
+  }
+}

Kickstarter-iOS/Features/PledgeOverTime/Views/Cells/PledgePaymentPlanInFullCell.swift

@@ -0,0 +1,129 @@
+import Library
+import Prelude
+import UIKit
+
+final class PledgePaymentPlanInFullCell: UITableViewCell, ValueCell {
+  // MARK: properties
+
+  private lazy var rootStackView: UIStackView = { UIStackView(frame: .zero) }()
+  private lazy var leftColumnStackView: UIStackView = { UIStackView(frame: .zero) }()
+  private lazy var rigthColumnStackView: UIStackView = { UIStackView(frame: .zero) }()
+  private lazy var titleLabel = { UILabel(frame: .zero) }()
+  private lazy var checkmarkImageView: UIImageView = { UIImageView(frame: .zero) }()
+  private lazy var selectionView: UIView = { UIView(frame: .zero) |> \.backgroundColor .~ .ksr_support_100 }()
+
+  private let viewModel: PledgePaymentPlansCellViewModelType = PledgePaymentPlansCellViewModel()
+
+  // MARK: Lifecycle
+
+  override init(style: UITableViewCell.CellStyle, reuseIdentifier: String?) {
+    super.init(style: style, reuseIdentifier: reuseIdentifier)
+
+    self.configureSubviews()
+    self.setupConstraints()
+    self.bindViewModel()
+  }
+
+  @available(*, unavailable)
+  required init?(coder _: NSCoder) {
+    fatalError("init(coder:) has not been implemented")
+  }
+
+  // MARK: - Configuration
+
+  private func configureSubviews() {
+    _ = (self.rootStackView, self.contentView)
+      |> ksr_addSubviewToParent()
+
+    _ = ([self.checkmarkImageView, UIView()], self.leftColumnStackView)
+      |> ksr_addArrangedSubviewsToStackView()
+
+    _ = ([self.titleLabel, UIView()], self.rigthColumnStackView)
+      |> ksr_addArrangedSubviewsToStackView()
+
+    _ = ([self.leftColumnStackView, self.rigthColumnStackView], self.rootStackView)
+      |> ksr_addArrangedSubviewsToStackView()
+  }
+
+  private func setupConstraints() {
+    _ = (self.rootStackView, self.contentView)
+      |> ksr_constrainViewToEdgesInParent()
+
+    NSLayoutConstraint.activate([
+      self.checkmarkImageView.widthAnchor.constraint(equalToConstant: Styles.grid(4)),
+      self.checkmarkImageView.heightAnchor.constraint(equalTo: self.checkmarkImageView.widthAnchor)
+    ])
+  }
+
+  // MARK: - Styles
+
+  override func bindStyles() {
+    super.bindStyles()
+
+    _ = self
+      |> \.selectedBackgroundView .~ self.selectionView
+
+    _ = self.rootStackView
+      |> self.rootStackViewStyle
+
+    _ = self.leftColumnStackView
+      |> self.columnStackViewStyle
+      |> \.spacing .~ 0
+
+    _ = self.rigthColumnStackView
+      |> self.columnStackViewStyle
+
+    _ = self.titleLabel
+      |> self.titleLabelStyle
+
+    _ = self.checkmarkImageView
+      |> self.checkmarkImageViewStyle
+  }
+
+  // MARK: - View model
+
+  override func bindViewModel() {
+    super.bindViewModel()
+
+    self.viewModel.outputs.checkmarkImageName
+      .observeForUI()
+      .observeValues { [weak self] imageName in
+        _ = self?.checkmarkImageView
+          ?|> \.image .~ Library.image(named: imageName)
+      }
+  }
+
+  func configureWith(value: Bool) {
+    self.viewModel.inputs.configureWith(value: value)
+  }
+
+  // MARK: - Styles
+
+  private let rootStackViewStyle: StackViewStyle = { stackView in
+    stackView
+      |> \.axis .~ .horizontal
+      |> \.layoutMargins .~ .init(all: Styles.grid(2))
+      |> \.isLayoutMarginsRelativeArrangement .~ true
+      |> \.insetsLayoutMarginsFromSafeArea .~ false
+      |> \.spacing .~ Styles.grid(2)
+  }
+
+  private let columnStackViewStyle: StackViewStyle = { stackView in
+    stackView
+      |> \.axis .~ .vertical
+      |> \.spacing .~ Styles.grid(1)
+  }
+
+  private let titleLabelStyle: LabelStyle = { label in
+    label
+      |> checkoutTitleLabelStyle
+      |> \.font .~ UIFont.ksr_subhead().bolded
+      |> \.text .~
+      "Pledge in full" // TODO: add strings translations [MBL-1860](https://kickstarter.atlassian.net/browse/MBL-1860)
+  }
+
+  private let checkmarkImageViewStyle: ImageViewStyle = { imageView in
+    imageView
+      |> \.contentMode .~ .top
+  }
+}