{% extends "base.html" %}
{% block content %}
  <div class="d-flex justify-content-between align-items-start">
    <h1 class="h3">Company: {{ company.name }}</h1>
    <div>
      <a class="btn btn-outline-secondary" href="{{ url_for('admin.dashboard') }}">Back</a>
    </div>
  </div>

  <div class="card border-danger mt-3">
    <div class="card-body">
      <h2 class="h6 text-danger mb-2">Danger zone</h2>
      <p class="mb-2 text-muted">
        Deleting a company will permanently remove <strong>all</strong> its users, displays, playlists and uploaded media.
      </p>
      <form
        method="post"
        action="{{ url_for('admin.delete_company', company_id=company.id) }}"
        onsubmit="return confirm('Delete company \'{{ company.name }}\'? This will delete all its users, displays, playlists and media. This cannot be undone.');"
      >
        <button class="btn btn-danger" type="submit">Delete company</button>
      </form>
    </div>
  </div>

  <div class="row mt-4">
    <div class="col-md-6">
      <h2 class="h5">Users</h2>
      <form method="post" action="{{ url_for('admin.create_company_user', company_id=company.id) }}" class="card card-body mb-3">
        <div class="mb-2">
          <label class="form-label">Username</label>
          <input class="form-control" name="username" required />
        </div>
        <div class="mb-2">
          <label class="form-label">Email</label>
          <input class="form-control" type="email" name="email" required />
        </div>
        <div class="mb-2">
          <label class="form-label">Password</label>
          <input class="form-control" type="password" name="password" required />
        </div>
        <button class="btn btn-success" type="submit">Create user</button>
      </form>

      <div class="list-group">
        {% for u in company.users %}
          <div class="list-group-item d-flex justify-content-between align-items-center">
            <div>
              <strong>{{ u.username }}</strong>
              <div class="text-muted">{{ u.email or "(no email set)" }}</div>
            </div>
            <div class="d-flex align-items-center gap-2">
              <form method="post" action="{{ url_for('admin.update_user_email', user_id=u.id) }}" class="d-flex gap-2">
                <input class="form-control form-control-sm" style="width: 240px" type="email" name="email" placeholder="email" value="{{ u.email or '' }}" />
                <button class="btn btn-outline-primary btn-sm" type="submit">Save</button>
              </form>
              <form method="post" action="{{ url_for('admin.impersonate', user_id=u.id) }}">
                <button class="btn btn-warning btn-sm" type="submit">Impersonate</button>
              </form>
            </div>
          </div>
        {% else %}
          <div class="text-muted">No users.</div>
        {% endfor %}
      </div>
    </div>

    <div class="col-md-6">
      <h2 class="h5">Displays</h2>
      <form method="post" action="{{ url_for('admin.create_display', company_id=company.id) }}" class="card card-body mb-3">
        <div class="input-group">
          <input class="form-control" name="name" placeholder="Display name" />
          <button class="btn btn-success" type="submit">Add display</button>
        </div>
      </form>

      <div class="list-group">
        {% for d in company.displays %}
          <div class="list-group-item">
            <div class="d-flex justify-content-between">
              <div>
                <strong>{{ d.name }}</strong>
                <div class="text-muted monospace">Token: {{ d.token }}</div>
                <div class="text-muted">Player URL: <a href="{{ url_for('display.display_player', token=d.token) }}" target="_blank">{{ url_for('display.display_player', token=d.token, _external=true) }}</a></div>
              </div>
              <div class="text-muted">Assigned: {{ d.assigned_playlist.name if d.assigned_playlist else "(none)" }}</div>
            </div>
          </div>
        {% else %}
          <div class="text-muted">No displays.</div>
        {% endfor %}
      </div>
    </div>
  </div>
{% endblock %}