[PriceInsights][iOS] Polish the y Axis

This CL:
- Extends the bottom AxisTick to covert the longest yAxis label.
- Adds a color to the grid line and ticks.
- Sets the number of ticks to 3.

Screenshot: https://screenshot.googleplex.com/A8Ks3pmp2VbChiv.png

Bug: b/346813191
Change-Id: Iea90a222f55470666b2b93b70ee3d64412402dc2
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/5627572
Reviewed-by: Robbie Gibson <rkgibson@google.com>
Commit-Queue: Cheick Cisse <cheickcisse@google.com>
Cr-Commit-Position: refs/heads/main@{#1314267}
diff --git a/ios/chrome/browser/price_insights/ui/price_history.swift b/ios/chrome/browser/price_insights/ui/price_history.swift
index 6ef12e2..e8565eb 100644
--- a/ios/chrome/browser/price_insights/ui/price_history.swift
+++ b/ios/chrome/browser/price_insights/ui/price_history.swift
@@ -105,8 +105,11 @@
   /// Color representing solid white.
   static let solidWhite = UIColor(named: kSolidWhiteColor) ?? .white
 
+  /// Color representing grey 200.
+  static let grey200 = UIColor(named: kGrey200Color) ?? .gray
+
   /// Number of ticks on the Y-axis.
-  static let tickCountY = 4
+  static let tickCountY = 3
 
   /// The selected date on the graph.
   @State private var selectedDate: Date?
@@ -182,14 +185,16 @@
       AxisMarks(position: .leading, values: axisTicksY) { price in
         if let price = price.as(Double.self) {
           if price == axisTicksY.first {
-            AxisTick()
+            AxisTick(length: .longestLabel, stroke: StrokeStyle(lineWidth: 1))
+              .foregroundStyle(Color(uiColor: Self.grey200))
           } else {
             AxisValueLabel(
               format: .currency(code: currency).precision(.fractionLength(0)))
             AxisTick(stroke: StrokeStyle(lineWidth: 0))
           }
         }
-        AxisGridLine()
+        AxisGridLine(stroke: StrokeStyle(lineWidth: 1))
+          .foregroundStyle(Color(uiColor: Self.grey200))
       }
     }
     .chartXScale(domain: axisXRange)