Add a nice animation on successful refilling

counter/static/bundled/counter/counter-click-index.ts

@@ -44,6 +44,11 @@ exportToHtml("loadCounter", (config: CounterConfig) => {
         ).data.amount;
       },
 
+      async onRefillingSuccess() {
+        await this.updateBalance();
+        document.getElementById("selling-accordion").click();
+      },
+
       async handleCode(event: SubmitEvent) {
         const code = (
           $(event.target).find("#code_field").val() as string

counter/templates/counter/counter_click.jinja

@@ -32,7 +32,7 @@
     </div>
 
     <div id="click_form">
-      <h5>{% trans %}Selling{% endtrans %}</h5>
+      <h5 id="selling-accordion">{% trans %}Selling{% endtrans %}</h5>
       <div>
         {% set counter_click_url = url('counter:click', counter_id=counter.id, user_id=customer.user_id) %}
 
@@ -103,7 +103,7 @@
       {% if refilling_fragment %}
         <h5>{% trans %}Refilling{% endtrans %}</h5>
         <div
-          @htmx:after-request="updateBalance()"
+          @htmx:after-request="onRefillingSuccess()"
         >
           {{ refilling_fragment }}
         </div>