From 2ff85ebda13bfe920bed5fc7657f18a736a2b3e0 Mon Sep 17 00:00:00 2001
From: ryanzhao <ryanzhaors@qq.com>
Date: Wed, 5 Apr 2023 14:36:20 +0800
Subject: [PATCH] fix UI issues

---
 Podfile.lock                                  |  2 +-
 .../MediaInfoVC+MediaInfoView.swift           | 20 ++++++++++++-------
 .../Media Viewing & Editing/MediaInfoVC.swift |  6 +++---
 3 files changed, 17 insertions(+), 11 deletions(-)

diff --git a/Podfile.lock b/Podfile.lock
index 0239f9c29..9cd0a2706 100644
--- a/Podfile.lock
+++ b/Podfile.lock
@@ -242,6 +242,6 @@ SPEC CHECKSUMS:
   YYImage: f1ddd15ac032a58b78bbed1e012b50302d318331
   ZXingObjC: fdbb269f25dd2032da343e06f10224d62f537bdb
 
-PODFILE CHECKSUM: 2bf7639359fecebe56e9757d88f4eb48864652d2
+PODFILE CHECKSUM: 97324ae5888b01db2f2adc4dcc239e2e7d6867f7
 
 COCOAPODS: 1.11.3
diff --git a/Session/Media Viewing & Editing/MediaInfoVC+MediaInfoView.swift b/Session/Media Viewing & Editing/MediaInfoVC+MediaInfoView.swift
index 866bf7bcb..f79809e48 100644
--- a/Session/Media Viewing & Editing/MediaInfoVC+MediaInfoView.swift	
+++ b/Session/Media Viewing & Editing/MediaInfoVC+MediaInfoView.swift	
@@ -6,9 +6,10 @@ import SessionUtilitiesKit
 
 extension MediaInfoVC {
     final class MediaInfoView: UIView {
-        private static let cornerRadius: CGFloat = 8
+        private static let cornerRadius: CGFloat = 12
         
         private var attachment: Attachment?
+        private let width: CGFloat = MediaInfoVC.mediaSize - 2 * MediaInfoVC.arrowSize.width
         
         // MARK: - UI
         
@@ -80,7 +81,7 @@ extension MediaInfoVC {
             backgroundView.pin(to: self)
             
             let container: UIView = UIView()
-            container.set(.width, to: 245)
+            container.set(.width, to: self.width)
             
             // File ID
             let fileIdTitleLabel: UILabel = {
@@ -93,6 +94,7 @@ extension MediaInfoVC {
             }()
             let fileIdContainerStackView: UIStackView = UIStackView(arrangedSubviews: [ fileIdTitleLabel, fileIdLabel ])
             fileIdContainerStackView.axis = .vertical
+            fileIdContainerStackView.spacing = 6
             container.addSubview(fileIdContainerStackView)
             fileIdContainerStackView.pin([ UIView.HorizontalEdge.leading, UIView.HorizontalEdge.trailing, UIView.VerticalEdge.top ], to: container)
             
@@ -107,9 +109,10 @@ extension MediaInfoVC {
             }()
             let fileTypeContainerStackView: UIStackView = UIStackView(arrangedSubviews: [ fileTypeTitleLabel, fileTypeLabel ])
             fileTypeContainerStackView.axis = .vertical
+            fileTypeContainerStackView.spacing = 6
             container.addSubview(fileTypeContainerStackView)
             fileTypeContainerStackView.pin(.leading, to: .leading, of: container)
-            fileTypeContainerStackView.pin(.top, to: .bottom, of: fileIdContainerStackView, withInset: Values.mediumSpacing)
+            fileTypeContainerStackView.pin(.top, to: .bottom, of: fileIdContainerStackView, withInset: Values.largeSpacing)
             
             // File Size
             let fileSizeTitleLabel: UILabel = {
@@ -122,9 +125,10 @@ extension MediaInfoVC {
             }()
             let fileSizeContainerStackView: UIStackView = UIStackView(arrangedSubviews: [ fileSizeTitleLabel, fileSizeLabel ])
             fileSizeContainerStackView.axis = .vertical
+            fileSizeContainerStackView.spacing = 6
             container.addSubview(fileSizeContainerStackView)
             fileSizeContainerStackView.pin(.trailing, to: .trailing, of: container)
-            fileSizeContainerStackView.pin(.top, to: .bottom, of: fileIdContainerStackView, withInset: Values.mediumSpacing)
+            fileSizeContainerStackView.pin(.top, to: .bottom, of: fileIdContainerStackView, withInset: Values.largeSpacing)
             fileSizeContainerStackView.set(.width, to: 90)
             
             // Resolution
@@ -138,9 +142,10 @@ extension MediaInfoVC {
             }()
             let resolutionContainerStackView: UIStackView = UIStackView(arrangedSubviews: [ resolutionTitleLabel, resolutionLabel ])
             resolutionContainerStackView.axis = .vertical
+            resolutionContainerStackView.spacing = 6
             container.addSubview(resolutionContainerStackView)
             resolutionContainerStackView.pin(.leading, to: .leading, of: container)
-            resolutionContainerStackView.pin(.top, to: .bottom, of: fileTypeContainerStackView, withInset: Values.mediumSpacing)
+            resolutionContainerStackView.pin(.top, to: .bottom, of: fileTypeContainerStackView, withInset: Values.largeSpacing)
             
             // Duration
             let durationTitleLabel: UILabel = {
@@ -153,9 +158,10 @@ extension MediaInfoVC {
             }()
             let durationContainerStackView: UIStackView = UIStackView(arrangedSubviews: [ durationTitleLabel, durationLabel ])
             durationContainerStackView.axis = .vertical
+            durationContainerStackView.spacing = 6
             container.addSubview(durationContainerStackView)
             durationContainerStackView.pin(.trailing, to: .trailing, of: container)
-            durationContainerStackView.pin(.top, to: .bottom, of: fileSizeContainerStackView, withInset: Values.mediumSpacing)
+            durationContainerStackView.pin(.top, to: .bottom, of: fileSizeContainerStackView, withInset: Values.largeSpacing)
             durationContainerStackView.set(.width, to: 90)
             container.pin(.bottom, to: .bottom, of: durationContainerStackView)
             
@@ -178,7 +184,7 @@ extension MediaInfoVC {
             }()
             durationLabel.text = {
                 guard let duration = attachment.duration else { return "N/A" }
-                return "\(duration)"
+                return floor(duration).formatted(format: .hoursMinutesSeconds)
             }()
         }
     }
diff --git a/Session/Media Viewing & Editing/MediaInfoVC.swift b/Session/Media Viewing & Editing/MediaInfoVC.swift
index bad2c84b9..26711c83b 100644
--- a/Session/Media Viewing & Editing/MediaInfoVC.swift	
+++ b/Session/Media Viewing & Editing/MediaInfoVC.swift	
@@ -5,7 +5,7 @@ import SessionUIKit
 import SessionUtilitiesKit
 
 final class MediaInfoVC: BaseVC, SessionCarouselViewDelegate {
-    internal static let mediaSize: CGFloat = 293
+    internal static let mediaSize: CGFloat = UIScreen.main.bounds.width - 2 * Values.veryLargeSpacing
     internal static let arrowSize: CGSize = CGSize(width: 20, height: 30)
     
     private let attachments: [Attachment]
@@ -110,7 +110,7 @@ final class MediaInfoVC: BaseVC, SessionCarouselViewDelegate {
         mediaInfoView.update(attachment: attachments[0])
         
         mediaCarouselView.addSubview(fullScreenButton)
-        fullScreenButton.pin(.trailing, to: .trailing, of: mediaCarouselView, withInset: -(Values.smallSpacing + Self.arrowSize.width + Values.largeSpacing))
+        fullScreenButton.pin(.trailing, to: .trailing, of: mediaCarouselView, withInset: -(Values.smallSpacing + Values.veryLargeSpacing))
         fullScreenButton.pin(.bottom, to: .bottom, of: mediaCarouselView, withInset: -Values.smallSpacing)
         
         let stackView: UIStackView = UIStackView(arrangedSubviews: [ mediaCarouselView, mediaInfoView ])
@@ -120,7 +120,7 @@ final class MediaInfoVC: BaseVC, SessionCarouselViewDelegate {
         
         self.view.addSubview(stackView)
         stackView.pin([ UIView.HorizontalEdge.leading, UIView.HorizontalEdge.trailing ], to: self.view)
-        stackView.center(.vertical, in: self.view)
+        stackView.pin(.top, to: .top, of: self.view, withInset: Values.veryLargeSpacing)
     }
     
     // MARK: - Interaction