import Elementary
import Routes

public struct PrimaryButton: HTML, Sendable {
  let label: String

  public init(label: String) {
    self.label = label
  }

  public var content: some HTML<HTMLTag.button> {
    button(
      .class("""
        font-bold py-2 px-4 transition-colors
        bg-blue-500 enabled:hover:bg-blue-600
        text-yellow-300
      """)
    ) { label }
  }
}

public struct SecondaryButton: HTML, Sendable {
  let label: String

  public init(label: String) {
    self.label = label
  }

  public var content: some HTML<HTMLTag.button> {
    button(
      .class("""
        font-bold py-2 px-4 transition-colors
        bg-yellow-300 enabled:hover:bg-yellow-400
        text-blue-600
      """)
    ) { label }
  }
}

public struct SubmitButton: HTML, Sendable {
  let label: String

  public init(label: String) {
    self.label = label
  }

  public var content: some HTML<HTMLTag.button> {
    button(
      .type(.submit),
      .class("""
        w-full font-bold py-3 rounded-md transition-colors
        bg-yellow-300 dark:bg-blue-500
        hover:bg-yellow-400 hover:dark:bg-blue-600
        text-blue-500 dark:text-yellow-300
      """)
    ) { label }
  }
}

public struct ResetButton: HTML, Sendable {

  let label: String

  public init(label: String = "Reset") {
    self.label = label
  }

  public var content: some HTML<HTMLTag.button> {
    button(.class("""
      font-bold px-4 py-2 rounded-md transition-colors
      bg-blue-500 dark:bg-yellow-300
      hover:bg-blue-600 hover:dark:bg-yellow-400
      text-yellow-300 dark:text-blue-500
    """)) {
      label
    }
  }
}

public struct Toggle: HTML {

  let isOn: Bool

  // Left hand side / 'on' label.
  let onLabel: String
  // Applied to the rhs when the toggle is consider 'off'.
  let onAttributes: [HTMLAttribute<HTMLTag.button>]

  // Right hand side / 'off' label.
  let offLabel: String
  // Applied to the left hand side when the toggle is consider 'on'.
  let offAttributes: [HTMLAttribute<HTMLTag.button>]

  public init(
    isOn: Bool,
    onLabel: String,
    onAttributes: [HTMLAttribute<HTMLTag.button>],
    offLabel: String,
    offAttributes: [HTMLAttribute<HTMLTag.button>]
  ) {
    self.isOn = isOn
    self.onLabel = onLabel
    self.onAttributes = onAttributes
    self.offLabel = offLabel
    self.offAttributes = offAttributes
  }

  public var content: some HTML<HTMLTag.div> {
    div(.class("flex items-center gap-x-0")) {
      switch isOn {
      case true:
        SecondaryButton(label: onLabel)
          .attributes(.class("rounded-s-lg"), .disabled)

        PrimaryButton(label: offLabel)
          .attributes(contentsOf: offAttributes + [.class("rounded-e-lg")])

      case false:
        PrimaryButton(label: onLabel)
          .attributes(contentsOf: onAttributes + [.class("rounded-s-lg")])

        SecondaryButton(label: offLabel)
          .attributes(.class("rounded-e-lg"), .disabled)
      }
    }
  }
}

public extension Array where Element == HTMLAttribute<HTMLTag.button> {

  static func hxDefaults(
    _ attributes: HTMLAttribute<HTMLTag.button>...
  ) -> Self {
    [
      .hx.target("#content"),
      .hx.pushURL(true)
    ] + attributes
  }

  static func hxDefaults(
    get route: SiteRoute.View
  ) -> Self {
    .hxDefaults(.hx.get(route: route))
  }
}