Add RTE formatting buttons (#1614)

* Add RTE formatting buttons

* Update UUID as stored properties

* Disable autocorrection on URL fields

* Alert ids to let

* Add ComposerToolbar_Previews

* Cleanup

* Cleanup

* Refactor FormatItem colors

* Fix composer layout issue

* Fix ui tests

* Nest ComposerToolbar A11y ids under RoomScreen

* Add composer reply ui tests

* Add UTs

---------

Co-authored-by: Alfonso Grillo <alfogrillo@gmail.com>

ElementX/Sources/Other/AccessibilityIdentifiers.swift

@@ -106,12 +106,32 @@ struct A11yIdentifiers {
     struct RoomScreen {
         let name = "room-name"
         let avatar = "room-avatar"
-        let attachmentPicker = "room-attachment_picker"
         let attachmentPickerPhotoLibrary = "room-attachment_picker_photo_library"
         let attachmentPickerDocuments = "room-attachment_picker_documents"
         let attachmentPickerCamera = "room-attachment_picker_camera"
         let attachmentPickerLocation = "room-attachment_picker_location"
+        let attachmentPickerPoll = "room-attachment_picker_poll"
+        let attachmentPickerTextFormatting = "room-attachment_picker_text_formatting"
         let timelineItemActionMenu = "room-timeline_item_action_menu"
+
+        let composerToolbar = ComposerToolbar()
+
+        struct ComposerToolbar {
+            let bold = "composer_toolbar-bold"
+            let italic = "composer_toolbar-italic"
+            let underline = "composer_toolbar-underline"
+            let strikethrough = "composer_toolbar-strikethrough"
+            let unorderedList = "composer_toolbar-unordered_list"
+            let orderedList = "composer_toolbar-ordered_list"
+            let indent = "composer_toolbar-indent"
+            let unindent = "composer_toolbar-unindent"
+            let inlineCode = "composer_toolbar-inline_code"
+            let codeBlock = "composer_toolbar-code_block"
+            let quote = "composer_toolbar-quote"
+            let link = "composer_toolbar-link"
+            let openComposeOptions = "composer_toolbar-open_compose_options"
+            let closeFormattingOptions = "composer_toolbar-close-formatting-options"
+        }
     }
     
     struct RoomDetailsScreen {

ElementX/Sources/Other/Extensions/Alert.swift

@@ -52,12 +52,21 @@ extension View {
 ///     .alert(item: $context.alertInfo)
 /// ```
 struct AlertInfo<T: Hashable>: Identifiable, AlertProtocol {
-    struct AlertButton {
+    struct AlertButton: Identifiable {
+        let id = UUID()
         let title: String
         var role: ButtonRole?
         let action: (() -> Void)?
     }
 
+    struct AlertTextField: Identifiable {
+        let id = UUID()
+        let placeholder: String
+        let text: Binding<String>
+        let autoCapitalization: TextInputAutocapitalization
+        let autoCorrectionDisabled: Bool
+    }
+
     /// An identifier that can be used to distinguish one error from another.
     let id: T
     /// The alert's title.
@@ -68,6 +77,10 @@ struct AlertInfo<T: Hashable>: Identifiable, AlertProtocol {
     var primaryButton = AlertButton(title: L10n.actionOk, action: nil)
     /// The alert's secondary button title and action.
     var secondaryButton: AlertButton?
+    /// The alert's displayed text fields.
+    var textFields: [AlertTextField]?
+    /// The alert's additional buttons displayed vertically above the primary button.
+    var verticalButtons: [AlertButton]?
 }
 
 extension AlertInfo {
@@ -95,9 +108,28 @@ extension AlertInfo {
 extension View {
     func alert<T: Hashable>(item: Binding<AlertInfo<T>?>) -> some View {
         alert(item: item) { item in
+            if let verticalButtons = item.verticalButtons {
+                ForEach(verticalButtons) { button in
+                    Button(button.title, role: button.role) {
+                        button.action?()
+                    }
+                }
+            }
+
+            if let textFields = item.textFields {
+                VStack(spacing: 24) {
+                    ForEach(textFields) { textField in
+                        TextField(textField.placeholder, text: textField.text)
+                            .textInputAutocapitalization(textField.autoCapitalization)
+                            .autocorrectionDisabled(textField.autoCorrectionDisabled)
+                    }
+                }
+            }
+
             Button(item.primaryButton.title, role: item.primaryButton.role) {
                 item.primaryButton.action?()
             }
+
             if let secondaryButton = item.secondaryButton {
                 Button(secondaryButton.title, role: secondaryButton.role) {
                     secondaryButton.action?()