Create & Join rooms UI/UX tweaks (#1005)

* Fix people icon size

* Disable dismiss when loading in StartChatScreen

* Reduce debounce on search

* Add padding to invite button

* Add show/hide bottom bar behaviour

* Fix bg color in StartChatScreen form

* Update localisations

* Update search users results to 10

* Fix form background in InviteUsersScreen

* Fix invites list bg color

* Add mxid in InvitesScreenCell

* Refactor InvitesScreenCell design

* Fix separator spacing

* Add more design fixes

* Refine InvitesScreenCell layout

* Refactor UserProfileCell design

* Refactor FormRowAccessory

* Update localisations

* Fix camera size and security section padding

* Change create button style

* Refine InviteUsersScreenSelectedItem

* Refine CreateRoomScreen

* Refine UserProfileCell padding

* Amend preview name

* delete test code

* Add separator in security section

* Fix spacing in InviteUsersScreenSelectedItem

* Revert confirmationAction in CreateRoomScreen

* Refine HomeScreenInvitesButton

* Add dismiss keyboard in InviteUsersScreen

* Refactor FormRowAccessory

* Remove isDisabled from FormButtonStyles

* Update localisations

* Cleanup RoomDetailsEditScreen

* UI fixes on horizontal user carousel

* Refactor InviteUsersScreenSelectedItem

* Try fix flaky tests

* Fix typo

* Update snapshot tests

* Fix flaky UTs

* Fix HomeScreen ui tests

* Fix scroll on selection

* Refactor RoomFlowCoordinatorTests

ElementX/Sources/Screens/InviteUsersScreen/View/InviteUsersScreen.swift

@@ -23,6 +23,7 @@ struct InviteUsersScreen: View {
     var body: some View {
         mainContent
             .elementFormStyle()
+            .scrollDismissesKeyboard(.immediately)
             .navigationTitle(L10n.screenCreateRoomActionInvitePeople)
             .navigationBarTitleDisplayMode(.inline)
             .toolbar {
@@ -69,33 +70,38 @@ struct InviteUsersScreen: View {
             .accessibilityIdentifier(A11yIdentifiers.startChatScreen.searchNoResults)
     }
     
+    @ViewBuilder
     private var usersSection: some View {
-        Section {
-            ForEach(context.viewState.usersSection.users, id: \.userID) { user in
-                Button { context.send(viewAction: .toggleUser(user)) } label: {
-                    UserProfileCell(user: user,
-                                    membership: context.viewState.membershipState(user),
-                                    imageProvider: context.imageProvider)
+        if !context.viewState.usersSection.users.isEmpty {
+            Section {
+                ForEach(context.viewState.usersSection.users, id: \.userID) { user in
+                    Button { context.send(viewAction: .toggleUser(user)) } label: {
+                        UserProfileCell(user: user,
+                                        membership: context.viewState.membershipState(user),
+                                        imageProvider: context.imageProvider)
+                    }
+                    .disabled(context.viewState.isUserDisabled(user))
+                    .buttonStyle(FormButtonStyle(accessory: .selection(isSelected: context.viewState.isUserSelected(user))))
+                }
+            } header: {
+                if let title = context.viewState.usersSection.title {
+                    Text(title)
                 }
-                .buttonStyle(FormButtonStyle(isDisabled: context.viewState.isUserDisabled(user),
-                                             accessory: .selection(isSelected: context.viewState.isUserSelected(user))))
-            }
-        } header: {
-            if let title = context.viewState.usersSection.title {
-                Text(title)
             }
+            .listRowSeparator(.automatic)
+            .formSectionStyle()
+        } else {
+            Section.empty
         }
-        .listRowSeparator(.automatic)
-        .formSectionStyle()
     }
     
     @State private var frame: CGRect = .zero
-    @ScaledMetric private var cellWidth: CGFloat = 64
+    @ScaledMetric private var cellWidth: CGFloat = 72
 
     private var selectedUsersSection: some View {
         ScrollView(.horizontal, showsIndicators: false) {
             ScrollViewReader { scrollView in
-                HStack(spacing: 28) {
+                HStack(spacing: 16) {
                     ForEach(context.viewState.selectedUsers, id: \.userID) { user in
                         InviteUsersScreenSelectedItem(user: user, imageProvider: context.imageProvider) {
                             deselect(user)
@@ -109,7 +115,7 @@ struct InviteUsersScreen: View {
                         scrollView.scrollTo(id)
                     }
                 }
-                .padding(.horizontal, 18)
+                .padding(.horizontal, 14)
             }
         }
         .frame(width: frame.width)