Skip to content

Commit 8c5eda2

Browse files
martinmitrevskimartinmitrevski
authored
Fix inconsistencies in gallery view displaying images and videos (#927)
1 parent 4d3a930 commit 8c5eda2

File tree

11 files changed

+57
-36
lines changed

11 files changed

+57
-36
lines changed

‎CHANGELOG.md‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
44
# Upcoming
55

66
### 🐞 Fixed
7+
- Fix inconsistencies in gallery view displaying images and videos [927](https://github.com/GetStream/stream-chat-swiftui/pull/927)
78
- Prevent audio messages increasing width in reply mode [#926](https://github.com/GetStream/stream-chat-swiftui/pull/926)
89

910
# [4.85.0](https://github.com/GetStream/stream-chat-swiftui/releases/tag/4.85.0)

‎Sources/StreamChatSwiftUI/ChatChannel/ChannelInfo/MediaAttachmentsView.swift‎

Lines changed: 11 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -54,25 +54,17 @@ public struct MediaAttachmentsView<Factory: ViewFactory>: View {
5454
ForEach(0..<viewModel.mediaItems.count, id: \.self) { mediaItemIndex in
5555
let mediaItem = viewModel.mediaItems[mediaItemIndex]
5656
ZStack {
57-
if !mediaItem.isVideo, let imageAttachment = mediaItem.imageAttachment {
58-
let index = viewModel.allImageAttachments.firstIndex { $0.id == imageAttachment.id } ?? 0
59-
ImageAttachmentContentView(
57+
if let mediaAttachment = mediaItem.mediaAttachment {
58+
let index = viewModel.allMediaAttachments.firstIndex { $0.id == mediaAttachment.id
59+
} ?? 0
60+
MediaAttachmentContentView(
6061
factory: factory,
6162
mediaItem: mediaItem,
62-
imageAttachment: imageAttachment,
63-
allImageAttachments: viewModel.allImageAttachments,
63+
mediaAttachment: mediaAttachment,
64+
allMediaAttachments: viewModel.allMediaAttachments,
6465
itemWidth: Self.itemWidth,
6566
index: index
6667
)
67-
} else if let videoAttachment = mediaItem.videoAttachment {
68-
VideoAttachmentContentView(
69-
factory: factory,
70-
attachment: videoAttachment,
71-
message: mediaItem.message,
72-
width: Self.itemWidth,
73-
ratio: 1,
74-
cornerRadius: 0
75-
)
7668
}
7769
}
7870
.overlay(
@@ -110,13 +102,13 @@ public struct MediaAttachmentsView<Factory: ViewFactory>: View {
110102
}
111103
}
112104

113-
struct ImageAttachmentContentView<Factory: ViewFactory>: View {
105+
struct MediaAttachmentContentView<Factory: ViewFactory>: View {
114106
@State private var galleryShown = false
115107

116108
let factory: Factory
117109
let mediaItem: MediaItem
118-
let imageAttachment: ChatMessageImageAttachment
119-
let allImageAttachments: [ChatMessageImageAttachment]
110+
let mediaAttachment: MediaAttachment
111+
let allMediaAttachments: [MediaAttachment]
120112
let itemWidth: CGFloat
121113
let index: Int
122114

@@ -125,7 +117,7 @@ struct ImageAttachmentContentView<Factory: ViewFactory>: View {
125117
galleryShown = true
126118
} label: {
127119
LazyLoadingImage(
128-
source: MediaAttachment(url: imageAttachment.imageURL, type: .image),
120+
source: mediaAttachment,
129121
width: itemWidth,
130122
height: itemWidth
131123
)
@@ -137,7 +129,7 @@ struct ImageAttachmentContentView<Factory: ViewFactory>: View {
137129
}
138130
.fullScreenCover(isPresented: $galleryShown) {
139131
factory.makeGalleryView(
140-
mediaAttachments: allImageAttachments.map { MediaAttachment(from: $0) },
132+
mediaAttachments: allMediaAttachments,
141133
message: mediaItem.message,
142134
isShown: $galleryShown,
143135
options: .init(selectedIndex: index)

‎Sources/StreamChatSwiftUI/ChatChannel/ChannelInfo/MediaAttachmentsViewModel.swift‎

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -19,8 +19,8 @@ class MediaAttachmentsViewModel: ObservableObject, ChatMessageSearchControllerDe
1919

2020
private var loadingNextMessages = false
2121

22-
var allImageAttachments: [ChatMessageImageAttachment] {
23-
mediaItems.compactMap(\.imageAttachment)
22+
var allMediaAttachments: [MediaAttachment] {
23+
mediaItems.compactMap(\.mediaAttachment)
2424
}
2525

2626
init(channel: ChatChannel) {
@@ -113,4 +113,13 @@ struct MediaItem: Identifiable {
113113

114114
var videoAttachment: ChatMessageVideoAttachment?
115115
var imageAttachment: ChatMessageImageAttachment?
116+
117+
var mediaAttachment: MediaAttachment? {
118+
if let videoAttachment {
119+
return MediaAttachment(url: videoAttachment.videoURL, type: .video)
120+
} else if let imageAttachment {
121+
return MediaAttachment(url: imageAttachment.imageURL, type: .image)
122+
}
123+
return nil
124+
}
116125
}

‎Sources/StreamChatSwiftUI/ChatChannel/Gallery/GalleryView.swift‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -127,8 +127,8 @@ public struct GalleryView<Factory: ViewFactory>: View {
127127
.foregroundColor(Color(colors.text))
128128
}
129129
.sheet(isPresented: $gridShown) {
130-
GridPhotosView(
131-
imageURLs: mediaAttachments.filter { $0.type == .image }.map(\.url),
130+
GridMediaView(
131+
attachments: mediaAttachments,
132132
isShown: $gridShown
133133
)
134134
}

‎Sources/StreamChatSwiftUI/ChatChannel/Gallery/GridPhotosView.swift‎ renamed to ‎Sources/StreamChatSwiftUI/ChatChannel/Gallery/GridMediaView.swift‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,9 @@
55
import StreamChat
66
import SwiftUI
77

8-
/// View used for displaying photos in a grid.
9-
struct GridPhotosView: View {
10-
var imageURLs: [URL]
8+
/// View used for displaying media in a grid.
9+
struct GridMediaView: View {
10+
var attachments: [MediaAttachment]
1111
@Binding var isShown: Bool
1212

1313
private static let spacing: CGFloat = 2
@@ -30,9 +30,9 @@ struct GridPhotosView: View {
3030
)
3131
ScrollView {
3232
LazyVGrid(columns: columns, spacing: 2) {
33-
ForEach(imageURLs, id: \.self) { url in
33+
ForEach(attachments) { attachment in
3434
LazyLoadingImage(
35-
source: MediaAttachment(url: url, type: .image),
35+
source: attachment,
3636
width: Self.itemWidth,
3737
height: Self.itemWidth
3838
)

‎Sources/StreamChatSwiftUI/ChatChannel/MessageList/ImageAttachmentView.swift‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -430,13 +430,17 @@ extension ChatMessage {
430430
}
431431
}
432432

433-
public struct MediaAttachment {
433+
public struct MediaAttachment: Identifiable {
434434
@Injected(\.utils) var utils
435435

436436
let url: URL
437437
let type: MediaAttachmentType
438438
var uploadingState: AttachmentUploadingState?
439439

440+
public var id: String {
441+
url.absoluteString
442+
}
443+
440444
func generateThumbnail(
441445
resize: Bool,
442446
preferredSize: CGSize,

‎StreamChatSwiftUI.xcodeproj/project.pbxproj‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -193,7 +193,7 @@
193193
84335014274BAB15007A1B81 /* ViewFactoryExamples.swift in Sources */ = {isa = PBXBuildFile; fileRef = 84335013274BAB15007A1B81 /* ViewFactoryExamples.swift */; };
194194
84335016274BABF3007A1B81 /* NewChatView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 84335015274BABF3007A1B81 /* NewChatView.swift */; };
195195
84335018274BAD4B007A1B81 /* NewChatViewModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = 84335017274BAD4B007A1B81 /* NewChatViewModel.swift */; };
196-
8434E58127707F19001E1B83 /* GridPhotosView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 8434E58027707F19001E1B83 /* GridPhotosView.swift */; };
196+
8434E58127707F19001E1B83 /* GridMediaView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 8434E58027707F19001E1B83 /* GridMediaView.swift */; };
197197
8434E583277088D9001E1B83 /* TitleWithCloseButton.swift in Sources */ = {isa = PBXBuildFile; fileRef = 8434E582277088D9001E1B83 /* TitleWithCloseButton.swift */; };
198198
84471C182BE98BC400D6721E /* PollAllOptionsView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 84471C172BE98BC400D6721E /* PollAllOptionsView.swift */; };
199199
844CC60E2811378D0006548D /* ComposerConfig.swift in Sources */ = {isa = PBXBuildFile; fileRef = 844CC60D2811378D0006548D /* ComposerConfig.swift */; };
@@ -797,7 +797,7 @@
797797
84335013274BAB15007A1B81 /* ViewFactoryExamples.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ViewFactoryExamples.swift; sourceTree = "<group>"; };
798798
84335015274BABF3007A1B81 /* NewChatView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = NewChatView.swift; sourceTree = "<group>"; };
799799
84335017274BAD4B007A1B81 /* NewChatViewModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = NewChatViewModel.swift; sourceTree = "<group>"; };
800-
8434E58027707F19001E1B83 /* GridPhotosView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = GridPhotosView.swift; sourceTree = "<group>"; };
800+
8434E58027707F19001E1B83 /* GridMediaView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = GridMediaView.swift; sourceTree = "<group>"; };
801801
8434E582277088D9001E1B83 /* TitleWithCloseButton.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = TitleWithCloseButton.swift; sourceTree = "<group>"; };
802802
84471C172BE98BC400D6721E /* PollAllOptionsView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = PollAllOptionsView.swift; sourceTree = "<group>"; };
803803
844CC60D2811378D0006548D /* ComposerConfig.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ComposerConfig.swift; sourceTree = "<group>"; };
@@ -2261,7 +2261,7 @@
22612261
isa = PBXGroup;
22622262
children = (
22632263
84F29089276B90610045472D /* GalleryView.swift */,
2264-
8434E58027707F19001E1B83 /* GridPhotosView.swift */,
2264+
8434E58027707F19001E1B83 /* GridMediaView.swift */,
22652265
8465FD032746A95600AF091E /* VideoPlayerView.swift */,
22662266
C52A0B5E2E1557F300176379 /* VideoPlayerFooterView.swift */,
22672267
84F2908B276B91700045472D /* ZoomableScrollView.swift */,
@@ -2717,7 +2717,7 @@
27172717
842FA0E72C05DCDB00AD1F3C /* PollsConfig.swift in Sources */,
27182718
841B64D42775F5540016FF3B /* GiphyCommandHandler.swift in Sources */,
27192719
82D64BDD2AD7E5B700C5C79E /* AnimatedImageView.swift in Sources */,
2720-
8434E58127707F19001E1B83 /* GridPhotosView.swift in Sources */,
2720+
8434E58127707F19001E1B83 /* GridMediaView.swift in Sources */,
27212721
ADE0F5662CB962470053B8B9 /* ActionBannerView.swift in Sources */,
27222722
84BB4C4C2841104700CBE004 /* MessageListDateUtils.swift in Sources */,
27232723
82D64BE72AD7E5B700C5C79E /* ImageTask.swift in Sources */,

‎StreamChatSwiftUITests/Tests/ChatChannel/ChannelInfo/MediaAttachmentsViewModel_Tests.swift‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ class MediaAttachmentsViewModel_Tests: StreamChatTestCase {
2727

2828
// When
2929
let mediaItems = viewModel.mediaItems
30-
let imageAttachments = viewModel.allImageAttachments
30+
let imageAttachments = viewModel.allMediaAttachments.filter { $0.type == .image }
3131

3232
// Then
3333
XCTAssert(mediaItems.count == 8)

‎StreamChatSwiftUITests/Tests/ChatChannel/ChannelInfo/__Snapshots__/MediaAttachmentsView_Tests/test_mediaAttachmentsView_notEmptySnapshot.1.png‎

2.31 KB
Loading

‎StreamChatSwiftUITests/Tests/ChatChannel/GalleryView_Tests.swift‎

Lines changed: 17 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -48,8 +48,23 @@ class GalleryView_Tests: StreamChatTestCase {
4848

4949
func test_gridView_snapshotLoading() {
5050
// Given
51-
let view = GridPhotosView(
52-
imageURLs: [ChatChannelTestHelpers.testURL],
51+
let view = GridMediaView(
52+
attachments: [MediaAttachment(url: ChatChannelTestHelpers.testURL, type: .image)],
53+
isShown: .constant(true)
54+
)
55+
.applyDefaultSize()
56+
57+
// Then
58+
assertSnapshot(matching: view, as: .image(perceptualPrecision: precision))
59+
}
60+
61+
func test_gridViewVideoAndImage_snapshotLoading() {
62+
// Given
63+
let view = GridMediaView(
64+
attachments: [
65+
MediaAttachment(url: ChatChannelTestHelpers.testURL, type: .image),
66+
MediaAttachment(url: ChatChannelTestHelpers.testURL.appendingPathComponent("test"), type: .video)
67+
],
5368
isShown: .constant(true)
5469
)
5570
.applyDefaultSize()

0 commit comments

Comments
 (0)