HeaderViewを共通化、 MessageのEmptyViewを作成

TwitterSwiftUI.xcodeproj/project.pbxproj

@@ -14,6 +14,7 @@
 		2DC291482ADA3D49006E9E23 /* Message.swift in Sources */ = {isa = PBXBuildFile; fileRef = 2DC291472ADA3D49006E9E23 /* Message.swift */; };
 		2DC2914A2ADA3FC9006E9E23 /* ConversationsViewModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = 2DC291492ADA3FC9006E9E23 /* ConversationsViewModel.swift */; };
 		2DC2914C2ADA504C006E9E23 /* ConversationRowView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 2DC2914B2ADA504C006E9E23 /* ConversationRowView.swift */; };
+		2DC4D9432ADBBD4C0066FF02 /* NavigationHeaderView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 2DC4D9422ADBBD4C0066FF02 /* NavigationHeaderView.swift */; };
 		2DE08BE72ADAEBF900DAA3C4 /* NewTweetButton.swift in Sources */ = {isa = PBXBuildFile; fileRef = 2DE08BE62ADAEBF900DAA3C4 /* NewTweetButton.swift */; };
 		FF170EE32AD29E7800B90E2D /* PreviewProvider.swift in Sources */ = {isa = PBXBuildFile; fileRef = FF170EE22AD29E7800B90E2D /* PreviewProvider.swift */; };
 		FF170EE52AD2A09E00B90E2D /* RegistrationViewModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = FF170EE42AD2A09E00B90E2D /* RegistrationViewModel.swift */; };
@@ -107,6 +108,7 @@
 		2DC291472ADA3D49006E9E23 /* Message.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = Message.swift; sourceTree = "<group>"; };
 		2DC291492ADA3FC9006E9E23 /* ConversationsViewModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ConversationsViewModel.swift; sourceTree = "<group>"; };
 		2DC2914B2ADA504C006E9E23 /* ConversationRowView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ConversationRowView.swift; sourceTree = "<group>"; };
+		2DC4D9422ADBBD4C0066FF02 /* NavigationHeaderView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = NavigationHeaderView.swift; sourceTree = "<group>"; };
 		2DE08BE62ADAEBF900DAA3C4 /* NewTweetButton.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = NewTweetButton.swift; sourceTree = "<group>"; };
 		FF170EE22AD29E7800B90E2D /* PreviewProvider.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = PreviewProvider.swift; sourceTree = "<group>"; };
 		FF170EE42AD2A09E00B90E2D /* RegistrationViewModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = RegistrationViewModel.swift; sourceTree = "<group>"; };
@@ -390,6 +392,7 @@
 				FF2EE4E82ABEF042000522CF /* SideMenu */,
 				FF4C5D742AD27A3C003F3E90 /* TabBar */,
 				FF44B9412ABC8BB9005B87F4 /* Profile */,
+				2DC4D9422ADBBD4C0066FF02 /* NavigationHeaderView.swift */,
 			);
 			path = Core;
 			sourceTree = "<group>";
@@ -670,6 +673,7 @@
 			buildActionMask = 2147483647;
 			files = (
 				FFACF2BA2AC1A78400A2C911 /* FeedViewModel.swift in Sources */,
+				2DC4D9432ADBBD4C0066FF02 /* NavigationHeaderView.swift in Sources */,
 				FF170EEA2AD2A84F00B90E2D /* ProfilePhotoSelectViewModel.swift in Sources */,
 				FF44B9472ABC8C21005B87F4 /* ChatView.swift in Sources */,
 				FF44B94B2ABC8D6A005B87F4 /* ProfileView.swift in Sources */,

TwitterSwiftUI/Core/FeedView.swift

@@ -20,11 +20,10 @@ struct FeedView: View {
 
         NavigationStack {
 
-            headerView
+            NavigationHeaderView(showSideMenu: $showSideMenu, user: $viewModel.currentUser)
 
             ZStack(alignment: .leading) {
 
-
                 PagerTabView(
                     selected: $viewModel.currentTab, tabs:
                         [
@@ -74,42 +73,6 @@ struct FeedView: View {
 
 }
 
-extension FeedView {
-    var headerView: some View {
-        VStack(spacing: 0) {
-            ZStack {
-                HStack {
-                    Button {
-                        showSideMenu.toggle()
-                    } label: {
-                        Group {
-                            if let iconUrl = viewModel.currentUser?.profileImageUrl {
-                                KFImage(URL(string: iconUrl))
-                                    .resizable()
-                                    .scaledToFill()
-                            } else {
-                                Image(systemName: "person.fill")
-                                    .resizable()
-                                    .scaledToFill()
-                            }
-                        }
-                        .foregroundColor(.gray)
-                        .padding(.all, 4)
-                        .background(.gray.opacity(0.3))
-                        .frame(width: 35, height: 35)
-                        .clipShape(Circle())
-                    }
-
-                    Spacer()
-                }
-
-                xLogoSmall
-            }
-            .padding(.horizontal)
-        }
-    }
-}
-
 #Preview {
     FeedView(showSideMenu: .constant(false))
 }

TwitterSwiftUI/Core/NavigationHeaderView.swift

@@ -0,0 +1,63 @@
+//
+//  NavigationHeaderView.swift
+//  TwitterSwiftUI
+//
+//  Created by paku on 2023/10/15.
+//
+
+import SwiftUI
+import Kingfisher
+
+struct NavigationHeaderView: View {
+
+    @Binding var showSideMenu: Bool
+
+    @Binding var user: User?
+
+    var headerTitle: String = ""
+
+    var body: some View {
+        VStack(spacing: 0) {
+            ZStack {
+                HStack {
+                    Button {
+                        showSideMenu.toggle()
+                    } label: {
+                        Group {
+                            if let iconUrl = user?.profileImageUrl {
+                                KFImage(URL(string: iconUrl))
+                                    .resizable()
+                                    .scaledToFill()
+                            } else {
+                                Image(systemName: "person.fill")
+                                    .resizable()
+                                    .scaledToFill()
+                            }
+                        }
+                        .foregroundColor(.gray)
+                        .padding(.all, 4)
+                        .background(.gray.opacity(0.3))
+                        .frame(width: 35, height: 35)
+                        .clipShape(Circle())
+                    }
+
+                    Spacer()
+                }
+
+                if headerTitle.isEmpty {
+                    xLogoSmall
+                } else {
+                    Text(headerTitle)
+                        .bold()
+                        .foregroundStyle(.black)
+                }
+
+            }
+            .padding(.horizontal)
+        }
+    }
+}
+
+#Preview {
+    NavigationHeaderView(showSideMenu: .constant(false), user: .constant(PreviewProvider.shared.user))
+}

TwitterSwiftUI/Core/TabBar/Conversations/ConversationsView.swift

@@ -9,34 +9,85 @@ import SwiftUI
 
 struct ConversationsView: View {
 
+    @Binding var showSideMenu: Bool
     @StateObject var viewModel: ConversationsViewModel
 
-    init() {
+    init(showSideMenu: Binding<Bool>) {
+        _showSideMenu = showSideMenu
         _viewModel = .init(wrappedValue: ConversationsViewModel())
     }
 
     var body: some View {
 
         NavigationStack {
-            ScrollView(.vertical, showsIndicators: false) {
-                LazyVStack {
-                    ForEach(viewModel.recentMessages) { message in
-
-                        NavigationLink {
-                            ChatView(user: message.user)
-                                .navigationBarBackButtonHidden()
-                        } label: {
-                            ConversationRowView(message: message)
+
+            NavigationHeaderView(showSideMenu: $showSideMenu, user: $viewModel.currentUser, headerTitle: "メッセージ")
+
+            ZStack {
+                ScrollView(.vertical, showsIndicators: false) {
+
+                    if viewModel.recentMessages.isEmpty && !viewModel.showLoading {
+                        emptyView
+                    } else {
+                        LazyVStack {
+                            ForEach(viewModel.recentMessages) { message in
+
+                                NavigationLink {
+                                    ChatView(user: message.user)
+                                        .navigationBarBackButtonHidden()
+                                } label: {
+                                    ConversationRowView(message: message)
+                                }
+                            }
                         }
                     }
+
+                    if viewModel.showLoading { ProgressView() }
                 }
             }
-            .navigationTitle("チャット")
-            .navigationBarTitleDisplayMode(.inline)
+
         }
     }
 }
 
+extension ConversationsView {
+
+    var emptyView: some View {
+        VStack(alignment: .leading, spacing: 10) {
+            Text("受信トレイへようこそ")
+                .font(.title)
+                .fontWeight(.heavy)
+
+            Text("Drop a line, share posts and more with private conversations between you and others on X.")
+                .foregroundStyle(.secondary)
+
+            Button {
+
+            } label: {
+                Button {
+
+                } label: {
+                    Text("メッセージを書く")
+                        .bold()
+                        .foregroundStyle(.white)
+                        .padding(.vertical)
+                        .padding(.horizontal, 30)
+                        .background(
+                            RoundedRectangle(cornerRadius: 25)
+                        )
+                }
+            }
+            .padding(.top, 20)
+
+        }
+        .frame(maxWidth: .infinity, alignment: .leading)
+        .padding(.horizontal)
+        .padding(.vertical, 30)
+
+
+    }
+}
+
 #Preview {
-    ConversationsView()
+    ConversationsView(showSideMenu: .constant(false))
 }

TwitterSwiftUI/Core/TabBar/Conversations/ConversationsViewModel.swift

@@ -6,24 +6,39 @@
 //
 
 import Firebase
+import Combine
 
 class ConversationsViewModel: ObservableObject {
 
     @Published var recentMessages: [Message] = []
+    @Published var currentUser: User?
+    @Published var showLoading: Bool = false
+
+    var cancellable = Set<AnyCancellable>()
 
     // Recentメッセージはユーザーに対して1つのメッセージのみを保証
     private var recentMessagesDic = [String: Message]()
 
     init() {
+        setupSubscribers()
         fetchRecentMessages()
     }
 
+    func setupSubscribers() {
+
+        AuthService.shared.$currentUser.sink { [weak self] user in
+            self?.currentUser = user
+        }
+        .store(in: &cancellable)
+    }
+
     func fetchRecentMessages() {
         guard let currentUid = AuthService.shared.userSession?.uid else { return }
 
         let recentMessagesRef = Firestore.firestore().collection("messages").document(currentUid).collection("recent-messages")
         recentMessagesRef.order(by: "timestamp", descending: true)
 
+        showLoading = true
         recentMessagesRef.addSnapshotListener { [weak self] snapshot, error in
             guard let changes = snapshot?.documentChanges, let self = self else { return }
 
@@ -38,7 +53,7 @@ class ConversationsViewModel: ObservableObject {
 
                     //最新データがトップにくるように並べ替え
                     self.sortMessagesByLatest()
-
+                    self.showLoading = false
                 } else {
 
                     Firestore.firestore().collection("users").document(partnerUId).getDocument { [weak self] snapshot, _ in
@@ -49,6 +64,7 @@ class ConversationsViewModel: ObservableObject {
 
                         //最新データがトップにくるように並べ替え
                         sortMessagesByLatest()
+                        self.showLoading = false
                     }
                 }
             }

TwitterSwiftUI/Core/TabBar/MainTab/MainTabView.swift

@@ -45,7 +45,7 @@ struct MainTabView: View {
                         NotificationsView()
                             .tag(MainTabBarFilter.notifications)
 
-                        ConversationsView()
+                        ConversationsView(showSideMenu: $showSideMenu)
                             .tag(MainTabBarFilter.messages)
                     }