.server_show
  h2 = @server.name

  .server-info
    p
      strong Status:
      span[class="status status--#{@server.status}"] = @server.status.humanize
    p
      strong Port:
      = @server.port
    p
      strong Template:
      = link_to @server.server_template.name, @server.server_template
    - if @server.last_health_check_at
      p
        strong Last Health Check:
        = time_ago_in_words(@server.last_health_check_at)

  .server-actions
    - case @server.status
    - when "stopped"
      = form_with url: start_server_path(@server), method: :post, local: true do |f|
        = f.submit "Start", class: "btn btn--success"
    - when "starting", "running"
      = form_with url: stop_server_path(@server), method: :post, local: true do |f|
        = f.submit "Stop", class: "btn btn--warning"
      = form_with url: restart_server_path(@server), method: :post, local: true do |f|
        = f.submit "Restart", class: "btn btn--warning"

  = link_to "Delete Server", server_path(@server), method: :delete, data: { confirm: "Sure?" }, class: "btn btn--danger"
  = link_to "Back", servers_path, class: "btn"

  section.logs
    h3 Live Logs
    #log-output
      em Loading logs...

    javascript:
      document.addEventListener('DOMContentLoaded', function() {
        const serverId = #{@server.id};
        const consumer = ActionCable.createConsumer();
        const logOutput = document.getElementById('log-output');

        consumer.subscriptions.create({channel: "LogChannel", server_id: serverId}, {
          received: function(data) {
            if (data.line) {
              const line = document.createElement('div');
              line.textContent = data.line;
              logOutput.appendChild(line);
              logOutput.scrollTop = logOutput.scrollHeight;
            } else if (data.error) {
              const error = document.createElement('div');
              error.className = 'error';
              error.textContent = data.error;
              logOutput.appendChild(error);
            }
          }
        });
      });