import Elementary
import ElementaryHTMX
import SharedModels

struct EmployeeForm: HTML {
  let employee: Employee?
  let shouldShow: Bool

  init(employee: Employee? = nil, shouldShow: Bool = false) {
    self.employee = employee
    self.shouldShow = shouldShow
  }

  init(employee: Employee) {
    self.employee = employee
    self.shouldShow = true
  }

  var content: some HTML {
    Float(shouldDisplay: shouldShow, resetURL: .employee(.index)) {
      form(
        employee == nil ? .hx.post(route: targetURL) : .hx.put(route: targetURL),
        .hx.target(target),
        employee == nil
          ? .hx.swap(.beforeEnd.transition(true).swap("0.5s"))
          : .hx.swap(.outerHTML.transition(true).swap("0.5s")),
        .hx.on(
          .afterRequest,
          .ifSuccessful(.toggleContent(.float), .setWindowLocation(to: .employee(.index)))
        )
      ) {
        div(.class("row")) {
          input(
            .type(.text), .class("col-5"),
            .name("firstName"), .value(employee?.firstName ?? ""),
            .placeholder("First Name"), .required
          )
          div(.class("col-2")) {}
          input(
            .type(.text), .class("col-5"),
            .name("lastName"), .value(employee?.lastName ?? ""),
            .placeholder("Last Name"), .required
          )
        }
        if let employee {
          div(.class("row"), .style("margin: 20px; float: left;")) {
            label(.for("active"), .style("margin-right: 15px;")) { h2 { "Active" } }
            if employee.active {
              input(
                .type(.checkbox), .id("active"), .name("active"), .checked
              )
            } else {
              input(
                .type(.checkbox), .id("active"), .name("active")
              )
            }
          }
        }
        div(.class("btn-row")) {
          button(.type(.submit), .class("btn-primary")) {
            buttonLabel
          }
          if let employee {
            Button.danger {
              "Delete"
            }
            .attributes(
              .hx.confirm("Are you sure you want to delete this employee?"),
              .hx.delete(route: .employee(.delete(id: employee.id))),
              .hx.target(.id(.employee(.row(id: employee.id)))),
              .hx.swap(.outerHTML.transition(true).swap("1s"))
            )
          }
        }
      }
      if employee != nil {
        h3 {
          i {
            span(.class("primary"), .style("padding-right: 15px;")) {
              "Note:"
            }
            span(.class("secondary")) {
              "It is better to mark an employee as in-active instead of deleting them."
            }
          }
        }
      }
    }
  }

  private var target: HXTarget {
    guard let employee else {
      return .id(.employee(.table))
    }
    return .id(.employee(.row(id: employee.id)))
  }

  private var buttonLabel: String {
    guard employee != nil else { return "Create" }
    return "Update"
  }

  private var targetURL: SiteRoute.View {
    guard let employee else { return .employee(.index) }
    return .employee(.get(id: employee.id))
  }
}