import * as React from "react"
import { storiesOf } from "@storybook/react"
import { TabNavigation } from "../TabNavigation"
import { withState } from "recompose"

const NavWithState = withState("activeTabIndex", "onSelectTab", 1)((props: any) => (
  <div>
    <TabNavigation {...props} />
    <h1>Page{props.activeTabIndex}</h1>
  </div>
)) as any

storiesOf("TabNavigation", module)
  .add("Basic", () => {
    return (
      <NavWithState
        tabs={[
          { key: "TabA", name: "Introduction" },
          { key: "TabB", name: "Review" },
          { key: "TabC", name: "Comment" },
          { key: "TabD", name: "Printing Book" }
        ]}
      />
    )
  })