Moving to Action-Mutation-State model

[devxoul]

Design Goal

• Functional & Reactive
• Testable
• Explicit
• Easy to use
• Less typing (compare to other patterns)

Summary

• Input becomes Action.
• Output becomes State.
• Action and State are self-contained and independent.
• Use a single input subject and single output observable instead of exposing each properties.
• Every reactor has:
  • func mutate(State, Action) -> Observable<Mutation>
  • func reduce(State, Mutation) -> State

Example

View (ViewController)

class TaskListViewController: UIViewController, View {
  func bind(reactor: TaskListViewReactor) {
    // Action
    self.rx.viewDidLoad.map(Reactor.Action.refresh)
      .bindTo(reactor.action)
      .addDisposableTo(self.disposeBag)

    self.editButton.rx.tap.map(Reactor.Action.toggleEditing)
      .bindTo(reactor.action)
      .addDisposableTo(self.disposeBag)

    // State
    reactor.state.map { $0.isEditing }
      .bindTo(self.tableView.rx.isEditing)
      .addDisposableTo(self.disposeBag)

    reactor.state.map { $0.tasks }
      .bindTo(self.tableView.rx.items(foo))
      .addDisposableTo(self.disposeBag)
  }
}

Reactor

class TaskListViewReactor: Reactor {
  enum Action {
    case refresh()
    case toggleEditing()
    case addTask(Task)
    case deleteTask(Int)
  }

  typealias Mutation = Action

  struct State {
    var isEditing: Bool
    var tasks: [Task]
  }

  override func reduce(state: State, mutation: Mutation) -> State {
    var state = state
    switch action {
    case .refresh:
      state.tasks = refreshedTaskFromSomewhere
      return state

    case .toggleEditing:
      state.isEditing = !state.isEditing
      return state

    case .addTask(let task):
      state.tasks.append(task)
      return state

    case .deleteTask(let index):
      state.tasks.remove(at: index)
      return state
    } 
  }
}