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

  <div class="mt-4">
    <div class="card card-elevated">
      <div class="card-header d-flex justify-content-between align-items-center">
        <h2 class="h5 mb-0">Displays</h2>
        <form method="post" action="{{ url_for('admin.create_display', company_id=company.id) }}" class="d-flex gap-2">
          <input class="form-control" name="name" placeholder="Display name" />
          <button class="btn btn-brand" type="submit">Add display</button>
        </form>
      </div>
      <div class="table-responsive">
        <table class="table table-hover mb-0">
          <thead>
            <tr>
              <th>Name</th>
              <th>Token</th>
              <th>Assigned</th>
              <th class="text-end">Player</th>
            </tr>
          </thead>
          <tbody>
            {% for d in company.displays %}
              <tr>
                <td>
                  <form method="post" action="{{ url_for('admin.update_display_name', display_id=d.id) }}" class="d-flex gap-2 align-items-center flex-wrap">
                    <input
                      class="form-control form-control-sm"
                      style="max-width: 320px"
                      name="name"
                      value="{{ d.name }}"
                      required
                      maxlength="120"
                    />
                    <button class="btn btn-ink btn-sm" type="submit">Save</button>
                  </form>
                </td>
                <td class="monospace small">{{ d.token }}</td>
                <td class="text-muted">{{ d.assigned_playlist.name if d.assigned_playlist else "(none)" }}</td>
                <td class="text-end">
                  <div class="d-inline-flex gap-2">
                    <a class="btn btn-outline-ink btn-sm" href="{{ url_for('display.display_player', token=d.token) }}" target="_blank">Open</a>
                    <form
                      method="post"
                      action="{{ url_for('admin.delete_display', display_id=d.id) }}"
                      data-confirm="Delete display {{ d.name }}? This cannot be undone."
                      onsubmit="return confirm(this.dataset.confirm);"
                    >
                      <button class="btn btn-outline-danger btn-sm" type="submit">Delete</button>
                    </form>
                  </div>
                </td>
              </tr>
            {% else %}
              <tr>
                <td colspan="4" class="text-muted">No displays.</td>
              </tr>
            {% endfor %}
          </tbody>
        </table>
      </div>
    </div>
  </div>

  <div class="mt-4">
    <div class="card card-elevated">
      <div class="card-header">
        <h2 class="h5 mb-0">Storage limit</h2>
      </div>
      <div class="card-body">
        <div class="text-muted small mb-2">
          Used: <strong>{{ storage.used_bytes }}</strong> bytes
        </div>

        <form method="post" action="{{ url_for('admin.update_company_storage', company_id=company.id) }}" class="d-flex gap-2 flex-wrap align-items-end">
          <div>
            <label class="form-label">Max storage (MB)</label>
            <input
              class="form-control"
              type="number"
              name="storage_max_mb"
              min="0"
              step="1"
              value="{{ (company.storage_max_bytes / (1024*1024))|int if company.storage_max_bytes else '' }}"
              placeholder="(empty = unlimited)"
            />
            <div class="text-muted small">Set to 0 or empty to disable the limit.</div>
          </div>
          <div>
            <button class="btn btn-brand" type="submit">Save</button>
          </div>
        </form>
      </div>
    </div>
  </div>

  <div class="row mt-4">
    <div class="col-12 col-lg-6">
      <div class="card card-elevated">
        <div class="card-header">
          <h2 class="h5 mb-0">Add user</h2>
        </div>
        <div class="card-body">
          <form method="post" action="{{ url_for('admin.create_company_user', company_id=company.id) }}">
            <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-brand" type="submit">Create user</button>
          </form>
        </div>
      </div>
    </div>

    <div class="col-12 col-lg-6 mt-4 mt-lg-0">
      <div class="card card-elevated">
        <div class="card-header">
          <h2 class="h5 mb-0">Users</h2>
        </div>
        <div class="card-body p-0">
          <div class="list-group list-group-flush">
            {% for u in company.users %}
              <div class="list-group-item d-flex justify-content-between align-items-center">
                <div>
                  <strong>{{ u.email or "(no email)" }}</strong>
                </div>
                <div class="d-flex gap-2">
                  <form method="post" action="{{ url_for('admin.impersonate', user_id=u.id) }}">
                    <button class="btn btn-brand btn-sm" type="submit">Impersonate</button>
                  </form>

                  <form
                    method="post"
                    action="{{ url_for('admin.delete_user', user_id=u.id) }}"
                    data-confirm="Delete user {{ u.email or '(no email)' }}? This cannot be undone."
                    onsubmit="return confirm(this.dataset.confirm);"
                  >
                    <button class="btn btn-outline-danger btn-sm" type="submit">Delete</button>
                  </form>
                </div>
              </div>
            {% else %}
              <div class="list-group-item text-muted">No users.</div>
            {% endfor %}
          </div>
        </div>
      </div>
    </div>
  </div>

  <div class="card border-danger mt-4">
    <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>
{% endblock %}