Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 | 3x 37x 37x 37x 37x 3x 3x 34x 1x 1x 33x 1x 1x 37x 2x 2x | import React from "react";
import { Card, Button, Row, Col } from "react-bootstrap";
import happyCowHead from "./../../../assets/happycow.png";
import averageCowHead from "./../../../assets/averagecow.png";
import sadCowHead from "./../../../assets/sadcow.png";
import sickCowHead from "./../../../assets/sickcow.png";
// add parameters
const ManageCows = ({userCommons,commons, onBuy, onSell}) => {
// update cowPrice from fixture
var cowHealth = Math.round(userCommons.cowHealth*100)/100;
var cowHead = sickCowHead;
var cowIcon = "sickCowIcon";
if (cowHealth >= 93) {
cowHead = happyCowHead;
cowIcon = "happyCowIcon";
} else if (cowHealth >= 84) {
cowHead = averageCowHead;
cowIcon = "averageCowIcon";
} else if (cowHealth >= 72) {
cowHead = sadCowHead;
cowIcon = "sadCowIcon";
}
return (
<Card>
<Card.Header as="h5">Manage Cows</Card.Header>
<Card.Body>
{/* change $10 to info from fixture */}
<Card.Title>Market Cow Price: ${commons?.cowPrice}</Card.Title>
<Card.Title>Number of Cows: {userCommons.numOfCows}</Card.Title>
<Card.Title>Current Milk Price: ${commons?.milkPrice} </Card.Title>
<Row>
<Col>
<Card.Text>
<img alt={cowIcon} className="icon" src={cowHead}></img>
Cow Health: {cowHealth}%
</Card.Text>
</Col>
<Col>
<Button variant="outline-danger" onClick={()=>{onBuy(userCommons)}} data-testid={"buy-cow-button"}>Buy cow</Button>
<br/>
<br/>
<Button variant="outline-danger" onClick={()=>{onSell(userCommons)}} data-testid={"sell-cow-button"}>Sell cow</Button>
<br/>
<br/>
</Col>
</Row>
Note: Buying cows buys at current cow price, but selling cows sells at current cow price
times the average health of cows as a percentage!
</Card.Body>
</Card>
);
};
export default ManageCows; |