[Woo POS][Barcodes] Update pairing screen to match designs

WooCommerce/Classes/POS/Presentation/Barcode Scanner Setup/PointOfSaleBarcodeScannerSetupStepViews.swift

@@ -48,9 +48,9 @@ struct PointOfSaleBarcodeScannerPairingView: View {
     var body: some View {
         VStack(spacing: POSSpacing.xLarge) {
             // Temporary image until finalised assets are available
-            Image(systemName: "gearshape")
-                .font(.system(size: 78))
-                .accessibilityHidden(true)
+            Image(decorative: PointOfSaleAssets.gears.imageName)
+                .resizable()
+                .frame(width: Constants.gearIconSize, height: Constants.gearIconSize)
 
             VStack(alignment: .center, spacing: POSSpacing.small) {
                 Text(Localization.title)
@@ -85,9 +85,13 @@ private extension PointOfSaleBarcodeScannerPairingView {
     //TODO: WOOMOB-792
     enum Localization {
         static let settingsButtonTitle = "Go to settings"
-        static let title = "Pair your device"
+        static let title = "Pair your scanner"
         static let instructionFormat = "Enable Bluetooth and select your %1$@ scanner in iOS Settings."
     }
+
+    enum Constants {
+        static let gearIconSize: CGFloat = 112
+    }
 }
 
 @available(iOS 17.0, *)

WooCommerce/Classes/POS/Presentation/PointOfSaleAssets.swift

@@ -14,6 +14,7 @@ enum PointOfSaleAssets: CaseIterable {
     case shoppingBags
     case successCheck
     case coupons
+    case gears
     //TODO: WOOMOB-793 Update the imagesets for these barcodes to vector/dark mode friendly images
     case starBsh20SetupBarcode
     case testEan13Barcode
@@ -46,6 +47,8 @@ enum PointOfSaleAssets: CaseIterable {
             "pos-success-check"
         case .coupons:
             "coupons"
+        case .gears:
+            "pos-gears"
         case .starBsh20SetupBarcode:
             "star-bsh20-setup-barcode"
         case .testEan13Barcode:

WooCommerce/Resources/Images.xcassets/POS/pos-gears.imageset/Contents.json

@@ -0,0 +1,22 @@
+{
+  "images" : [
+    {
+      "filename" : "pos-gears.pdf",
+      "idiom" : "universal"
+    },
+    {
+      "appearances" : [
+        {
+          "appearance" : "luminosity",
+          "value" : "dark"
+        }
+      ],
+      "filename" : "pos-gears-dark.pdf",
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}