Delete an application member

templates/fragments/applications/edit_team.html

@@ -3,6 +3,7 @@
 {{ team_form.csrf_token }}
 
 {% for member_form in team_form.members %}
+  {% set delete_modal_id = "delete-user-{}".format(member_form.id) %}
   {% set environment_roles_form = member_form.environment_roles %}
   {% set permissions_form = member_form.permission_sets %}
 
@@ -38,6 +39,13 @@
               {{ environment_form.environment_name.data }}
             </li>
           {% endfor %}
+          {% if user_can(permissions.EDIT_APPLICATION_MEMBER) %}
+            <li class="accordion-table__item__expanded action-group">
+              <span class="usa-button button-danger" v-on:click="openModal('{{ delete_modal_id }}')">
+                {{ "portfolios.members.archive_button" | translate }}
+              </span>
+            </li>
+          {% endif %}
         </ul>
       {% endcall %}
     {{ member_form.user_id() }}

templates/portfolios/applications/team.html

@@ -6,6 +6,9 @@
 {% from "components/toggle_list.html" import ToggleButton, ToggleSection %}
 {% from "components/multi_step_modal_form.html" import MultiStepModalForm %}
 {% import "fragments/applications/new_member_modal_content.html" as member_steps %}
+{% from "components/alert.html" import Alert %}
+{% from "components/delete_confirmation.html" import DeleteConfirmation %}
+{% from "components/modal.html" import Modal %}
 
 {% set secondary_breadcrumb = 'portfolios.applications.team_settings.title' | translate({ "application_name": application.name }) %}
 
@@ -109,6 +112,35 @@
           </div>
         </form>
       </base-form>
+
+      {% if user_can(permissions.EDIT_APPLICATION_MEMBER) %}
+        {% for member_form in team_form.members %}
+          {% set delete_modal_id = "delete-user-{}".format(member_form.id) %}
+          {% call Modal(name=delete_modal_id, dismissable=True) %}
+            <h1>
+              {{ "portfolios.applications.remove_member.header" | translate }}
+            </h1>
+
+            {{
+              Alert(
+                title=("portfolios.applications.remove_member.alert.title" | translate),
+                message=("portfolios.applications.remove_member.alert.message" | translate({"user_name": member_form.user_name.data})),
+                level="warning"
+              )
+            }}
+
+            {{
+              DeleteConfirmation(
+                modal_id=delete_modal_id,
+                delete_text=('portfolios.applications.remove_member.button' | translate),
+                delete_action=url_for('applications.remove_member', application_id=application.id, user_id=member_form.data.user_id),
+                form=member_form
+              )
+            }}
+          {% endcall %}
+        {% endfor %}
+      {% endif %}
+
       {% if user_can(permissions.CREATE_APPLICATION_MEMBER) %}
         {% import "fragments/applications/new_member_modal_content.html" as member_steps %}
         {{ MultiStepModalForm(