updated links

frontend/src/components/ItemReviews.tsx

@@ -1,4 +1,5 @@
 import React, { useState, useEffect } from "react";
+import { useNavigate } from "react-router-dom";
 import { Rental } from "../types";
 import { itemAPI } from "../services/api";
 
@@ -7,6 +8,7 @@ interface ItemReviewsProps {
 }
 
 const ItemReviews: React.FC<ItemReviewsProps> = ({ itemId }) => {
+  const navigate = useNavigate();
   const [reviews, setReviews] = useState<Rental[]>([]);
   const [loading, setLoading] = useState(true);
   const [averageRating, setAverageRating] = useState(0);
@@ -78,7 +80,11 @@ const ItemReviews: React.FC<ItemReviewsProps> = ({ itemId }) => {
               <div key={rental.id} className="mb-3 pb-3 border-bottom">
                 <div className="d-flex justify-content-between align-items-start mb-2">
                   <div>
-                    <div className="d-flex align-items-center gap-2">
+                    <div
+                      className="d-flex align-items-center gap-2"
+                      onClick={() => rental.renter && navigate(`/users/${rental.renterId}`)}
+                      style={{ cursor: "pointer" }}
+                    >
                       {rental.renter?.profileImage ? (
                         <img
                           src={rental.renter.profileImage}
@@ -102,7 +108,7 @@ const ItemReviews: React.FC<ItemReviewsProps> = ({ itemId }) => {
                         </div>
                       )}
                       <div>
-                        <strong>
+                        <strong style={{ color: "#0d6efd" }}>
                           {rental.renter?.firstName} {rental.renter?.lastName}
                         </strong>
                         <div className="small">