function ProductItem()

in frontend/src/components/ProductItem.js [10:59]


function ProductItem(props) {
  var stars;
  var itemStars = Math.floor(Math.random() * 6);
  var totalChits = 0;
  var i;

  for (i = 0; i < 5; i++) {
    if (i <= itemStars - 1) {
      stars = [stars, <Icon color="yellow" name="star" key={Math.random()} />];
      totalChits++;
    }
  }
  for (i = 0; i < 5 - totalChits; i++) {
    stars = [
      stars,
      <Icon color="yellow" name="star outline" key={Math.random()} />,
    ];
  }

  return (
    <Grid.Column>
      <Grid>
        <Grid.Row>
          <Grid.Column>
            <Link to={"/Product/" + props.item.id}>
              <Image src={"/images/products/" + props.item.itemImage} centered />
            </Link>
            <Container style={{ paddingLeft: "2em" }}>
              <LinkStyle>
                <Link to={"/Product/" + props.item.id}>
                  {props.item.itemName}
                </Link>
              </LinkStyle>
              <StoreText>{props.item.itemDesc}</StoreText>
              {stars}
              <Grid columns={2}>
                <Grid.Column width={3}>
                  <PriceText>{formatCurrency(props.item.itemPrice)}</PriceText>
                </Grid.Column>
              </Grid>
              {props.item.itemStock > 0 && (
                <StockText>{props.item.itemStock} in stock</StockText>
              )}
            </Container>
          </Grid.Column>
        </Grid.Row>
      </Grid>
    </Grid.Column>
  );
}