From 361ac372c5218a62af3bd13837996426bffbd6f8 Mon Sep 17 00:00:00 2001
From: Mauro <34335419+Velin92@users.noreply.github.com>
Date: Thu, 8 Jun 2023 19:03:51 +0200
Subject: [PATCH] Timestamp for media messages (#1057)

* timestamp for media messages

* changelog
---
 .../Style/TimelineItemBubbledStylerView.swift | 23 +++++++++++++------
 .../View/Timeline/ImageRoomTimelineView.swift |  3 ++-
 changelog.d/pr-1057.feature                   |  1 +
 3 files changed, 19 insertions(+), 8 deletions(-)
 create mode 100644 changelog.d/pr-1057.feature

diff --git a/ElementX/Sources/Screens/RoomScreen/View/Style/TimelineItemBubbledStylerView.swift b/ElementX/Sources/Screens/RoomScreen/View/Style/TimelineItemBubbledStylerView.swift
index 118660f0b..d96cc02e7 100644
--- a/ElementX/Sources/Screens/RoomScreen/View/Style/TimelineItemBubbledStylerView.swift
+++ b/ElementX/Sources/Screens/RoomScreen/View/Style/TimelineItemBubbledStylerView.swift
@@ -130,8 +130,8 @@ struct TimelineItemBubbledStylerView<Content: View>: View {
 
     @ViewBuilder
     var styledContent: some View {
-        if shouldAvoidBubbling {
-            contentWithReply
+        if isMediaType {
+            contentWithTimestamp
                 .bubbleStyle(inset: false,
                              cornerRadius: cornerRadius,
                              corners: roundedCorners)
@@ -147,11 +147,20 @@ struct TimelineItemBubbledStylerView<Content: View>: View {
     @ViewBuilder
     var contentWithTimestamp: some View {
         if isTextItem {
-            ZStack(alignment: .topLeading) {
+            ZStack(alignment: .bottomTrailing) {
                 contentWithReply
-                    .layoutPriority(1)
                 localizedSendInfo
-                    .frame(maxWidth: .infinity, maxHeight: .infinity, alignment: .bottomTrailing)
+            }
+        } else if isMediaType {
+            ZStack(alignment: .bottomTrailing) {
+                contentWithReply
+                localizedSendInfo
+                    .padding(.horizontal, 4)
+                    .padding(.vertical, 2)
+                    .background(Color.element.system)
+                    .cornerRadius(10)
+                    .padding(.trailing, 4)
+                    .padding(.bottom, 4)
             }
         } else {
             HStack(alignment: .bottom, spacing: 4) {
@@ -176,7 +185,7 @@ struct TimelineItemBubbledStylerView<Content: View>: View {
         }
         .font(.compound.bodyXS)
         .foregroundColor(timelineItem.properties.deliveryStatus == .sendingFailed ? .element.alert : .element.secondaryContent)
-        .padding(.bottom, -4)
+        .padding(.bottom, isMediaType ? 0 : -4)
     }
     
     @ViewBuilder
@@ -213,7 +222,7 @@ struct TimelineItemBubbledStylerView<Content: View>: View {
         return timelineGroupStyle == .single || timelineGroupStyle == .first ? 8 : 0
     }
 
-    private var shouldAvoidBubbling: Bool {
+    private var isMediaType: Bool {
         timelineItem is ImageRoomTimelineItem || timelineItem is VideoRoomTimelineItem || timelineItem is StickerRoomTimelineItem
     }
     
diff --git a/ElementX/Sources/Screens/RoomScreen/View/Timeline/ImageRoomTimelineView.swift b/ElementX/Sources/Screens/RoomScreen/View/Timeline/ImageRoomTimelineView.swift
index 20b97db59..0a77d9cd4 100644
--- a/ElementX/Sources/Screens/RoomScreen/View/Timeline/ImageRoomTimelineView.swift
+++ b/ElementX/Sources/Screens/RoomScreen/View/Timeline/ImageRoomTimelineView.swift
@@ -57,7 +57,8 @@ struct ImageRoomTimelineView_Previews: PreviewProvider {
     static let viewModel = RoomScreenViewModel.mock
     
     static var previews: some View {
-        body.environmentObject(viewModel.context)
+        body
+            .environmentObject(viewModel.context)
         body
             .environment(\.timelineStyle, .plain)
             .environmentObject(viewModel.context)
diff --git a/changelog.d/pr-1057.feature b/changelog.d/pr-1057.feature
new file mode 100644
index 000000000..4d9566864
--- /dev/null
+++ b/changelog.d/pr-1057.feature
@@ -0,0 +1 @@
+Timestamp added to non bubbled messages like images and videos for bubble style.
\ No newline at end of file