SwiftUI image in view not updating after fetching data from firebase - firebase

Question

After I add a post with an image and I go back to the main feed view, I can see the post info(username, upload date etc.); but instead of an image, there is only a gap.
After I go to another tab and come back to Main Feed View, I can see the image then. Why I can't fetch the image and update the UI immediately?
this is the FeedCellView
import SwiftUI
import Kingfisher
struct FeedCell: View {
#ObservedObject var viewModel: FeedCellViewModel
#EnvironmentObject var auth: AuthViewModel
#Environment(\.presentationMode) var presentationMode
var didLike: Bool { return viewModel.post.didLike ?? false }
#State var showActionSheet = false
init(viewModel: FeedCellViewModel) {
self.viewModel = viewModel
}
var body: some View {
VStack(alignment: .leading) {
// user info
HStack {
if let user = viewModel.post.user{
NavigationLink(destination: ProfileView(user: user)){
KFImage(URL(string: viewModel.post.ownerImageUrl))
.resizable()
.scaledToFill()
.frame(width: 36, height: 36)
.clipped()
.cornerRadius(18)
Text(viewModel.post.ownerUsername)
.font(.system(size: 14, weight: .semibold))
}
}
}
.padding(.bottom, 8)
.padding(.leading, 8)
.padding(.trailing, 12)
// post image
KFImage(URL(string: viewModel.post.imageUrl))
.resizable()
.scaledToFill()
.frame(width: UIScreen.main.bounds.width - 4, alignment: .center)
.frame(maxHeight: 440)
.clipped()
.padding(.leading, 2)
// action buttons
HStack(spacing: 16) {
Button(action: {
didLike ? viewModel.unlike() : viewModel.like()
}, label: {
Image(systemName: didLike ? "heart.fill" : "heart")
.resizable()
.scaledToFill()
.foregroundColor(didLike ? .red : .black)
.frame(width: 20, height: 20)
.font(.system(size: 20))
.padding(4)
})
NavigationLink(destination: CommentsView(post: viewModel.post)) {
Image(systemName: "bubble.right")
.resizable()
.scaledToFill()
.frame(width: 20, height: 20)
.font(.system(size: 20))
.padding(4)
}
Button(action: {}, label: {
Image(systemName: "paperplane")
.resizable()
.scaledToFill()
.frame(width: 20, height: 20)
.font(.system(size: 20))
.padding(4)
})
}
.padding(.leading, 4)
.foregroundColor(.black)
// caption
Text(viewModel.likeString)
.font(.system(size: 14, weight: .semibold))
.padding(.leading, 8)
.padding(.bottom, 0.5)
//
HStack {
Text(viewModel.post.ownerUsername).font(.system(size: 14, weight: .semibold)) +
Text(" \(viewModel.post.caption)")
.font(.system(size: 14))
}.padding(.horizontal, 8)
Text(viewModel.timestampString)
.font(.system(size: 14))
.foregroundColor(.gray)
.padding(.leading, 8)
.padding(.top, -2)
}
}
func getActionSheet() -> ActionSheet{
return ActionSheet(title: Text("What would you like to do?"), message: nil, buttons: [
.destructive(Text("Delete"), action: {
DispatchQueue.main.asyncAfter(deadline: .now() + 0.5) {
viewModel.deletePost()
}
}),
.default(Text("Learn more..."), action: {
print("LEARN MORE PRESSED")
}),
.cancel()
])
}
}
struct FeedCell_Previews: PreviewProvider {
static var previews: some View {
FeedCell(viewModel: FeedCellViewModel(post: postExample))
}
}
this is the viewModel
import SwiftUI
import Firebase
class FeedCellViewModel: ObservableObject{
#Published var post: Post
var likeString: String{
let label = post.likes == 1 ? "like" : "likes"
return "\(post.likes) \(label)"
}
var timestampString: String{
let formatter = DateComponentsFormatter()
formatter.allowedUnits = [.second, .minute, .hour, .day, .weekOfMonth]
formatter.maximumUnitCount = 1
formatter.unitsStyle = .abbreviated
return formatter.string(from: post.timestamp.dateValue(), to: Date()) ?? ""
}
init(post: Post){
self.post = post
checkIfUserLikedPost()
fetchPostUser()
}
func like(){
guard let uid = AuthViewModel.shared.userSession?.uid else {return}
guard let postId = post.id else {return}
Firestore.firestore().collection("posts").document(post.id ?? "").collection("post-likes").document(uid).setData([:]){_ in
Firestore.firestore().collection("users").document(uid).collection("user-likes").document(postId).setData([:]){ _ in
Firestore.firestore().collection("posts").document(postId).updateData(["likes": self.post.likes + 1])
NotificationsViewModel.uploadNotification(toUid: self.post.ownerUid, type: .like, post: self.post)
self.post.didLike = true
self.post.likes += 1
}
}
}
func unlike(){
guard post.likes > 0 else {return}
guard let uid = AuthViewModel.shared.userSession?.uid else {return}
guard let postId = post.id else {return}
Firestore.firestore().collection("posts").document(post.id ?? "").collection("post-likes").document(uid).delete{_ in
Firestore.firestore().collection("users").document(uid).collection("user-likes").document(postId).delete{ _ in
Firestore.firestore().collection("posts").document(postId).updateData(["likes": self.post.likes - 1])
self.post.didLike = false
self.post.likes -= 1
}
}
}
func checkIfUserLikedPost(){
guard let uid = AuthViewModel.shared.userSession?.uid else {return}
guard let postId = post.id else {return}
Firestore.firestore().collection("users").document(uid).collection("user-likes").document(postId).getDocument{ snapshot, _ in
guard let didLike = snapshot?.exists else {return}
self.post.didLike = didLike
}
}
func deletePost(){
guard let postId = post.id else {return}
Firestore.firestore().collection("posts").document(postId).delete()
}
func fetchPostUser(){
Firestore.firestore().collection("users").document(post.ownerUid).getDocument { snapshot, _ in
self.post.user = try? snapshot?.data(as: User.self)
}
}
}