import DatabaseClient
import Dependencies
import Elementary
import ElementaryHTMX
import SharedModels

struct UserTable: HTML {

  let users: [User]

  var content: some HTML {
    table {
      thead {
        tr {
          th { "Username" }
          th { "Email" }
          th(.style("width: 50px;")) {
            Button.add()
              .attributes(
                .hx.get(route: .user(.form)),
                .hx.target(.id(.float)),
                .hx.swap(.outerHTML)
              )
          }
        }
      }
      tbody(.id(.user(.table))) {
        for user in users {
          Row(user: user)
        }
      }
    }
  }

  struct Row: HTML {
    let user: User

    init(user: User) {
      self.user = user
    }

    var content: some HTML<HTMLTag.tr> {
      tr(.id(.user(.row(id: user.id)))) {
        td { user.username }
        td { user.email }
        td {
          Button.detail().attributes(
            .hx.get(route: .user(.get(id: user.id))),
            .hx.target(.id(.float)),
            .hx.swap(.outerHTML),
            .hx.pushURL(true)
          )
        }
      }
    }
  }
}