From e797e11a5cdd0c46fee6908bde4c67a153d43373 Mon Sep 17 00:00:00 2001 From: Roland Geider Date: Thu, 14 Nov 2024 00:27:14 +0100 Subject: [PATCH] Start playing around with HTMX Hopefully this will allow us to one day remove all the logic around the handling of modal forms everywhere in the app --- package.json | 3 +- wger/core/templates/delete.html | 25 +++------- wger/core/templates/form.html | 31 ++---------- wger/core/templates/language/overview.html | 5 +- wger/core/templates/language/view.html | 18 +++---- wger/core/templates/license/list.html | 19 ++++--- wger/core/templates/misc/license/list.html | 50 ------------------- wger/core/templates/repetition_unit/list.html | 19 ++++--- wger/core/templates/tags/modal_link.html | 12 +++++ wger/core/templates/template.html | 2 +- wger/core/templates/user/delete_account.html | 16 +----- wger/core/templates/user/overview.html | 44 ++++++++++++---- wger/core/templates/user/preferences.html | 17 ++++--- wger/core/templates/weight_unit/list.html | 19 ++++--- wger/core/templatetags/wger_extras.py | 7 ++- yarn.lock | 15 ++++-- 16 files changed, 128 insertions(+), 174 deletions(-) delete mode 100644 wger/core/templates/misc/license/list.html create mode 100644 wger/core/templates/tags/modal_link.html diff --git a/package.json b/package.json index f4b23c39d..e7b5a1127 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ }, "homepage": "https://github.com/wger-project/wger", "dependencies": { + "htmx.org": "^2.0.3", "Sortable": "RubaXa/Sortable#1.15.3", "bootstrap": "5.3.3", "components-font-awesome": "5.9.0", @@ -18,7 +19,7 @@ "devbridge-autocomplete": "^1.4.11", "jquery": "^3.7.1", "masonry-layout": "^4.2.2", - "popper.js": "^1.16.1", + "@popperjs/core": "^2.11.8", "yarn": "^1.22.22" }, "scripts": { diff --git a/wger/core/templates/delete.html b/wger/core/templates/delete.html index dca8d784b..d2a4b9e21 100644 --- a/wger/core/templates/delete.html +++ b/wger/core/templates/delete.html @@ -1,23 +1,10 @@ -{% extends extend_template %} {% load i18n crispy_forms_tags %} - -{% block title %}{{title}}{% endblock %} +

{{ title }}

+

{% translate "Are you sure you want to delete this? This action cannot be undone." %}

+{% if delete_message %} +

{{ delete_message }}

+{% endif %} +{% crispy form %} - -{% block content %} -
-

{% translate "Are you sure you want to delete this? This action cannot be undone." %}

- {% if delete_message %} -

{{ delete_message }}

- {% endif %} - {% crispy form %} -
- -{% endblock %} - diff --git a/wger/core/templates/form.html b/wger/core/templates/form.html index 14a0ad784..7990ecdc3 100644 --- a/wger/core/templates/form.html +++ b/wger/core/templates/form.html @@ -1,29 +1,4 @@ -{% extends extend_template %} -{% load i18n static crispy_forms_tags %} +{% load crispy_forms_tags %} -{% block header %} - {{ form.media }} - {% if custom_js %} - - {% endif %} -{% endblock %} - -{% block title %}{{title}}{% endblock %} - -{% block content %} - {% if form %} - {% crispy form %} - {% else %} - Looks like you clicked on an invalid link. Please try again. - {% endif %} -{% endblock %} - - - -{% block sidebar %}{% if sidebar %}{% include sidebar %}{% endif %}{% endblock %} +

{{ title }}

+{% crispy form %} diff --git a/wger/core/templates/language/overview.html b/wger/core/templates/language/overview.html index 8ba52b0d2..82c9ca5b0 100644 --- a/wger/core/templates/language/overview.html +++ b/wger/core/templates/language/overview.html @@ -31,7 +31,6 @@ {# Options #} {# #} {% block options %} - - {% translate "Add" %} - + {% translate 'Add' as text %} + {% modal_link url="core:language:add" text=text %} {% endblock %} diff --git a/wger/core/templates/language/view.html b/wger/core/templates/language/view.html index 1c3a6af60..06b3aa7b8 100644 --- a/wger/core/templates/language/view.html +++ b/wger/core/templates/language/view.html @@ -61,17 +61,15 @@ {% translate "Options" %}
- - - {% translate "Edit" %} - + {% translate 'Edit' as text %} + {% url 'core:language:edit' view_language.id as url %} + {% modal_link url=url text=text css_class="dropdown-item" %} + - - - {% translate "Delete" %} - + + {% translate 'Delete' as text %} + {% url 'core:language:delete' view_language.id as url %} + {% modal_link url=url text=text css_class="dropdown-item" %}
diff --git a/wger/core/templates/license/list.html b/wger/core/templates/license/list.html index 1cc0c8847..a7438821a 100644 --- a/wger/core/templates/license/list.html +++ b/wger/core/templates/license/list.html @@ -9,14 +9,18 @@ {% for license in license_list %}
  • -
    {{ license }} @@ -36,8 +40,7 @@ {# #} {% block options %} {% if perms.core.add_license %} - - {% translate "Add" %} - + {% translate 'Add' as text %} + {% modal_link url='core:license:add' text=text %} {% endif %} {% endblock %} diff --git a/wger/core/templates/misc/license/list.html b/wger/core/templates/misc/license/list.html deleted file mode 100644 index 0840c99ee..000000000 --- a/wger/core/templates/misc/license/list.html +++ /dev/null @@ -1,50 +0,0 @@ -% extends "base.html" %} -{% load i18n static wger_extras %} - -{% block title %}{% translate "License list" %}{% endblock %} - - -{% block content %} - -{% endblock %} - - - - -{% block sidebar %} - {% if perms.core.add_license %} -

    - - {% translate "Add" %} - -

    - -

    {% blocktranslate %}If a license has been localized, e.g. the Creative Commons - licenses for the different countries, add them as separate entries here.{% endblocktranslate %}

    - {% endif %} -{% endblock %} diff --git a/wger/core/templates/repetition_unit/list.html b/wger/core/templates/repetition_unit/list.html index 484ceb1df..a4f32e1c7 100644 --- a/wger/core/templates/repetition_unit/list.html +++ b/wger/core/templates/repetition_unit/list.html @@ -10,14 +10,18 @@
  • {% if unit.id != 1 and unit.id != 2 %}
    -
    {% endif %} @@ -39,8 +43,7 @@ {# #} {% block options %} {% if perms.core.add_license %} - - {% translate "Add" %} - + {% translate 'Add' as text %} + {% modal_link url='core:repetition-unit:add' text=text %} {% endif %} {% endblock %} diff --git a/wger/core/templates/tags/modal_link.html b/wger/core/templates/tags/modal_link.html new file mode 100644 index 000000000..529dd6e44 --- /dev/null +++ b/wger/core/templates/tags/modal_link.html @@ -0,0 +1,12 @@ +{% load static i18n %} + + + {{ text }} + diff --git a/wger/core/templates/template.html b/wger/core/templates/template.html index 03d890add..1bca5d834 100644 --- a/wger/core/templates/template.html +++ b/wger/core/templates/template.html @@ -69,6 +69,7 @@ + @@ -116,7 +117,6 @@
    -
    diff --git a/wger/core/templates/user/delete_account.html b/wger/core/templates/user/delete_account.html index af6a5ebd7..3998d7566 100644 --- a/wger/core/templates/user/delete_account.html +++ b/wger/core/templates/user/delete_account.html @@ -1,15 +1,7 @@ -{% extends "base.html" %} {% load i18n static wger_extras crispy_forms_tags %} -{% block title %}{% translate "Delete account" %}{% endblock %} +

    {% translate "Delete account" %}

    - -{% block header %} -{% endblock %} - -{% block content %} - -

    @@ -26,9 +18,3 @@ and can't be undone. {% endblocktranslate %}{% endwith %}

    {% crispy form %} -
    -{% endblock %} - - -{% block sidebar %} -{% endblock %} diff --git a/wger/core/templates/user/overview.html b/wger/core/templates/user/overview.html index b21b7099c..8d5e80c20 100644 --- a/wger/core/templates/user/overview.html +++ b/wger/core/templates/user/overview.html @@ -201,20 +201,38 @@ {% translate "Actions" %}
    @@ -362,7 +380,10 @@
    @@ -442,7 +463,10 @@ {% translate "Actions" %}
    {% endif %} diff --git a/wger/core/templates/user/preferences.html b/wger/core/templates/user/preferences.html index 826302c19..fea172542 100644 --- a/wger/core/templates/user/preferences.html +++ b/wger/core/templates/user/preferences.html @@ -27,7 +27,9 @@

    {% endif %}

    - {% translate "You need to verify your email to contribute exercises" %} + + {% translate "You need to verify your email to contribute exercises" %} +

    {% endblock %} @@ -39,8 +41,11 @@ {% block options %}
    - @@ -54,10 +59,8 @@ {% translate "API key" %} - - - {% translate "Delete account" %} - + {% translate 'Delete account' as text %} + {% modal_link url='core:user:delete' text=text css_class='dropdown-item' %}
    diff --git a/wger/core/templates/weight_unit/list.html b/wger/core/templates/weight_unit/list.html index 55347a618..a1486ee6b 100644 --- a/wger/core/templates/weight_unit/list.html +++ b/wger/core/templates/weight_unit/list.html @@ -10,14 +10,18 @@
  • {% if unit.id != 1 and unit.id != 2 %}
    -
    {% endif %} @@ -39,8 +43,7 @@ {# #} {% block options %} {% if perms.core.add_license %} - - {% translate "Add" %} - + {% translate 'Add' as text %} + {% modal_link url='core:weight-unit:add' text=text %} {% endif %} {% endblock %} diff --git a/wger/core/templatetags/wger_extras.py b/wger/core/templatetags/wger_extras.py index 1711294c9..e1fc622a2 100644 --- a/wger/core/templatetags/wger_extras.py +++ b/wger/core/templatetags/wger_extras.py @@ -26,6 +26,7 @@ from django.utils.translation import ( pgettext, ) +from wger.core.tests.base_testcase import get_reverse # wger from wger.manager.models import Day from wger.utils.constants import ( @@ -34,7 +35,6 @@ from wger.utils.constants import ( ) from wger.utils.language import get_language_data - register = template.Library() @@ -177,6 +177,11 @@ def fa_class(class_name='', icon_type='fas', fixed_width=True): return mark_safe(css) +@register.inclusion_tag('tags/modal_link.html') +def modal_link(url: str, text: str, css_class='btn btn-success btn-sm'): + return {'url': get_reverse(url), 'text': text, 'css_class': css_class} + + @register.simple_tag def trans_weight_unit(unit, user=None): """ diff --git a/yarn.lock b/yarn.lock index 9a04a2bc0..986bcf417 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2,6 +2,11 @@ # yarn lockfile v1 +"@popperjs/core@^2.11.8": + version "2.11.8" + resolved "https://registry.yarnpkg.com/@popperjs/core/-/core-2.11.8.tgz#6b79032e760a0899cd4204710beede972a3a185f" + integrity sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A== + "@types/jquery@^2.0.32": version "2.0.54" resolved "https://registry.yarnpkg.com/@types/jquery/-/jquery-2.0.54.tgz#d7999245f77c3fab5d84e7d32b8a6c20bfd1f072" @@ -314,6 +319,11 @@ get-size@^2.0.2: resolved "https://registry.yarnpkg.com/get-size/-/get-size-2.0.3.tgz#54a1d0256b20ea7ac646516756202769941ad2ef" integrity sha512-lXNzT/h/dTjTxRbm9BXb+SGxxzkm97h/PCIKtlN/CBCxxmkkIVV21udumMS93MuVTDX583gqc94v3RjuHmI+2Q== +htmx.org@^2.0.3: + version "2.0.3" + resolved "https://registry.yarnpkg.com/htmx.org/-/htmx.org-2.0.3.tgz#83f76a53d3fc562fe839f0f57ee7cd5f75fe7b59" + integrity sha512-AeoJUAjkCVVajbfKX+3sVQBTCt8Ct4lif1T+z/tptTXo8+8yyq3QIMQQe/IT+R8ssfrO1I0DeX4CAronzCL6oA== + iconv-lite@0.6: version "0.6.3" resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.6.3.tgz#a52f80bf38da1952eb5c681790719871a1a72501" @@ -348,11 +358,6 @@ outlayer@^2.1.0: fizzy-ui-utils "^2.0.0" get-size "^2.0.2" -popper.js@^1.16.1: - version "1.16.1" - resolved "https://registry.yarnpkg.com/popper.js/-/popper.js-1.16.1.tgz#2a223cb3dc7b6213d740e40372be40de43e65b1b" - integrity sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ== - robust-predicates@^3.0.0: version "3.0.1" resolved "https://registry.yarnpkg.com/robust-predicates/-/robust-predicates-3.0.1.tgz#ecde075044f7f30118682bd9fb3f123109577f9a"