Paywalls: changed images representation to an object (#2875)

This is much better, no longer relying on array index.
RevenueCat · Jul 31, 2023 · 4d1d5ce · 4d1d5ce
1 parent b731dfc
commit 4d1d5ce
Show file tree

Hide file tree

Showing 25 changed files with 133 additions and 129 deletions.
diff --git a/Package.swift b/Package.swift
@@ -69,6 +69,6 @@ let package = Package(
                         .product(name: "SnapshotTesting", package: "swift-snapshot-testing")
                     ],
                     exclude: ["__Snapshots__"],
-                    resources: [.copy("Resources/image_1.jpg"), .copy("Resources/image_2.jpg")])
+                    resources: [.copy("Resources/header.jpg"), .copy("Resources/background.jpg")])
     ]
 )
diff --git a/RevenueCatUI/Data/TemplateViewConfiguration+Images.swift b/RevenueCatUI/Data/TemplateViewConfiguration+Images.swift
@@ -0,0 +1,28 @@
+//
+//  TemplateViewConfiguration+Images.swift
+//  
+//
+//  Created by Nacho Soto on 7/25/23.
+//
+
+import Foundation
+import RevenueCat
+
+@available(iOS 16.0, macOS 13.0, tvOS 16.0, *)
+extension TemplateViewConfiguration {
+
+    var headerImageURL: URL? { self.url(for: \.header) }
+    var backgroundImageURL: URL? { self.url(for: \.background) }
+    var iconImageURL: URL? { self.url(for: \.icon) }
+
+}
+
+@available(iOS 16.0, macOS 13.0, tvOS 16.0, *)
+private extension TemplateViewConfiguration {
+
+    func url(for image: KeyPath<PaywallData.Configuration.Images, String?>) -> URL? {
+        let imageName = self.configuration.images[keyPath: image]
+        return imageName.map { self.assetBaseURL.appendingPathComponent($0) }
+    }
+
+}
diff --git a/RevenueCatUI/Data/TemplateViewConfiguration.swift b/RevenueCatUI/Data/TemplateViewConfiguration.swift
@@ -16,7 +16,7 @@ struct TemplateViewConfiguration {
     let packages: PackageConfiguration
     let configuration: PaywallData.Configuration
     let colors: PaywallData.Configuration.Colors
-    let imageURLs: [URL]
+    let assetBaseURL: URL
 
 }
 

diff --git a/RevenueCatUI/Data/TestData.swift b/RevenueCatUI/Data/TestData.swift
@@ -118,7 +118,7 @@ internal enum TestData {
         template: .singlePackage,
         config: .init(
             packages: [.monthly],
-            imageNames: [Self.paywallBackgroundImageName, Self.paywallHeaderImageName],
+            images: Self.images,
             colors: .init(light: Self.lightColors, dark: Self.darkColors),
             termsOfServiceURL: URL(string: "https://revenuecat.com/tos")!,
             privacyURL: URL(string: "https://revenuecat.com/privacy")!
@@ -130,7 +130,7 @@ internal enum TestData {
         template: .singlePackage,
         config: .init(
             packages: [.annual],
-            imageNames: [Self.paywallBackgroundImageName, Self.paywallHeaderImageName],
+            images: Self.images,
             colors: .init(light: Self.lightColors, dark: Self.darkColors)
         ),
         localization: Self.localization1,
@@ -161,8 +161,7 @@ internal enum TestData {
             template: .multiPackage,
             config: .init(
                 packages: [.annual, .monthly],
-                imageNames: [Self.paywallBackgroundImageName,
-                             Self.paywallHeaderImageName],
+                images: Self.images,
                 colors: .init(
                     light: .init(
                         background: "#FFFFFF",
@@ -257,6 +256,11 @@ internal enum TestData {
     )
     static let paywallHeaderImageName = "9a17e0a7_1689854430..jpeg"
     static let paywallBackgroundImageName = "9a17e0a7_1689854342..jpg"
+    static let images: PaywallData.Configuration.Images = .init(
+        header: Self.paywallHeaderImageName,
+        background: Self.paywallBackgroundImageName,
+        icon: Self.paywallHeaderImageName
+    )
     static let paywallAssetBaseURL = URL(string: "https://d35rwhxn1vk1te.cloudfront.net")!
 
     private static let offeringIdentifier = "offering"

diff --git a/RevenueCatUI/Helpers/PaywallData+Default.swift b/RevenueCatUI/Helpers/PaywallData+Default.swift
@@ -18,9 +18,7 @@ extension PaywallData {
         template: .multiPackage,
         config: .init(
             packages: [.weekly, .monthly, .annual],
-            imageNames: [
-                Self.backgroundImage
-            ],
+            images: .init(background: Self.backgroundImage),
             colors: Self.colors,
             blurredBackgroundImage: true,
             displayRestorePurchases: true

diff --git a/RevenueCatUI/PaywallView.swift b/RevenueCatUI/PaywallView.swift
@@ -217,7 +217,7 @@ struct PaywallView_Previews: PreviewProvider {
                     purchaseHandler: Self.purchaseHandler
                 )
                 .previewLayout(mode.layout)
-                .previewDisplayName("\(offering.identifier)-\(mode)")
+                .previewDisplayName("\(offering.paywall?.template.name ?? "")-\(mode)")
             }
         }
     }
@@ -257,4 +257,16 @@ private extension PaywallViewMode {
 
 }
 
+@available(iOS 16.0, macOS 13.0, tvOS 16.0, *)
+private extension PaywallTemplate {
+
+    var name: String {
+        switch self {
+        case .singlePackage: return "single"
+        case .multiPackage: return "multi"
+        }
+    }
+
+}
+
 #endif
diff --git a/RevenueCatUI/Templates/MultiPackageTemplate.swift b/RevenueCatUI/Templates/MultiPackageTemplate.swift
@@ -182,7 +182,7 @@ private struct MultiPackageTemplateContent: View {
 
     @ViewBuilder
     private var backgroundImage: some View {
-        if let url = self.configuration.backgroundURL {
+        if let url = self.configuration.backgroundImageURL {
             if self.configuration.configuration.blurredBackgroundImage {
                 RemoteImage(url: url)
                     .blur(radius: 40)
@@ -199,7 +199,7 @@ private struct MultiPackageTemplateContent: View {
     @ViewBuilder
     private var iconImage: some View {
         Group {
-            if let url = self.configuration.iconURL {
+            if let url = self.configuration.iconImageURL {
                 RemoteImage(url: url, aspectRatio: 1, maxWidth: Self.iconSize)
                     .clipShape(RoundedRectangle(cornerRadius: 10, style: .continuous))
             } else {
@@ -231,20 +231,6 @@ private extension MultiPackageTemplateContent {
 
 }
 
-@available(iOS 16.0, macOS 13.0, tvOS 16.0, *)
-private extension TemplateViewConfiguration {
-
-    var backgroundURL: URL? {
-        return self.imageURLs.first
-    }
-
-    var iconURL: URL? {
-        guard self.imageURLs.count >= 2 else { return nil }
-        return self.imageURLs[1]
-    }
-
-}
-
 @available(iOS 16.0, macOS 13.0, tvOS 16.0, *)
 private struct PackageButtonStyle: ButtonStyle {
 

diff --git a/RevenueCatUI/Templates/SinglePackageTemplate.swift b/RevenueCatUI/Templates/SinglePackageTemplate.swift
@@ -103,7 +103,7 @@ private struct SinglePackageTemplateContent: View {
 
     @ViewBuilder
     private var asyncImage: some View {
-        if let headerImage = self.configuration.imageURLs.first {
+        if let headerImage = self.configuration.headerImageURL {
             RemoteImage(url: headerImage, aspectRatio: Self.imageAspectRatio)
             .frame(maxWidth: .infinity)
             .aspectRatio(Self.imageAspectRatio, contentMode: .fit)

diff --git a/RevenueCatUI/Templates/TemplateViewType.swift b/RevenueCatUI/Templates/TemplateViewType.swift
@@ -60,7 +60,7 @@ extension PaywallData {
                                       locale: locale),
                 configuration: self.config,
                 colors: self.config.colors.multiScheme,
-                imageURLs: self.imageURLs
+                assetBaseURL: self.assetBaseURL
             )
         }
     }

diff --git a/RevenueCatUI/Views/FooterView.swift b/RevenueCatUI/Views/FooterView.swift
@@ -162,7 +162,7 @@ struct Footer_Previews: PreviewProvider {
         FooterView(
             configuration: .init(
                 packages: [],
-                imageNames: ["image"],
+                images: .init(),
                 colors: .init(light: TestData.lightColors, dark: TestData.darkColors),
                 displayRestorePurchases: displayRestorePurchases,
                 termsOfServiceURL: termsOfServiceURL,

diff --git a/Sources/Paywalls/PaywallData.swift b/Sources/Paywalls/PaywallData.swift
@@ -151,11 +151,8 @@ extension PaywallData {
         /// The package to be selected by default.
         public var defaultPackage: PackageType?
 
-        /// The names for image assets.
-        public var imageNames: [String] {
-            get { self._imageNames }
-            set { self._imageNames = newValue }
-        }
+        /// The images for this template.
+        public var images: Images
 
         /// Whether the background image will be blurred (in templates with one).
         public var blurredBackgroundImage: Bool {
@@ -188,28 +185,23 @@ extension PaywallData {
         public init(
             packages: [PackageType],
             defaultPackage: PackageType? = nil,
-            imageNames: [String],
+            images: Images,
             colors: ColorInformation,
             blurredBackgroundImage: Bool = false,
             displayRestorePurchases: Bool = true,
             termsOfServiceURL: URL? = nil,
             privacyURL: URL? = nil
         ) {
-            assert(!imageNames.isEmpty)
-
             self.packages = packages
             self.defaultPackage = defaultPackage
-            self._imageNames = imageNames
+            self.images = images
             self.colors = colors
             self._blurredBackgroundImage = blurredBackgroundImage
             self._displayRestorePurchases = displayRestorePurchases
             self._termsOfServiceURL = termsOfServiceURL
             self._privacyURL = privacyURL
         }
 
-        @EnsureNonEmptyArrayDecodable
-        var _imageNames: [String]
-
         @DefaultDecodable.False
         var _blurredBackgroundImage: Bool
 
@@ -226,6 +218,31 @@ extension PaywallData {
 
 }
 
+extension PaywallData.Configuration {
+
+    /// Set of images that can be used by a template.
+    public struct Images {
+
+        /// Image displayed as a header in a template.
+        public var header: String?
+
+        /// Image displayed as a background in a template.
+        public var background: String?
+
+        /// Image displayed as an app icon in a template.
+        public var icon: String?
+
+        // swiftlint:disable:next missing_docs
+        public init(header: String? = nil, background: String? = nil, icon: String? = nil) {
+            self.header = header
+            self.background = background
+            self.icon = icon
+        }
+
+    }
+
+}
+
 extension PaywallData.Configuration {
 
     /// The set of colors for all ``PaywallColor/ColorScheme``s.
@@ -275,17 +292,6 @@ extension PaywallData.Configuration {
 
 }
 
-// MARK: - Extensions
-
-public extension PaywallData {
-
-    /// The remote URL to load the header image asset.
-    var imageURLs: [URL] {
-        self.config.imageNames.map { self.assetBaseURL.appendingPathComponent($0) }
-    }
-
-}
-
 // MARK: - Constructors
 
 extension PaywallData {
@@ -342,13 +348,14 @@ extension PaywallData.LocalizedConfiguration: Codable {
 
 extension PaywallData.Configuration.ColorInformation: Codable {}
 extension PaywallData.Configuration.Colors: Codable {}
+extension PaywallData.Configuration.Images: Codable {}
 
 extension PaywallData.Configuration: Codable {
 
     private enum CodingKeys: String, CodingKey {
         case packages
         case defaultPackage
-        case _imageNames = "images"
+        case images
         case _blurredBackgroundImage = "blurredBackgroundImage"
         case _displayRestorePurchases = "displayRestorePurchases"
         case _termsOfServiceURL = "tosUrl"
@@ -376,6 +383,7 @@ extension PaywallData: Codable {
 extension PaywallData.LocalizedConfiguration: Equatable {}
 extension PaywallData.Configuration.ColorInformation: Equatable {}
 extension PaywallData.Configuration.Colors: Equatable {}
+extension PaywallData.Configuration.Images: Equatable {}
 extension PaywallData.Configuration: Equatable {}
 extension PaywallData: Equatable {}
 
@@ -384,6 +392,7 @@ extension PaywallData: Equatable {}
 extension PaywallData.LocalizedConfiguration: Sendable {}
 extension PaywallData.Configuration.ColorInformation: Sendable {}
 extension PaywallData.Configuration.Colors: Sendable {}
+extension PaywallData.Configuration.Images: Sendable {}
 extension PaywallData.Configuration: Sendable {}
 
 #if swift(>=5.7)

diff --git a/Tests/APITesters/SwiftAPITester/SwiftAPITester/PaywallAPI.swift b/Tests/APITesters/SwiftAPITester/SwiftAPITester/PaywallAPI.swift
@@ -27,21 +27,22 @@ func checkPaywallData(_ data: PaywallData) {
 }
 
 func checkPaywallConfiguration(_ config: PaywallData.Configuration,
+                               _ images: PaywallData.Configuration.Images,
                                _ colors: PaywallData.Configuration.ColorInformation) {
     let _: PaywallData.Configuration = .init(packages: [.monthly, .annual],
-                                             imageNames: [""],
+                                             images: images,
                                              colors: colors)
     let _: PaywallData.Configuration = .init(packages: [.monthly, .annual],
                                              defaultPackage: .monthly,
-                                             imageNames: [""],
+                                             images: images,
                                              colors: colors,
                                              blurredBackgroundImage: true,
                                              displayRestorePurchases: true,
                                              termsOfServiceURL: URL(string: ""),
                                              privacyURL: URL(string: ""))
     let _: [PackageType] = config.packages
     let _: PackageType? = config.defaultPackage
-    let _: [String] = config.imageNames
+    let _: PaywallData.Configuration.Images = config.images
     let _: PaywallData.Configuration.ColorInformation = config.colors
     let _: Bool = config.blurredBackgroundImage
     let _: Bool = config.displayRestorePurchases
@@ -68,6 +69,19 @@ func checkPaywallLocalizedConfig(_ config: PaywallData.LocalizedConfiguration) {
         offerName: offerName
     )
 }
+func checkPaywallImages(_ images: PaywallData.Configuration.Images) {
+    let header: String? = images.header
+    let background: String? = images.background
+    let icon: String? = images.icon
+
+    _ = PaywallData.Configuration.Images()
+
+    _ = PaywallData.Configuration.Images(
+        header: header,
+        background: background,
+        icon: icon
+    )
+}
 
 func checkPaywallColors(_ config: PaywallData.Configuration.Colors) {
     let background: PaywallColor = config.background