All files / components/Commons ManageCows.jsx

100% Statements 56/56
100% Branches 9/9
100% Functions 3/3
100% Lines 56/56

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 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 901x 1x 1x 1x   1x 1x 65x 65x 65x 65x 65x 65x   65x 65x 65x 65x     65x 65x 65x 65x       65x 65x   65x 65x   65x 65x     65x 1x 1x         1x 65x 65x 65x 65x 65x 2x 2x 2x 65x 65x       65x 65x 65x 65x 2x 2x 2x 65x 65x         65x 65x 65x 65x 65x                     65x   1x  
import React from "react";
import { Card, Button, Row, Col } from "react-bootstrap";
import { useCurrentUser, hasRole } from "main/utils/currentUser";
import { useParams } from "react-router-dom";
 
// add parameters
const ManageCows = ({ userCommons, commons, setMessage, openModal }) => {
  // update cowPrice from fixture
  const { data: currentUser } = useCurrentUser();
  let { userId } = useParams();
  userId = userId ? parseInt(userId, 10) : NaN;
  // Stryker disable all
  const isViewOnly = hasRole(currentUser, "ROLE_ADMIN") && !isNaN(userId);
 
  // Stryker restore all
  return (
    <Card>
      <Card.Header as="h5" className="woodenboardtable">
        Manage Cows
      </Card.Header>
      <Card.Body
        style={
          // Stryker disable next-line all: don't test CSS params
          { backgroundColor: "rgb(245, 210, 140)" }
        }
      >
        {/* change $10 to info from fixture */}
        <Card.Title className="text-center">
          💵 Market Cow Price: ${commons?.cowPrice}
        </Card.Title>
        <Card.Title className="text-center">
          🐮 Number of Cows: {userCommons.numOfCows}
        </Card.Title>
        <Card.Title className="text-center">
          🥛 Current Milk Price: ${commons?.milkPrice}
        </Card.Title>
        {/* when the ID doesnt match, dont show the buy/sell button */}
        {isViewOnly ? (
          <>
            <p data-testid="ManageCows-ViewOnly">
              This page is for viewing only, cannot buy and sell cows.
            </p>
          </>
        ) : (
          <>
            <Row>
              <Col className="text-center">
                <Button
                  variant="outline-success"
                  onClick={() => {
                    setMessage("buy");
                    openModal();
                  }}
                  data-testid={"buy-cow-button"}
                >
                  Buy cows
                </Button>
              </Col>
              <Col className="text-center">
                <Button
                  variant="outline-danger"
                  onClick={() => {
                    setMessage("sell");
                    openModal();
                  }}
                  data-testid={"sell-cow-button"}
                >
                  Sell cows
                </Button>
              </Col>
            </Row>
            <p>
              <b>Note:</b>
              <ul>
                <li>Buying cows buys at the current cow price.</li>
                <li>
                  Selling cows sells at the current cow price multiplied by the
                  average cow health (as a percentage.)
                </li>
              </ul>
            </p>
          </>
        )}
      </Card.Body>
    </Card>
  );
};
 
export default ManageCows;