From b835b55394d56f5c21ba9c235d6c70b478877c6c Mon Sep 17 00:00:00 2001
From: Stefan Ceriu <stefanc@matrix.org>
Date: Wed, 18 Jan 2023 09:24:21 +0200
Subject: [PATCH] Fixes #388 - Prevent long room names from breaking the room
 navigation bar layout (#453)

---
 .../Screens/RoomScreen/RoomScreenModels.swift |  2 +-
 .../RoomScreen/RoomScreenViewModel.swift      |  2 +-
 .../RoomScreen/View/RoomHeaderView.swift      | 20 +++++++++----------
 .../Screens/RoomScreen/View/RoomScreen.swift  | 13 +++++++++++-
 changelog.d/388.bugfix                        |  1 +
 5 files changed, 25 insertions(+), 13 deletions(-)
 create mode 100644 changelog.d/388.bugfix

diff --git a/ElementX/Sources/Screens/RoomScreen/RoomScreenModels.swift b/ElementX/Sources/Screens/RoomScreen/RoomScreenModels.swift
index fec098a41..3a9c16fa2 100644
--- a/ElementX/Sources/Screens/RoomScreen/RoomScreenModels.swift
+++ b/ElementX/Sources/Screens/RoomScreen/RoomScreenModels.swift
@@ -31,7 +31,7 @@ enum RoomScreenComposerMode: Equatable {
 }
 
 enum RoomScreenViewAction {
-    case headerTapped
+    case displayRoomDetails
     case displayEmojiPicker(itemId: String)
     case paginateBackwards
     case itemAppeared(id: String)
diff --git a/ElementX/Sources/Screens/RoomScreen/RoomScreenViewModel.swift b/ElementX/Sources/Screens/RoomScreen/RoomScreenViewModel.swift
index e3fb1e45d..bf2f933b4 100644
--- a/ElementX/Sources/Screens/RoomScreen/RoomScreenViewModel.swift
+++ b/ElementX/Sources/Screens/RoomScreen/RoomScreenViewModel.swift
@@ -94,7 +94,7 @@ class RoomScreenViewModel: RoomScreenViewModelType, RoomScreenViewModelProtocol
     // swiftlint:disable:next cyclomatic_complexity
     override func process(viewAction: RoomScreenViewAction) async {
         switch viewAction {
-        case .headerTapped:
+        case .displayRoomDetails:
             callback?(.displayRoomDetails)
         case .paginateBackwards:
             await paginateBackwards()
diff --git a/ElementX/Sources/Screens/RoomScreen/View/RoomHeaderView.swift b/ElementX/Sources/Screens/RoomScreen/View/RoomHeaderView.swift
index f1b5da4b7..88a62e8a3 100644
--- a/ElementX/Sources/Screens/RoomScreen/View/RoomHeaderView.swift
+++ b/ElementX/Sources/Screens/RoomScreen/View/RoomHeaderView.swift
@@ -24,16 +24,16 @@ struct RoomHeaderView: View {
     @ObservedObject var context: RoomScreenViewModel.Context
 
     var body: some View {
-        Button {
-            context.send(viewAction: .headerTapped)
-        } label: {
-            HStack(spacing: 8) {
-                roomAvatar
-                    .accessibilityHidden(true)
-                Text(context.viewState.roomTitle)
-                    .font(.element.headline)
-                    .accessibilityIdentifier("roomNameLabel")
-            }
+        HStack(spacing: 8) {
+            roomAvatar
+                .accessibilityHidden(true)
+            Text(context.viewState.roomTitle)
+                .font(.element.headline)
+                .accessibilityIdentifier("roomNameLabel")
+        }
+        // Using a button stops is from getting truncated in the navigation bar
+        .onTapGesture {
+            context.send(viewAction: .displayRoomDetails)
         }
     }
 
diff --git a/ElementX/Sources/Screens/RoomScreen/View/RoomScreen.swift b/ElementX/Sources/Screens/RoomScreen/View/RoomScreen.swift
index 0d1dc37b0..860cd137b 100644
--- a/ElementX/Sources/Screens/RoomScreen/View/RoomScreen.swift
+++ b/ElementX/Sources/Screens/RoomScreen/View/RoomScreen.swift
@@ -75,10 +75,21 @@ struct RoomScreen: View {
         }
     }
     
+    @ToolbarContentBuilder
     var toolbar: some ToolbarContent {
-        ToolbarItem(placement: .navigationBarLeading) {
+        // .principal + .primaryAction works better than .navigation leading + trailing
+        // as the latter disables interaction in the action button for rooms with long names
+        ToolbarItem(placement: .principal) {
             RoomHeaderView(context: context)
         }
+        
+        ToolbarItem(id: "RoomDetailsAction", placement: .secondaryAction, showsByDefault: false) {
+            Button {
+                context.send(viewAction: .displayRoomDetails)
+            } label: {
+                Label("Room Details", systemImage: "info.circle")
+            }
+        }
     }
     
     private func sendMessage() {
diff --git a/changelog.d/388.bugfix b/changelog.d/388.bugfix
new file mode 100644
index 000000000..ba92ace65
--- /dev/null
+++ b/changelog.d/388.bugfix
@@ -0,0 +1 @@
+Prevent long room names from breaking the room navigation bar layout
\ No newline at end of file