Added initials to the conversationCell

This commit is contained in:
Xavi Gil
2024-03-07 09:11:41 +01:00
parent 2a3ce1f61b
commit 6589c4eac0
7 changed files with 68 additions and 20 deletions
+12
View File
@@ -27,6 +27,7 @@
477F665F2B8CA3E400119523 /* iosTests.swift in Sources */ = {isa = PBXBuildFile; fileRef = 477F665E2B8CA3E400119523 /* iosTests.swift */; };
477F66692B8CA3E400119523 /* iosUITests.swift in Sources */ = {isa = PBXBuildFile; fileRef = 477F66682B8CA3E400119523 /* iosUITests.swift */; };
477F666B2B8CA3E400119523 /* iosUITestsLaunchTests.swift in Sources */ = {isa = PBXBuildFile; fileRef = 477F666A2B8CA3E400119523 /* iosUITestsLaunchTests.swift */; };
478CEB1E2B99AE5600593231 /* MailboxSharedUIModels.swift in Sources */ = {isa = PBXBuildFile; fileRef = 478CEB1D2B99AE5600593231 /* MailboxSharedUIModels.swift */; };
479E19182B9715AB003A3A51 /* View+removeViewIf.swift in Sources */ = {isa = PBXBuildFile; fileRef = 479E19172B9715AB003A3A51 /* View+removeViewIf.swift */; };
47D4614E2B9379F4007546C1 /* SidebarScreen.swift in Sources */ = {isa = PBXBuildFile; fileRef = 47D4614D2B9379F4007546C1 /* SidebarScreen.swift */; };
47D461512B937C28007546C1 /* SidebarScreenModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = 47D461502B937C27007546C1 /* SidebarScreenModel.swift */; };
@@ -73,6 +74,7 @@
477F66642B8CA3E400119523 /* iosUITests.xctest */ = {isa = PBXFileReference; explicitFileType = wrapper.cfbundle; includeInIndex = 0; path = iosUITests.xctest; sourceTree = BUILT_PRODUCTS_DIR; };
477F66682B8CA3E400119523 /* iosUITests.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = iosUITests.swift; sourceTree = "<group>"; };
477F666A2B8CA3E400119523 /* iosUITestsLaunchTests.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = iosUITestsLaunchTests.swift; sourceTree = "<group>"; };
478CEB1D2B99AE5600593231 /* MailboxSharedUIModels.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = MailboxSharedUIModels.swift; sourceTree = "<group>"; };
479E19172B9715AB003A3A51 /* View+removeViewIf.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "View+removeViewIf.swift"; sourceTree = "<group>"; };
47D4614D2B9379F4007546C1 /* SidebarScreen.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = SidebarScreen.swift; sourceTree = "<group>"; };
47D461502B937C27007546C1 /* SidebarScreenModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = SidebarScreenModel.swift; sourceTree = "<group>"; };
@@ -127,6 +129,7 @@
children = (
4701D41C2B8CB1C400D6DC1D /* MailboxScreen.swift */,
47143B792B8CEC9300AAB4E4 /* MailboxConversationScreen */,
478CEB1F2B99AE6F00593231 /* UIModel */,
);
path = Mailbox;
sourceTree = "<group>";
@@ -238,6 +241,14 @@
path = iosUITests;
sourceTree = "<group>";
};
478CEB1F2B99AE6F00593231 /* UIModel */ = {
isa = PBXGroup;
children = (
478CEB1D2B99AE5600593231 /* MailboxSharedUIModels.swift */,
);
path = UIModel;
sourceTree = "<group>";
};
479E19192B971942003A3A51 /* Foundation */ = {
isa = PBXGroup;
children = (
@@ -404,6 +415,7 @@
472ED7772B95DD2A00C1C8E6 /* MailboxLabelView.swift in Sources */,
47143B7B2B8CECAD00AAB4E4 /* MailboxConversationScreenModel.swift in Sources */,
4754F23F2B97586B0094F46A /* AttachmentsView.swift in Sources */,
478CEB1E2B99AE5600593231 /* MailboxSharedUIModels.swift in Sources */,
47D4614E2B9379F4007546C1 /* SidebarScreen.swift in Sources */,
4712AD212B9636F000F18210 /* MailboxConversationMessageCountView.swift in Sources */,
47761CCD2B8DFB1500AFE584 /* PreviewData.swift in Sources */,
@@ -36,7 +36,7 @@ enum PreviewData {
let expirationDate: Bool = ((1..<11).randomElement()!%10) == 0
return .init(
id: UUID().uuidString,
avatarImage: URL(fileURLWithPath: ""),
avatar: .init(initials: randomSenderSubject.0.prefix(2).uppercased()),
senders: randomSenderSubject.0,
subject: randomSenderSubject.1,
date: Calendar.current.date(byAdding: .minute, value: -1 * (value*value*1005), to: Date())!,
@@ -35,6 +35,7 @@ struct MailboxConversationCell: View {
AvatarCheckboxView(
isSelected: uiModel.isSelected,
avatar: uiModel.avatar,
onDidChangeSelection: { onEvent(.onSelectedChange(isSelected: $0)) }
)
.frame(width: 40, height: 40)
@@ -97,15 +98,10 @@ struct MailboxConversationCell: View {
}
}
struct ExpirationDateUIModel {
let text: String
let color: Color
}
@Observable
final class MailboxConversationCellUIModel: Identifiable {
let id: String
let avatarImage: URL
let avatar: AvatarUIModel
let senders: String
let subject: String
let date: Date
@@ -123,7 +119,7 @@ final class MailboxConversationCellUIModel: Identifiable {
init(
id: String,
avatarImage: URL,
avatar: AvatarUIModel,
senders: String,
subject: String,
date: Date,
@@ -136,7 +132,7 @@ final class MailboxConversationCellUIModel: Identifiable {
expirationDate: ExpirationDateUIModel
) {
self.id = id
self.avatarImage = avatarImage
self.avatar = avatar
self.senders = senders
self.subject = subject
self.date = date
@@ -160,7 +156,7 @@ enum MailboxConversationCellEvent {
var model: MailboxConversationCellUIModel {
MailboxConversationCellUIModel(
id: "",
avatarImage: URL(string: "https://proton.me")!,
avatar: .init(initials: "P"),
senders: "Proton",
subject: "30% discount on all our products",
date: Date(),
@@ -183,7 +179,7 @@ enum MailboxConversationCellEvent {
MailboxConversationCell(
uiModel: .init(
id: "",
avatarImage: URL(string: "https://proton.me")!,
avatar: .init(initials: "FE"),
senders: "FedEx",
subject: "Your package is ready to ship",
date: Calendar.current.date(byAdding: .day, value: -1, to: Date())!,
@@ -201,7 +197,7 @@ enum MailboxConversationCellEvent {
MailboxConversationCell(
uiModel: .init(
id: "",
avatarImage: URL(string: "https://proton.me")!,
avatar: .init(initials: "MA"),
senders: "Mary, Elijah Wood, wiseman@pm.me",
subject: "Summer holidays pictures and more!",
date: Calendar.current.date(byAdding: .year, value: -1, to: Date())!,
@@ -41,6 +41,7 @@ struct MailboxConversationScreen: View {
.init(top: 1, leading: 1, bottom: 1, trailing: 0)
)
.listRowSeparator(.hidden)
.compositingGroup()
.clipShape(
.rect(
topLeadingRadius: 20,
@@ -0,0 +1,33 @@
// Copyright (c) 2024 Proton Technologies AG
//
// This file is part of Proton Mail.
//
// Proton Mail is free software: you can redistribute it and/or modify
// it under the terms of the GNU General Public License as published by
// the Free Software Foundation, either version 3 of the License, or
// (at your option) any later version.
//
// Proton Mail is distributed in the hope that it will be useful,
// but WITHOUT ANY WARRANTY; without even the implied warranty of
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
// GNU General Public License for more details.
//
// You should have received a copy of the GNU General Public License
// along with Proton Mail. If not, see https://www.gnu.org/licenses/.
import SwiftUI
struct AvatarUIModel {
let initials: String
let image: URL?
init(initials: String, image: URL? = nil) {
self.initials = initials
self.image = image
}
}
struct ExpirationDateUIModel {
let text: String
let color: Color
}
+11 -8
View File
@@ -20,6 +20,7 @@ import SwiftUI
struct AvatarCheckboxView: View {
let isSelected: Bool
let avatar: AvatarUIModel
var onDidChangeSelection: ((_ newValue: Bool) -> Void)
private let cornerRadius = 6.0
@@ -29,23 +30,25 @@ struct AvatarCheckboxView: View {
if isSelected {
ZStack {
RoundedRectangle(cornerRadius: cornerRadius, style: .continuous)
.stroke(DS.Color.strokeDark, lineWidth: 1)
.fill(DS.Color.backgroundNorm)
.stroke(DS.Color.strokeDark, lineWidth: 1)
.overlay {
Image(uiImage: DS.Icon.icCheckmark)
.resizable()
.foregroundColor(DS.Color.checkbox)
.padding(10)
}
}
} else {
Image("avatar-fedex")
.resizable()
.aspectRatio(contentMode: .fit)
.clipShape(RoundedRectangle(cornerRadius: cornerRadius, style: .continuous))
Text(avatar.initials)
.font(.caption)
.fontWeight(.regular)
.frame(maxWidth: .infinity, maxHeight: .infinity)
.background(DS.Color.interactionWeak)
}
}
.compositingGroup()
.clipShape(RoundedRectangle(cornerRadius: cornerRadius, style: .continuous))
.onTapGesture {
onDidChangeSelection(!isSelected)
}
@@ -54,11 +57,11 @@ struct AvatarCheckboxView: View {
#Preview {
VStack {
AvatarCheckboxView(isSelected: true) { _ in}
AvatarCheckboxView(isSelected: true, avatar: .init(initials: "MB")) { _ in}
.frame(width: 40, height: 40)
.clipped()
AvatarCheckboxView(isSelected: false) { _ in}
AvatarCheckboxView(isSelected: false, avatar: .init(initials: "MB")) { _ in}
.frame(width: 40, height: 40)
.clipped()
}
@@ -28,4 +28,7 @@ public extension DS.Color {
static let textWeak = Color(.mobileTextWeak)
static let textNorm = Color(.mobileTextNorm)
static let interactionWeak = Color(.mobileInteractionWeak)
}