Utilizando o Design Pattern Redux em SwiftUI: Um Guia para Aplicativos de Filmes

O padrão Redux é uma arquitetura de aplicativo previsível para o gerenciamento de estados em ambientes JavaScript. No entanto, também pode ser aplicado com êxito no desenvolvimento de aplicativos Swift, especialmente quando combinado com SwiftUI. Neste artigo, explicaremos como usar o design pattern Redux em SwiftUI com o exemplo de um aplicativo de filmes.

O que é o Redux?

Redux é uma biblioteca de JavaScript para gerenciar o estado do aplicativo, que se tornou bastante popular na comunidade React. É baseado no padrão Flux da Facebook, mas simplificado e com algumas alterações.

Entendendo o Redux

Redux é composto por três componentes principais:

• Estado (State): É a fonte única de verdade. Todo o estado do seu aplicativo é armazenado em um único objeto de estado grande, imutável.
• Ações (Actions): São eventos que ocorrem na aplicação, eles podem ser disparados pelos usuários (por exemplo, clicando em um botão) ou por outros eventos no sistema.
• Reducers: São funções puras que pegam o estado atual e uma ação e devolvem um novo estado.

Como o Redux pode ser usado com SwiftUI?

Para usar o Redux com SwiftUI, aplicaremos o conceito de estado e ligação (binding) do SwiftUI. O estado é usado para armazenar informações que podem ser modificadas e usadas em diferentes partes do aplicativo. A ligação é uma forma de conectar o estado às visualizações do SwiftUI, permitindo a atualização automática das visualizações sempre que o estado é alterado.

Agora, vamos ver como implementar esse design pattern no SwiftUI através de um exemplo simples de aplicativo de filmes.

Exemplo de código: Aplicativo de Filmes

Em nosso aplicativo de filmes, teremos uma lista de filmes e a capacidade de adicionar novos filmes à lista. Usaremos o Redux para gerenciar o estado dos filmes.

Primeiro, vamos definir a estrutura do nosso Filme e o Estado do Aplicativo:

struct Filme {
    var id: Int
    var titulo: String
}

struct AppState {
    var filmes: [Filme]
}

Agora, vamos definir as ações que podemos fazer em nosso aplicativo:

enum AppAction {
    case adicionarFilme(Filme)
}

Vamos definir o Reducer:

func appReducer(state: inout AppState, action: AppAction) -> AppState {
    switch action {
    case .adicionarFilme(let filme):
        state.filmes.append(filme)
    }
    return state
}

Agora, vamos criar a Store que mantém o estado do aplicativo e a lógica do Reducer:

class Store: ObservableObject {
    @Published var state: AppState
    
    init(state: AppState = AppState(filmes: [])) {
        self.state = state
    }
    
    func dispatch(action: AppAction) {
        self.state = appReducer(state: &state, action: action)
    }
}

Finalmente, vamos usar nossa Store em uma View:

struct ContentView: View {
    @ObservedObject var store: Store

    var body: some View {
        List {
            ForEach(store.state.filmes, id: \.id) { filme in
                Text(filme.titulo)
            }
        }
        Button(action: {
           

 let novoFilme = Filme(id: store.state.filmes.count + 1, titulo: "Novo Filme")
            store.dispatch(action: .adicionarFilme(novoFilme))
        }) {
            Text("Adicionar Filme")
        }
    }
}

Neste exemplo, criamos uma aplicação que segue o padrão Redux para gerenciar o estado. Cada vez que um novo filme é adicionado, o estado é atualizado e a lista de filmes na View é atualizada automaticamente graças ao recurso de binding do SwiftUI.