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

txclient/src/app/components/SelectebleServiceItem/SelectableServiceItem.tsx

@@ -4,6 +4,7 @@ import style from "./SelectableServiceItem.module.css";
 import { formatPrice } from "@helpers/Numbers";
 import { useState } from "react";
 import classNames from "classnames";
+import ServiceRatingSummary from "@components/ServiceRatingSummary/ServiceRatingSummary";
 
 export interface SelectableServiceItemProps {
     data: CollaboratorServiceItems;
@@ -39,7 +40,10 @@ export default function SelectableServiceItem(
     return (
         <>
             <div className={getClassesNames()} onClick={handleClick}>
-                <h1>{props.data.name}</h1>
+                <div className={style.serviceHeader}>
+                    <h1>{props.data.name}</h1>
+                    <ServiceRatingSummary serviceId={props.data.id} variant="row" showOpinionCount={false} />
+                </div>
                 <p>{props.data.description}</p>
                 <span>{formatPrice(props.data.price)}</span>
             </div>