17日目、プロフィール編集

今日はプロフィールページにてプロフィールのアップデート機能を実装しました。

まず昨日の投稿削除の機能の・・・が気に入らなかったのでまずはそこを少し変更します！

このアイコンに変更しようと思います。

次からプロフィール編集画面です。

1.UIを設定

2.API処理

①プロフィール画像の更新

static func updateProfileImage(forUser user: User, image: UIImage, completion: @escaping(String?, Error?) -> Void) {
       guard let uid = Auth.auth().currentUser?.uid else { return }
       
       Storage.storage().reference(forURL: user.profileImageUrl).delete(completion: nil)
               
       ImageUploader.uploadImage(image: image) { profileImageUrl in
           let data = ["profileImageUrl": profileImageUrl]
           
           COLLECTION_USERS.document(uid).updateData(data) { error in
               if let error = error {
                   completion(nil, error)
                   return
               }
               
               COLLECTION_POSTS.whereField("ownerUid", isEqualTo: user.uid).getDocuments { snapshot, error in
                   guard let documents = snapshot?.documents else { return }
                   let data = ["ownerImageUrl": profileImageUrl]
                   documents.forEach({ COLLECTION_POSTS.document($0.documentID).updateData(data) })
               }
               
                            
               completion(profileImageUrl, nil)
           }
       }
   }

ここでの処理は以下のようになっています。

まず、現在のユーザを取得します。またその後、渡されたユーザが持っているプロフィール画像をストレージから削除します。

その後、既に作成ズミのImageUploaderを使用し、新しい画像をDBにのせていきます。その処理としては取得したuidからそのドキュメントのprofileImageUrlを更新します。また投稿の画像も変更するため、投稿のownerUidとユーザのuidが同じものを特定し、その条件を満たす全ての投稿に対し、画像を更新します。そして最後にprofileImageUrlを返します。

これと同じ処理をコメントでもしますが、今日ははしょりましたw

②ユーザのデータの更新

static func saveUserData(user: User, completion: @escaping(FirestoreCompletion)) {
       guard let uid = Auth.auth().currentUser?.uid else { return }
       
       let data: [String: Any] = ["email": user.email,
                                  "fullname": user.fullname,
                                  "profileImageUrl": user.profileImageUrl,
                                  "uid": uid,
                                  "username": user.username]
       
       COLLECTION_USERS.document(uid).setData(data, completion: completion)
   }

これは過去に実装した機能に類似する点が多いので説明は割愛しますが、これにより、ユーザ情報を更新します。

3.動作確認

画像を少しアップめに、ユーザーネームをワンピースに変更してみます

そうすると

変更が確認されました！

DB上でもきっちり更新されています！

今日は以上になります。