import React, {useState} from "react";

const aspects = ["Readability", "Performance", "Security", "Documentation", "Testing"];

const FeedbackSystem = () => { const [feedback, setFeedback] = useState( aspects.map(() => ({ upvotes: 0, downvotes: 0 })) );

const handleUpvote = (index) => { const newFeedback = [...feedback]; newFeedback[index].upvotes ++; setFeedback(newFeedback); };

const handleDownvote = (index) => { const newFeedback = [...feedback]; newFeedback[index].downvotes ++; setFeedback(newFeedback); }; return ( {aspects.map((aspect, index) => (

{aspect}

upvote-btn-{index}} onClick={() => handleDownvote(index)}> 👎 Downvote upvote-btn-${index}}> Upvotes: {feedback[index].upvotes}

downvote-count-${index}}> Downvotes: {feedback[index].downvotes}

))} ); };

export default FeedbackSystem;