From 603f28a04526c08173e9238e175e011da53617ea Mon Sep 17 00:00:00 2001 From: Paul Derscheid Date: Wed, 15 Oct 2025 10:50:34 +0200 Subject: [PATCH] Bug 40896: (follow-up) Use icon wrapper elements and visibility toggling - Wrap icons in semantic container elements for visibility toggling - Create throttled-button.inc with Template Toolkit BLOCKs to reduce duplication - Extract throttle logic to throttledButton.js with event delegation - Make timeout configurable via data-throttle-timeout attribute - Replace string-based modal generation with template element to support SSR To test: 1) Follow the test plan from the previous commit 2) Additionally verify the throttled button behavior works in all locations: - Reports list table: "Run" button for each saved report - Report toolbar: "Run report" button (when viewing/editing a report) - Parameters form: "Run the report" button - Edit SQL form: "Update and run SQL" button - Preview SQL modal: "Run report" button (click "Preview SQL" in dropdown) 3) For each location, confirm: - Button shows play icon initially - Upon click, button becomes disabled with spinner icon - Button has aria-busy="true" when disabled - After navigation/submission, button state is handled correctly 4) Test the modal button specifically: - Open Preview SQL modal from any report dropdown - Click "Run report" in the modal - Verify throttle behavior works for this dynamically created button 5) Verify that the set timeout works well, I thought 120 seconds is too long if you go back via bfcache (back button in the browser). You'd have to either reload or wait 2 minutes for the button to become interactive again. 6) Sign off --- .../prog/en/includes/reports-toolbar.inc | 4 +- .../prog/en/includes/throttled-button.inc | 23 +++ .../modules/reports/guided_reports_start.tt | 133 ++++++++---------- .../intranet-tmpl/prog/js/throttledButton.js | 71 ++++++++++ 4 files changed, 156 insertions(+), 75 deletions(-) create mode 100644 koha-tmpl/intranet-tmpl/prog/en/includes/throttled-button.inc create mode 100644 koha-tmpl/intranet-tmpl/prog/js/throttledButton.js diff --git a/koha-tmpl/intranet-tmpl/prog/en/includes/reports-toolbar.inc b/koha-tmpl/intranet-tmpl/prog/en/includes/reports-toolbar.inc index 37f73fcee21..2afc8e3b3f7 100644 --- a/koha-tmpl/intranet-tmpl/prog/en/includes/reports-toolbar.inc +++ b/koha-tmpl/intranet-tmpl/prog/en/includes/reports-toolbar.inc @@ -64,9 +64,7 @@ [% IF ( showsql || execute || editsql || save_successful ) %] [% UNLESS ( errors ) # Unless there are errors saving a report %] -
- Run report -
+
[% INCLUDE 'throttled-button.inc' element_type='link' id='runreport' href='/cgi-bin/koha/reports/guided_reports.pl?id=' _ id _ '&op=run' classes='btn btn-default' label=t('Run report') %]
[% IF templates.count %]
diff --git a/koha-tmpl/intranet-tmpl/prog/en/includes/throttled-button.inc b/koha-tmpl/intranet-tmpl/prog/en/includes/throttled-button.inc new file mode 100644 index 00000000000..f48e5aa8c6a --- /dev/null +++ b/koha-tmpl/intranet-tmpl/prog/en/includes/throttled-button.inc @@ -0,0 +1,23 @@ +[%# USAGE [ INCLUDE 'throttled-button.inc' element_type='button' classes='btn btn-primary' label=t('Run report') attrs={ name => 'op', value => 'cud-run' } ] %] + +[% DEFAULT element_type = 'link' %] +[% DEFAULT ready_icon = 'fa fa-play' %] +[% DEFAULT active_icon = 'fa fa-spinner fa-spin' %] +[% DEFAULT classes = 'btn btn-default' %] +[% DEFAULT href = '#' %] + +[%# Common attributes shared by both button and link %] +[% BLOCK common_attrs %]class="[% classes | html %]"[% IF id %]id="[% id | html %]"[% END %] data-state="ready" data-throttled-button [% IF attrs %][% FOREACH key IN attrs.keys %][% key | html %]="[% attrs.$key | html %]"[% END %][% END %][% END %] + +[%# Inner content shared by both button and link %] +[% BLOCK inner_content %] + + + [% UNLESS icon_only %][% label | html %][% END %] +[% END %] + +[% IF element_type == 'button' -%] + +[%- ELSE -%] + [% PROCESS inner_content %] +[%- END %] diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/reports/guided_reports_start.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/reports/guided_reports_start.tt index 7872a7652c5..3eb4bf3c361 100644 --- a/koha-tmpl/intranet-tmpl/prog/en/modules/reports/guided_reports_start.tt +++ b/koha-tmpl/intranet-tmpl/prog/en/modules/reports/guided_reports_start.tt @@ -379,8 +379,13 @@
[%# There should be no space between these two buttons, it would render badly %] - Run + [% INCLUDE 'throttled-button.inc' element_type='link' href='/cgi-bin/koha/reports/guided_reports.pl?id=' _ savedreport.id _ '&op=run' classes='btn btn-default btn-xs' label=t('Run') attrs={ role => 'button' } %]