1 files changed, 37 insertions, 0 deletions
diff --git a/src/components/jet/item/ProductRatingsItem.svelte b/src/components/jet/item/ProductRatingsItem.svelte
new file mode 100644
index 0000000..0345993
--- /dev/null
+++ b/src/components/jet/item/ProductRatingsItem.svelte
@@ -0,0 +1,37 @@
+<script lang="ts">
+    import type { Ratings } from '@jet-app/app-store/api/models';
+
+    import RatingComponent from '@amp/web-app-components/src/components/Rating/Rating.svelte';
+    import { getJet } from '~/jet/svelte';
+    import { getI18n } from '~/stores/i18n';
+
+    export let item: Ratings;
+
+    const i18n = getI18n();
+    const jet = getJet();
+    const numberOfRatings = jet.localization.formattedCount(
+        item.totalNumberOfRatings,
+    );
+</script>
+
+<article>
+    {#if item.totalNumberOfRatings === 0}
+        {item.status}
+    {:else}
+        <RatingComponent
+            averageRating={jet.localization.decimal(item.ratingAverage, 1)}
+            ratingCount={item.totalNumberOfRatings}
+            ratingCountText={$i18n.t('ASE.Web.AppStore.Ratings.CountText', {
+                numberOfRatings: numberOfRatings,
+            })}
+            totalText={$i18n.t('ASE.Web.AppStore.Ratings.TotalText')}
+            ratingCountsList={item.ratingCounts}
+        />
+    {/if}
+</article>
+
+<style>
+    article {
+        --ratingBarColor: var(--systemPrimary);
+    }
+</style>