From 13e52dcc13ba25acc9621ef7597bc7070c9d4935 Mon Sep 17 00:00:00 2001
From: Sage Abdullah <sage.abdullah@torchbox.com>
Date: Thu, 10 Oct 2024 17:07:42 +0100
Subject: [PATCH] Simplify user create/edit templates
This also adds the footer actions and unsaved changes warning.
---
.../templates/wagtailusers/users/create.html | 96 ++++++++--------
.../templates/wagtailusers/users/edit.html | 107 ++++++++----------
2 files changed, 91 insertions(+), 112 deletions(-)
diff --git a/wagtail/users/templates/wagtailusers/users/create.html b/wagtail/users/templates/wagtailusers/users/create.html
index cb149ff462..c908505dcc 100644
--- a/wagtail/users/templates/wagtailusers/users/create.html
+++ b/wagtail/users/templates/wagtailusers/users/create.html
@@ -2,7 +2,7 @@
{% load wagtailadmin_tags wagtailimages_tags %}
{% load i18n %}
-{% block main_content %}
+{% block form_content %}
<div class="w-tabs" data-tabs>
<div class="w-tabs__wrapper">
<div role="tablist" class="w-tabs__list">
@@ -13,55 +13,51 @@
</div>
</div>
- <form action="{% url 'wagtailusers_users:add' %}" method="POST" novalidate{% if form.is_multipart %} enctype="multipart/form-data"{% endif %}>
- <div class="tab-content">
- {% csrf_token %}
- <section
- id="tab-account"
- class="w-tabs__panel"
- role="tabpanel"
- hidden
- aria-labelledby="tab-label-account"
- >
- <ul class="fields">
- {% block fields %}
- {% if form.separate_username_field %}
- <li>{% formattedfield form.username_field %}</li>
- {% endif %}
- <li>{% formattedfield form.email %}</li>
- <li>{% formattedfield form.first_name %}</li>
- <li>{% formattedfield form.last_name %}</li>
- {% block extra_fields %}{% endblock extra_fields %}
- {% if form.password1 %}
- <li>{% formattedfield form.password1 %}</li>
- {% endif %}
- {% if form.password2 %}
- <li>{% formattedfield form.password2 %}</li>
- {% endif %}
- {% endblock fields %}
+ <div class="tab-content">
+ <section
+ id="tab-account"
+ class="w-tabs__panel"
+ role="tabpanel"
+ hidden
+ aria-labelledby="tab-label-account"
+ >
+ <ul class="fields">
+ {% block fields %}
+ {% if form.separate_username_field %}
+ <li>{% formattedfield form.username_field %}</li>
+ {% endif %}
+ <li>{% formattedfield form.email %}</li>
+ <li>{% formattedfield form.first_name %}</li>
+ <li>{% formattedfield form.last_name %}</li>
+ {% block extra_fields %}{% endblock extra_fields %}
+ {% if form.password1 %}
+ <li>{% formattedfield form.password1 %}</li>
+ {% endif %}
+ {% if form.password2 %}
+ <li>{% formattedfield form.password2 %}</li>
+ {% endif %}
+ {% endblock fields %}
- <li>
- <a href="#tab-roles" data-tab-trigger class="button">
- {% trans "Roles" %}
- {% icon name="arrow-right" classname="default" %}
- </a>
- </li>
- </ul>
- </section>
- <section
- id="tab-roles"
- class="w-tabs__panel"
- role="tabpanel"
- hidden
- aria-labelledby="tab-label-roles"
- >
- <ul class="fields">
- <li>{% formattedfield form.is_superuser %}</li>
- <li>{% formattedfield form.groups %}</li>
- <li><button class="button">{% trans "Add user" %}</button></li>
- </ul>
- </section>
- </div>
- </form>
+ <li>
+ <a href="#tab-roles" data-tab-trigger class="button w-flex w-items-center w-w-fit w-mb-8">
+ {% trans "Roles" %}
+ {% icon name="arrow-right" classname="default" %}
+ </a>
+ </li>
+ </ul>
+ </section>
+ <section
+ id="tab-roles"
+ class="w-tabs__panel"
+ role="tabpanel"
+ hidden
+ aria-labelledby="tab-label-roles"
+ >
+ <ul class="fields">
+ <li>{% formattedfield form.is_superuser %}</li>
+ <li>{% formattedfield form.groups %}</li>
+ </ul>
+ </section>
+ </div>
</div>
{% endblock %}
diff --git a/wagtail/users/templates/wagtailusers/users/edit.html b/wagtail/users/templates/wagtailusers/users/edit.html
index 61284dcf82..8626a3cf54 100644
--- a/wagtail/users/templates/wagtailusers/users/edit.html
+++ b/wagtail/users/templates/wagtailusers/users/edit.html
@@ -1,8 +1,8 @@
-{% extends "wagtailadmin/generic/form.html" %}
+{% extends "wagtailadmin/generic/edit.html" %}
{% load wagtailimages_tags wagtailadmin_tags %}
{% load i18n %}
-{% block main_content %}
+{% block form_content %}
<div class="w-tabs" data-tabs>
<div class="w-tabs__wrapper">
<div role="tablist" class="w-tabs__list">
@@ -13,67 +13,50 @@
</div>
</div>
- <form action="{% url 'wagtailusers_users:edit' user.pk %}" method="POST" novalidate{% if form.is_multipart %} enctype="multipart/form-data"{% endif %}>
- <div class="tab-content">
- {% csrf_token %}
-
- <section
- id="tab-account"
- class="w-tabs__panel"
- role="tabpanel"
- hidden
- aria-labelledby="tab-label-account"
- >
- <ul class="fields">
- {% block fields %}
- {% if form.separate_username_field %}
- <li>{% formattedfield form.username_field %}</li>
- {% endif %}
- <li>{% formattedfield form.email %}</li>
- <li>{% formattedfield form.first_name %}</li>
- <li>{% formattedfield form.last_name %}</li>
- {% block extra_fields %}{% endblock extra_fields %}
- {% if form.password1 %}
- <li>{% formattedfield form.password1 %}</li>
- {% endif %}
- {% if form.password2 %}
- <li>{% formattedfield form.password2 %}</li>
- {% endif %}
- {% if form.is_active %}
- <li>{% formattedfield form.is_active %}</li>
- {% endif %}
-
- {% endblock fields %}
- <li>
- <input type="submit" value="{% trans 'Save' %}" class="button"/>
- {% if can_delete %}
- <a href="{% url 'wagtailusers_users:delete' user.pk %}" class="button no">{% trans "Delete user" %}</a>
- {% endif %}
- </li>
- </ul>
- </section>
- <section
- id="tab-roles"
- class="w-tabs__panel"
- role="tabpanel"
- hidden
- aria-labelledby="tab-label-roles"
- >
- <ul class="fields">
- {% if form.is_superuser %}
- <li>{% formattedfield form.is_superuser %}</li>
+ <div class="tab-content">
+ <section
+ id="tab-account"
+ class="w-tabs__panel"
+ role="tabpanel"
+ hidden
+ aria-labelledby="tab-label-account"
+ >
+ <ul class="fields">
+ {% block fields %}
+ {% if form.separate_username_field %}
+ <li>{% formattedfield form.username_field %}</li>
+ {% endif %}
+ <li>{% formattedfield form.email %}</li>
+ <li>{% formattedfield form.first_name %}</li>
+ <li>{% formattedfield form.last_name %}</li>
+ {% block extra_fields %}{% endblock extra_fields %}
+ {% if form.password1 %}
+ <li>{% formattedfield form.password1 %}</li>
+ {% endif %}
+ {% if form.password2 %}
+ <li>{% formattedfield form.password2 %}</li>
+ {% endif %}
+ {% if form.is_active %}
+ <li>{% formattedfield form.is_active %}</li>
{% endif %}
- <li>{% formattedfield form.groups %}</li>
- <li>
- <input type="submit" value="{% trans 'Save' %}" class="button"/>
- {% if can_delete %}
- <a href="{% url 'wagtailusers_users:delete' user.pk %}" class="button no">{% trans "Delete user" %}</a>
- {% endif %}
- </li>
- </ul>
- </section>
- </div>
- </form>
+ {% endblock fields %}
+ </ul>
+ </section>
+ <section
+ id="tab-roles"
+ class="w-tabs__panel"
+ role="tabpanel"
+ hidden
+ aria-labelledby="tab-label-roles"
+ >
+ <ul class="fields">
+ {% if form.is_superuser %}
+ <li>{% formattedfield form.is_superuser %}</li>
+ {% endif %}
+ <li>{% formattedfield form.groups %}</li>
+ </ul>
+ </section>
+ </div>
</div>
{% endblock %}