{% extends "workspaces/base.html" %}

{% from "components/alert.html" import Alert %}
{% from "components/icon.html" import Icon %}
{% from "components/modal.html" import Modal %}
{% from "components/text_input.html" import TextInput %}

{% block workspace_content %}

  <form method="POST" action="{{ url_for('workspaces.edit_project', workspace_id=workspace.id, project_id=project.id) }}" v-on:submit="handleSubmit">

    {% include "fragments/edit_project_form.html" %}

    <div class="block-list project-list-item">
      <header class="block-list__header block-list__header--grow">
        <h2 class="block-list__title">Project Environments</h2>
        <p>
          Each environment created within a project is an enclave of cloud resources that is logically separated from each other for increased security.
        </p>
      </header>

      <ul>
        {% for environment in project.environments %}
          <li class="block-list__item project-edit__env-list-item">
            <div class="usa-input">
              <label>Environment Name</label>
              <input type="text" value="{{ environment.name }}" readonly />
            </div>
          </li>
        {% endfor %}
      </ul>
    </div>

    <div class="action-group">
      <button class="usa-button usa-button-primary" tabindex="0" type="submit">Update Project</button>
    </div>
  </form>

{% endblock %}