/**
 * TEAM: frontend_infra
 * @flow
 */

import * as React from "react";

import Group from "../../Group";
import Badge from "../../Badge";
import Icon from "../../Icon";
import Button from "../../button/Button";

/**
 * @title Count is boolean
 * @description When the count is a boolean, the badge is rendered as a dot as long as count is true
 */
export default function BadgeBooleanCount(): React.Node {
  return (
    <Group>
      <Badge value={true}>
        <Button>Shipping Orders</Button>
      </Badge>
      <Badge value={true}>
        <Icon iconName="bell" size="xl" />
      </Badge>
    </Group>
  );
}