Below code reference, will update the color of star based on user click. Use “onClick” handler to extend further, if requires.
import React, {useState} from "react";
import {BsFillStarFill} from "react-icons/bs";
export const StarRating = ({totalNo = 5}) => {
const generateArray = (arrayList) => [...Array(arrayList).keys()];
const [selectedItem, setSelectedItem] = useState(0);
return(
<div>
{
generateArray(totalNo).map((_, index) => (
<BsFillStarFill color={selectedItem > index ? "tomato" : "white" } onClick={() => setSelectedItem(index + 1)} key={index}/>
))
}
<p>{selectedItem} of {totalNo} stars</p>
</div>
)
}