import React from "react";
import { storiesOf } from "@storybook/react";
import { checkA11y } from "storybook-addon-a11y";
import TitleDropdown from "./index";

storiesOf("TitleDropdown")
  .addDecorator(checkA11y)
  .add("should render", () => (
    <TitleDropdown
      selectedMetric="Total Sales"
      items={[
        {
          id: "1",
          title: "Customers",
          onItemClick: () => this.props.onSelectMetric("customers"),
          selected: false,
        },
        {
          id: "2",
          title: "Units Sold",
          onItemClick: () => this.props.onSelectMetric("units_sold"),
          selected: false,
        },
        {
          id: "3",
          title: "Total Sales",
          onItemClick: () => this.props.onSelectMetric("sales"),
          selected: true,
        },
      ]}
    >
      Top products based on{" "}
    </TitleDropdown>
  ))
  .add("should render for reports", () => (
      <TitleDropdown forReport selectedMetric="total sales">Top products based on {" "}</TitleDropdown>
  ));