From c4818776940e9244dfb4912fab0452198c197b56 Mon Sep 17 00:00:00 2001
From: Noah Bond <nbond@mozilla.com>
Date: Tue, 3 Oct 2023 09:50:58 -0700
Subject: [PATCH] Bug 1855571 - Update star rating design

---
 .../src/main/res/drawable/mozac_ic_star_fill_20.xml     | 12 ++++++++++++
 .../res/drawable/mozac_ic_star_one_half_fill_20.xml     | 15 +++++++++++++++
 .../components/ui/icons/src/main/res/values/colors.xml  |  4 ++++
 .../java/org/mozilla/fenix/shopping/ui/StarRating.kt    | 16 +++++++++++-----
 .../fenix/app/src/main/res/drawable/ic_star_half.xml    | 17 -----------------
 .../fenix/app/src/main/res/values-night/colors.xml      |  4 ++++
 mobile/android/fenix/app/src/main/res/values/colors.xml |  4 ++++
 7 files changed, 50 insertions(+), 22 deletions(-)
 create mode 100644 mobile/android/android-components/components/ui/icons/src/main/res/drawable/mozac_ic_star_fill_20.xml
 create mode 100644 mobile/android/android-components/components/ui/icons/src/main/res/drawable/mozac_ic_star_one_half_fill_20.xml
 delete mode 100644 mobile/android/fenix/app/src/main/res/drawable/ic_star_half.xml

diff --git a/mobile/android/android-components/components/ui/icons/src/main/res/drawable/mozac_ic_star_fill_20.xml b/mobile/android/android-components/components/ui/icons/src/main/res/drawable/mozac_ic_star_fill_20.xml
new file mode 100644
index 000000000000..b031c5f7b6ab
--- /dev/null
+++ b/mobile/android/android-components/components/ui/icons/src/main/res/drawable/mozac_ic_star_fill_20.xml
@@ -0,0 +1,12 @@
+<!-- This Source Code Form is subject to the terms of the Mozilla Public
+   - License, v. 2.0. If a copy of the MPL was not distributed with this
+   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="20dp"
+    android:height="20dp"
+    android:viewportWidth="20"
+    android:viewportHeight="20">
+    <path
+        android:pathData="M6.741 16a0.982 0.982 0 0 1-0.579-0.189 0.98 0.98 0 0 1-0.375-1.04l0.798-3.132-2.487-2.066a0.979 0.979 0 0 1-0.307-1.062 0.98 0.98 0 0 1 0.873-0.679L7.89 7.623 9.086 4.62A0.978 0.978 0 0 1 10 4a0.98 0.98 0 0 1 0.915 0.621l1.196 3.003 3.226 0.209a0.979 0.979 0 0 1 0.873 0.679 0.978 0.978 0 0 1-0.309 1.061l-2.486 2.064 0.798 3.133a0.981 0.981 0 0 1-0.375 1.04 0.98 0.98 0 0 1-1.105 0.036L10 14.119l-2.732 1.727A0.984 0.984 0 0 1 6.741 16z"
+        android:fillColor="@color/mozac_ui_icons_fill" />
+</vector>
diff --git a/mobile/android/android-components/components/ui/icons/src/main/res/drawable/mozac_ic_star_one_half_fill_20.xml b/mobile/android/android-components/components/ui/icons/src/main/res/drawable/mozac_ic_star_one_half_fill_20.xml
new file mode 100644
index 000000000000..0c7cf4519b66
--- /dev/null
+++ b/mobile/android/android-components/components/ui/icons/src/main/res/drawable/mozac_ic_star_one_half_fill_20.xml
@@ -0,0 +1,15 @@
+<!-- This Source Code Form is subject to the terms of the Mozilla Public
+   - License, v. 2.0. If a copy of the MPL was not distributed with this
+   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="20dp"
+    android:height="20dp"
+    android:viewportWidth="20"
+    android:viewportHeight="20">
+    <path
+        android:pathData="M6.741 16a0.982 0.982 0 0 1-0.579-0.189 0.98 0.98 0 0 1-0.375-1.04l0.798-3.132-2.487-2.066a0.979 0.979 0 0 1-0.307-1.062 0.98 0.98 0 0 1 0.873-0.679L7.89 7.623 9.086 4.62A0.978 0.978 0 0 1 10 4a0.98 0.98 0 0 1 0.915 0.621l1.196 3.003 3.226 0.209a0.979 0.979 0 0 1 0.873 0.679 0.978 0.978 0 0 1-0.309 1.061l-2.486 2.064 0.798 3.133a0.981 0.981 0 0 1-0.375 1.04 0.98 0.98 0 0 1-1.105 0.036L10 14.119l-2.732 1.727A0.984 0.984 0 0 1 6.741 16z"
+        android:fillColor="@color/mozac_ic_star_unfilled" />
+    <path
+        android:pathData="M10 14.119l-2.732 1.727a0.984 0.984 0 0 1-1.481-1.075l0.798-3.132-2.487-2.066a0.979 0.979 0 0 1-0.307-1.062 0.98 0.98 0 0 1 0.873-0.679L7.89 7.623 9.086 4.62A0.978 0.978 0 0 1 10 4v10.119z"
+        android:fillColor="@color/mozac_ic_star_filled" />
+</vector>
diff --git a/mobile/android/android-components/components/ui/icons/src/main/res/values/colors.xml b/mobile/android/android-components/components/ui/icons/src/main/res/values/colors.xml
index 815e46650c7f..eea51fb79f73 100644
--- a/mobile/android/android-components/components/ui/icons/src/main/res/values/colors.xml
+++ b/mobile/android/android-components/components/ui/icons/src/main/res/values/colors.xml
@@ -5,4 +5,8 @@
 
 <resources>
     <color name="mozac_ui_icons_fill">#FFFFFF</color>
+
+    <!-- Star icon fill colors for mozac_ic_star_one_half_fill_20 -->
+    <color name="mozac_ic_star_filled">#000000</color>
+    <color name="mozac_ic_star_unfilled">#FFFFFF</color>
 </resources>
diff --git a/mobile/android/fenix/app/src/main/java/org/mozilla/fenix/shopping/ui/StarRating.kt b/mobile/android/fenix/app/src/main/java/org/mozilla/fenix/shopping/ui/StarRating.kt
index 8543dd842638..735dba1880f4 100644
--- a/mobile/android/fenix/app/src/main/java/org/mozilla/fenix/shopping/ui/StarRating.kt
+++ b/mobile/android/fenix/app/src/main/java/org/mozilla/fenix/shopping/ui/StarRating.kt
@@ -15,6 +15,7 @@ import androidx.compose.runtime.Composable
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.ColorFilter
+import androidx.compose.ui.res.colorResource
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.semantics.contentDescription
@@ -55,17 +56,22 @@ fun StarRating(
         horizontalArrangement = Arrangement.spacedBy(4.dp),
     ) {
         repeat(NUM_STARS) {
-            val starId = if (it < rating && it + 1 > rating) {
-                R.drawable.ic_star_half
+            val starId: Int
+            val colorFilter: ColorFilter?
+            if (it < rating && it + 1 > rating) {
+                starId = R.drawable.mozac_ic_star_one_half_fill_20
+                colorFilter = null // use the colors values in the vector
             } else if (it < rating) {
-                R.drawable.ic_bookmark_filled
+                starId = R.drawable.mozac_ic_star_fill_20
+                colorFilter = ColorFilter.tint(colorResource(id = R.color.mozac_ic_star_filled))
             } else {
-                R.drawable.ic_bookmark_outline
+                starId = R.drawable.mozac_ic_star_fill_20
+                colorFilter = ColorFilter.tint(colorResource(id = R.color.mozac_ic_star_unfilled))
             }
 
             Image(
                 painter = painterResource(id = starId),
-                colorFilter = ColorFilter.tint(FirefoxTheme.colors.iconPrimary),
+                colorFilter = colorFilter,
                 contentDescription = null,
             )
         }
diff --git a/mobile/android/fenix/app/src/main/res/drawable/ic_star_half.xml b/mobile/android/fenix/app/src/main/res/drawable/ic_star_half.xml
deleted file mode 100644
index 002412ec869b..000000000000
--- a/mobile/android/fenix/app/src/main/res/drawable/ic_star_half.xml
+++ /dev/null
@@ -1,17 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- This Source Code Form is subject to the terms of the Mozilla Public
-   - License, v. 2.0. If a copy of the MPL was not distributed with this
-   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
-<vector xmlns:android="http://schemas.android.com/apk/res/android"
-    android:width="24dp"
-    android:height="24dp"
-    android:viewportWidth="24"
-    android:viewportHeight="24">
-    <path
-        android:fillColor="?attr/textPrimary"
-        android:pathData="M7.23,21.5C6.79,21.5 6.34,21.36 5.97,21.09C5.25,20.57 4.93,19.68 5.15,18.82L6.21,14.67L2.91,11.93C2.23,11.36 1.96,10.45 2.24,9.61C2.51,8.77 3.26,8.18 4.15,8.13L8.43,7.85L10.01,3.87C10.34,3.05 11.12,2.51 12.01,2.51C12.9,2.51 13.68,3.04 14.01,3.87L15.59,7.85L19.87,8.13C20.75,8.19 21.5,8.77 21.78,9.61C22.05,10.45 21.79,11.37 21.11,11.93L17.81,14.67L18.87,18.82C19.09,19.68 18.77,20.57 18.05,21.09C17.33,21.61 16.38,21.64 15.63,21.17L12.01,18.88L8.39,21.17C8.04,21.39 7.64,21.51 7.24,21.51L7.23,21.5ZM12,4.25C11.9,4.25 11.71,4.28 11.63,4.5L9.84,9C9.72,9.31 9.42,9.53 9.08,9.55L4.25,9.86C4.01,9.88 3.92,10.04 3.89,10.14C3.86,10.22 3.83,10.42 4.02,10.58L7.74,13.67C8,13.89 8.11,14.23 8.03,14.56L6.84,19.25C6.78,19.48 6.91,19.62 6.99,19.68C7.07,19.74 7.24,19.82 7.44,19.69L11.53,17.1C11.82,16.92 12.18,16.92 12.46,17.1L16.55,19.69C16.75,19.82 16.92,19.74 17,19.68C17.08,19.62 17.21,19.48 17.15,19.25L15.95,14.56C15.87,14.23 15.98,13.89 16.24,13.67L19.96,10.58C20.15,10.42 20.11,10.22 20.09,10.15C20.06,10.05 19.97,9.89 19.73,9.87L14.9,9.56C14.56,9.54 14.27,9.32 14.14,9.01L12.35,4.51C12.26,4.29 12.08,4.26 11.98,4.26L12,4.25Z" />
-    <path
-        android:fillColor="?attr/textPrimary"
-        android:fillType="evenOdd"
-        android:pathData="M5.833,21.2C6.107,21.399 6.427,21.5 6.749,21.5C7.037,21.5 7.325,21.419 7.583,21.257L11.909,18.522L12,18.58V2.503C11.97,2.501 11.94,2.5 11.909,2.5C11.266,2.5 10.697,2.886 10.46,3.482L8.567,8.237L3.459,8.568C2.818,8.61 2.276,9.032 2.077,9.643C1.879,10.254 2.07,10.913 2.564,11.324L6.502,14.594L5.239,19.553C5.08,20.176 5.313,20.822 5.833,21.2ZM17.132,21.5H17.004C17.047,21.502 17.09,21.502 17.132,21.5Z" />
-</vector>
diff --git a/mobile/android/fenix/app/src/main/res/values-night/colors.xml b/mobile/android/fenix/app/src/main/res/values-night/colors.xml
index 8a2a6240a868..d2f3f846e411 100644
--- a/mobile/android/fenix/app/src/main/res/values-night/colors.xml
+++ b/mobile/android/fenix/app/src/main/res/values-night/colors.xml
@@ -168,4 +168,8 @@
 
     <!-- Add-ons colors -->
     <color name="mozac_feature_addons_error_text_color">@color/photonRed20</color>
+
+    <!-- Star icon fill colors -->
+    <color name="mozac_ic_star_filled">@color/photonLightGrey40</color>
+    <color name="mozac_ic_star_unfilled">@color/photonDarkGrey05</color>
 </resources>
diff --git a/mobile/android/fenix/app/src/main/res/values/colors.xml b/mobile/android/fenix/app/src/main/res/values/colors.xml
index f31bf2e8a423..03fb915e32c0 100644
--- a/mobile/android/fenix/app/src/main/res/values/colors.xml
+++ b/mobile/android/fenix/app/src/main/res/values/colors.xml
@@ -356,4 +356,8 @@
 
     <!-- Add-ons colors -->
     <color name="mozac_feature_addons_error_text_color" tools:ignore="UnusedResources">@color/photonRed70</color>
+
+    <!-- Star icon fill colors -->
+    <color name="mozac_ic_star_filled">@color/photonBlack</color>
+    <color name="mozac_ic_star_unfilled">#D9D9D9</color>
 </resources>
-- 
2.11.4.GIT