feat: implement rating summary service methods and integrate rating display components into the organization header and pending ratings page

2026-07-22 12:13:50 -03:00
parent 383a5bc6b4
commit da3c3abb52
27 changed files with 1334 additions and 104 deletions
@@ -5,6 +5,7 @@ import { PublicServiceView } from "@models/Service.model";

 import style from "./style.module.css";
 import { getServiceImage } from "@core/helpers/getServiceImage";
+import ServiceRatingSummary from "@components/ServiceRatingSummary/ServiceRatingSummary";

 export type FindResultsViewMode = "grid" | "card";

@@ -45,25 +46,28 @@ export default function ProductItem(props: ProductItemProps) {
                        goTo(`/landing/service/${product.id}`);
                    }}
                >
-                    <img
-                        src={getServiceImage(product.image)}
-                        alt={product.name}
-                        draggable="false"
-                        style={{
-                            width: "100%",
-                            height: "auto",
-                            borderRadius: "10px",
-                        }}
-                    />
-                    <h3
-                        style={{
-                            fontSize: "1.2rem",
-                            margin: "10px 0",
-                            textTransform: "capitalize",
-                        }}
-                    >
-                        {product.name}
-                    </h3>
+                    <div className={style.cardImageWrap}>
+                        <img
+                            src={getServiceImage(product.image)}
+                            alt={product.name}
+                            draggable="false"
+                            style={{
+                                width: "100%",
+                                height: "auto",
+                                borderRadius: "10px",
+                                display: "block",
+                            }}
+                        />
+                        <ServiceRatingSummary
+                            serviceId={product.id}
+                            variant="card"
+                            displayMode="compact"
+                            showOpinionCount={false}
+                        />
+                    </div>
+                    <div className={style.cardHeader}>
+                        <h3 className={style.cardTitle}>{product.name}</h3>
+                    </div>
                    <p style={{ fontSize: "0.9rem", color: "#555" }}>{product.description}</p>
                    <span
                        style={{
@@ -119,8 +123,11 @@ export default function ProductItem(props: ProductItemProps) {
                            margin: "10px",
                        }}
                    />
-                    <div>
-                        <h3 className={style.itemTitle}>{product.name}</h3>
+                    <div className={style.itemContent}>
+                        <div className={style.itemHeader}>
+                            <h3 className={style.itemTitle}>{product.name}</h3>
+                            <ServiceRatingSummary serviceId={product.id} variant="row" showOpinionCount={false} />
+                        </div>

                        <p
                            className={style.itemDescription}