Update UI after async await call

Question

I load books from API, show activity indicator while loading, update label after server response.

activityView.isHidden = false
        
let task = detach {
    do {
        let books = try await self.bookService.fetchBooks()
        DispatchQueue.main.async {
            self.show(books: books)
        }
    } catch {
        DispatchQueue.main.async {
            self.resultLabel.text = error.localizedDescription
        }
    }
    DispatchQueue.main.async {
       self.activityView.isHidden = true
    }
}

//...

My question is what is better approach to update UI on the main queue? DispatchQueue.main.async look ugly and I guess there is a better approach to do the same.

I must use it, because all UI updates should be on the main thread and I get compiler errors without DispatchQueue.main.async something like

Property 'text' isolated to global actor 'MainActor' can not be mutated from a non-isolated context

or

Property 'isHidden' isolated to global actor 'MainActor' can not be mutated from a non-isolated context

P.S. Use Xcode 13.0b2

user_6458001 · Answer

Use @MainActor like this -

self.updateAcitivityIndicator(isHidden: false)
        
let task = detach {
    do {
        let books = try await self.bookService.fetchBooks()
        self.showBooks(books)
    } catch {
        self.showError(error)
    }
    self.updateAcitivityIndicator(isHidden: true)
}

@MainActor
private func showBooks(_ books: [Book]) {
}

@MainActor
private func showError(_ error: Error) {
    self.resultLabel.text = error.localizedDescription
}

@MainActor
private func updateAcitivityIndicator(isHidden: Bool) {
    self.activityView.isHidden = isHidden
}

Update UI after async await call

1 Answers