[Mobile Payments] Fix blurry payment method icons in payment methods screen (#15659)

Author: jaclync

Podfile

@@ -63,7 +63,8 @@ def networking_watch_os_pods
 end
 
 def gridicons
-  pod 'Gridicons', '~> 1.2.0'
+  # pod 'Gridicons', '~> 1.2.0'
+  pod 'Gridicons', git: 'https://github.com/Automattic/Gridicons-iOS.git', commit: 'c904cb73e26e86463a78e1335c6f4fd54a9e9223'
 end
 
 def wordpress_ui

Podfile.lock

@@ -1,6 +1,6 @@
 PODS:
   - Alamofire (5.8.1)
-  - Gridicons (1.2.0)
+  - Gridicons (1.3.0-beta.1)
   - KeychainAccess (4.2.2)
   - Kingfisher (7.6.2)
   - NSObject-SafeExpectations (0.0.6)
@@ -48,7 +48,7 @@ PODS:
 
 DEPENDENCIES:
   - Alamofire (~> 5.0)
-  - Gridicons (~> 1.2.0)
+  - Gridicons (from `https://github.com/Automattic/Gridicons-iOS.git`, commit `c904cb73e26e86463a78e1335c6f4fd54a9e9223`)
   - KeychainAccess (~> 4.2.2)
   - Kingfisher (~> 7.6.2)
   - NSObject-SafeExpectations (~> 0.0.4)
@@ -68,7 +68,6 @@ DEPENDENCIES:
 SPEC REPOS:
   trunk:
     - Alamofire
-    - Gridicons
     - KeychainAccess
     - Kingfisher
     - NSObject-SafeExpectations
@@ -91,9 +90,19 @@ SPEC REPOS:
     - ZendeskSupportProvidersSDK
     - ZendeskSupportSDK
 
+EXTERNAL SOURCES:
+  Gridicons:
+    :commit: c904cb73e26e86463a78e1335c6f4fd54a9e9223
+    :git: https://github.com/Automattic/Gridicons-iOS.git
+
+CHECKOUT OPTIONS:
+  Gridicons:
+    :commit: c904cb73e26e86463a78e1335c6f4fd54a9e9223
+    :git: https://github.com/Automattic/Gridicons-iOS.git
+
 SPEC CHECKSUMS:
   Alamofire: 3ca42e259043ee0dc5c0cdd76c4bc568b8e42af7
-  Gridicons: 4455b9f366960121430e45997e32112ae49ffe1d
+  Gridicons: 2c30feba78143786aa04e6d1304a86e246779689
   KeychainAccess: c0c4f7f38f6fc7bbe58f5702e25f7bd2f65abf51
   Kingfisher: 6c5449c6450c5239166510ba04afe374a98afc4f
   NSObject-SafeExpectations: c01c8881cbd97efad6f668286b913cd0b7d62ab5
@@ -116,6 +125,6 @@ SPEC CHECKSUMS:
   ZendeskSupportProvidersSDK: 281acf2bb731d2a67f913cfe653ed0da9f5b2f42
   ZendeskSupportSDK: b512cfc74b6bf8490e589f02cf52e27ed4f2bebe
 
-PODFILE CHECKSUM: e8b7a720e1a5dfbd786d981801b57560dd250395
+PODFILE CHECKSUM: d31cc69df3854753fd96bdc473de14827b26a880
 
 COCOAPODS: 1.16.2

RELEASE-NOTES.txt

@@ -3,6 +3,7 @@
 
 22.5
 -----
+- [*] Payments: payment method icons on the payment methods screen no longer appear blurry. [https://github.com/woocommerce/woocommerce-ios/pull/15659]
 - [internal] Optimized product image handling to reduce memory pressure by leveraging KingFisher's built-in capabilities [https://github.com/woocommerce/woocommerce-ios/pull/15629]
 
 22.4

WooCommerce/Classes/ViewRelated/Orders/Payment Methods/PaymentMethodsView.swift

@@ -52,23 +52,27 @@ struct PaymentMethodsView: View {
                             Divider()
                         }
 
-                        MethodRow(icon: .priceImage, title: Localization.cash, accessibilityID: Accessibility.cashMethod) {
+                        MethodRow(icon: Image.gridicon(.money), title: Localization.cash, accessibilityID: Accessibility.cashMethod) {
                             showingCashAlert = true
                             viewModel.trackCollectByCash()
                         }
 
                         if viewModel.showPayWithCardRow {
                             Divider()
 
-                            MethodRow(icon: .creditCardImage, title: Localization.card, accessibilityID: Accessibility.cardMethod) {
+                            MethodRow(
+                                icon: Image.gridicon(.creditCard),
+                                title: Localization.card,
+                                accessibilityID: Accessibility.cardMethod
+                            ) {
                                 viewModel.collectPayment(using: .bluetoothScan, on: rootViewController, onSuccess: dismiss, onFailure: dismiss)
                             }
                         }
 
                         if viewModel.showPaymentLinkRow {
                             Divider()
 
-                            MethodRow(icon: .linkImage, title: Localization.link, accessibilityID: Accessibility.paymentLink) {
+                            MethodRow(icon: Image.gridicon(.link), title: Localization.link, accessibilityID: Accessibility.paymentLink) {
                                 sharingPaymentLink = true
                                 viewModel.trackCollectByPaymentLink()
                             }