import * as React from "react"
import * as renderer from "react-test-renderer"
import ActionPanel from "../ActionPanel"
import {Border as BorderedButton } from "../../Button"
import { LoginDialog } from "../../Dialog/LoginDialog"

describe("ActionPanel test", () => {
  it("should render ActionPanel | viewcout : 107550 -> 107,550 , comnentcount : 400 -> 400, episodeCount : 40 -> 40", () => {
    const { book } = require("./bluekiss.book.json").data
    const onfollow = jest.fn()
    const component = renderer.create(
      <ActionPanel book={book} onFollowBookClick={onfollow} />
    )

    const viewCount = component.root.findAll((node) => {
      return node.type === "h3" && node.props.children === "107,550"
    })

    const commentCount = component.root.findAll((node) => {
      return node.type === "h3" && node.props.children === "400"
    })
    const episodeCount = component.root.findAll((node) => {
      return node.type === "h3" && node.props.children === "40"
    })
    expect(viewCount.length).toEqual(1)
    expect(commentCount.length).toEqual(1)
    expect(episodeCount.length).toEqual(1)
  })

  it("should render ActionPanel | viewcout : 1234567 -> 1,234,567 , comnentcount : 12345 -> 12,345 episodeCount : 1234 -> 1,234", () => {
    const { book } = require("./bluekiss.book.1.json").data
    const onfollow = jest.fn()
    const component = renderer.create(
      <ActionPanel book={book} onFollowBookClick={onfollow} />
    )

    const viewCount = component.root.findAll((node) => {
      return node.type === "h3" && node.props.children === "1,234,567"
    })

    const commentCount = component.root.findAll((node) => {
      return node.type === "h3" && node.props.children === "12,345"
    })
    const episodeCount = component.root.findAll((node) => {
      return node.type === "h3" && node.props.children === "1,234"
    })
    expect(viewCount.length).toEqual(1)
    expect(commentCount.length).toEqual(1)
    expect(episodeCount.length).toEqual(1)
  })

  it("should show login dialog on follow book if not log in", () => {
    const { book } = require("./bluekiss.book.json").data
    const onfollow = jest.fn()
    const component = renderer.create(
      <ActionPanel book={book} onFollowBookClick={onfollow} />
    )

    const followBtn = component.root.find((node) => {
      return node.type === (BorderedButton as any) && node.props.className === "ActionPanel__follow-button"
    })

    followBtn.props.onClick()

    expect(onfollow.mock.calls.length).toEqual(0)

    component.root.find((node) => node.type === (LoginDialog as any))

  })
})