Read Receipts display with the user avatar (#1038)

* added the read receipt into the code

* fixed some things lost during merge

* implemented the status view to be always at the trailing side

* preview code for better testing

* removed timelineStyle modifier

* removed also the group style

* added some UI tests for the read receipts

ElementX/Sources/Screens/Settings/DeveloperOptionsScreen/DeveloperOptionsScreenModels.swift

@@ -27,10 +27,12 @@ struct DeveloperOptionsScreenViewState: BindableState {
 struct DeveloperOptionsScreenViewStateBindings {
     var shouldCollapseRoomStateEvents: Bool
     var userSuggestionsEnabled: Bool
+    var readReceiptsEnabled: Bool
 }
 
 enum DeveloperOptionsScreenViewAction {
     case changedShouldCollapseRoomStateEvents
     case changedUserSuggestionsEnabled
+    case changedReadReceiptsEnabled
     case clearCache
 }

ElementX/Sources/Screens/Settings/DeveloperOptionsScreen/DeveloperOptionsScreenViewModel.swift

@@ -26,7 +26,8 @@ class DeveloperOptionsScreenViewModel: DeveloperOptionsScreenViewModelType, Deve
     init() {
         appSettings = ServiceLocator.shared.settings
         let bindings = DeveloperOptionsScreenViewStateBindings(shouldCollapseRoomStateEvents: appSettings.shouldCollapseRoomStateEvents,
-                                                               userSuggestionsEnabled: appSettings.userSuggestionsEnabled)
+                                                               userSuggestionsEnabled: appSettings.userSuggestionsEnabled,
+                                                               readReceiptsEnabled: appSettings.readReceiptsEnabled)
         let state = DeveloperOptionsScreenViewState(bindings: bindings)
         
         super.init(initialViewState: state)
@@ -42,6 +43,8 @@ class DeveloperOptionsScreenViewModel: DeveloperOptionsScreenViewModelType, Deve
             appSettings.shouldCollapseRoomStateEvents = state.bindings.shouldCollapseRoomStateEvents
         case .changedUserSuggestionsEnabled:
             appSettings.userSuggestionsEnabled = state.bindings.userSuggestionsEnabled
+        case .changedReadReceiptsEnabled:
+            appSettings.readReceiptsEnabled = state.bindings.readReceiptsEnabled
         case .clearCache:
             callback?(.clearCache)
         }

ElementX/Sources/Screens/Settings/DeveloperOptionsScreen/View/DeveloperOptionsScreen.swift

@@ -36,6 +36,13 @@ struct DeveloperOptionsScreen: View {
                 .onChange(of: context.userSuggestionsEnabled) { _ in
                     context.send(viewAction: .changedUserSuggestionsEnabled)
                 }
+
+                Toggle(isOn: $context.readReceiptsEnabled) {
+                    Text("Show read receipts")
+                }
+                .onChange(of: context.readReceiptsEnabled) { _ in
+                    context.send(viewAction: .changedReadReceiptsEnabled)
+                }
             }
             
             Section {