SwiftUI timeline refactor + TimelineViewState decoupling (#1392)

* swiftUI conversion + scroll to bottom

* remove unused

* back pagination implemented, however when a lot of elements are in the scroll the perfomance diminishes not sure what may be causing it

* scroll adapter solution

* way better

* works but height animation in cells are broken

* code improvement

* everything implemented

* rebase fix

* fix

* doc

* fix test compilation

* code improvement and animation improvement

* code improvement

* code improvements

* tests updated.

* pr comments

* better identifiers

* fix

* some PR comments

* pr comments

ElementX/Sources/Screens/RoomScreen/View/RoomScreen.swift

@@ -24,7 +24,7 @@ struct RoomScreen: View {
     
     var body: some View {
         timeline
-            .background(Color.compound.bgCanvasDefault.ignoresSafeArea()) // Kills the toolbar translucency.
+            .background(Color.compound.bgCanvasDefault.ignoresSafeArea())
             .safeAreaInset(edge: .bottom, spacing: 0) {
                 HStack(alignment: .bottom, spacing: attachmentButtonPadding) {
                     RoomAttachmentPicker(context: context)
@@ -36,6 +36,7 @@ struct RoomScreen: View {
                 .padding(.trailing, 12)
                 .padding(.top, 8)
                 .padding(.bottom)
+                .background(Color.compound.bgCanvasDefault.ignoresSafeArea())
             }
             .navigationBarTitleDisplayMode(.inline)
             .toolbar { toolbar }
@@ -80,14 +81,13 @@ struct RoomScreen: View {
                 }
             }
     }
-    
+
     private var timeline: some View {
-        TimelineView()
+        TimelineView(viewState: context.viewState.timelineViewState)
             .id(context.viewState.roomId)
             .environmentObject(context)
             .environment(\.timelineStyle, context.viewState.timelineStyle)
             .environment(\.readReceiptsEnabled, context.viewState.readReceiptsEnabled)
-            .overlay(alignment: .bottomTrailing) { scrollToBottomButton }
     }
     
     private var messageComposer: some View {
@@ -108,27 +108,6 @@ struct RoomScreen: View {
         }
     }
     
-    private var scrollToBottomButton: some View {
-        Button { context.viewState.scrollToBottomPublisher.send(()) } label: {
-            Image(systemName: "chevron.down")
-                .font(.compound.bodyLG)
-                .fontWeight(.semibold)
-                .foregroundColor(.compound.iconSecondary)
-                .padding(13)
-                .offset(y: 1)
-                .background {
-                    Circle()
-                        .fill(Color.compound.iconOnSolidPrimary)
-                        // Intentionally using system primary colour to get white/black.
-                        .shadow(color: .primary.opacity(0.33), radius: 2.0)
-                }
-                .padding()
-        }
-        .opacity(context.scrollToBottomButtonVisible ? 1.0 : 0.0)
-        .accessibilityHidden(!context.scrollToBottomButtonVisible)
-        .animation(.elementDefault, value: context.scrollToBottomButtonVisible)
-    }
-    
     @ViewBuilder
     private var loadingIndicator: some View {
         if context.viewState.showLoading {