exercise 1.10

This commit is contained in:
Anish Lakhwara 2023-05-15 21:32:23 +10:00
parent d301767634
commit a62d2f712a

View file

@ -1,9 +1,16 @@
import { useState } from 'react'
const Stats = ({ positive, neutral, negative }) => {
const total = positive - negative
const votes = positive + neutral + negative
if (votes == 0) {
const StatisticLine = ({ value, text }) => {
return (
<tr>
<td>{text}</td>
<td>{value}</td>
</tr>
)
}
const Stats = ({ positive, neutral, negative, total, votes }) => {
if (votes === 0) {
return (
<>
<p> No Votes Cast Yet </p>
@ -13,12 +20,12 @@ const Stats = ({ positive, neutral, negative }) => {
return (
<>
<h2> Results </h2>
<p> Positive: {positive} </p>
<p> Neutral: {neutral} </p>
<p> Negative: {negative} </p>
<p> All: {votes} </p>
<p> Average: {total / votes} </p>
<p> Positive: {positive / votes} </p>
<StatisticLine text="Positive" value={positive} />
<StatisticLine text="Neutral" value={neutral} />
<StatisticLine text="Negative" value={negative} />
<StatisticLine text="All" value={votes} />
<StatisticLine text="Average" value={total / votes} />
<StatisticLine text="Positive" value={positive / votes} />
</>
)
}
@ -35,6 +42,8 @@ const App = () => {
const [good, setGood] = useState(0)
const [neutral, setNeutral] = useState(0)
const [bad, setBad] = useState(0)
const total = good - bad
const votes = good + neutral + bad
const incPositive = () => {
setGood(good + 1)
@ -54,7 +63,7 @@ const App = () => {
<Button handler={incPositive} text="positive" />
<Button handler={incNeutral} text="neutral" />
<Button handler={incNegative} text="negative" />
<Stats positive={good} negative={bad} neutral={neutral} />
<Stats positive={good} negative={bad} neutral={neutral} total={total} votes={votes} />
</div>
)
}