Enable tooltip for stats dashboards

- import popper
- use data-bs-toggle instead of data-toggle
- enable tooltips as described here https://getbootstrap.com/docs/5.2/components/tooltips/#enable-tooltips

incidents/static/custom_js/stats.js

@@ -166,11 +166,15 @@ function generate_stacked_chart(selector, url, width, height, label, legend) {
 	      .attr("y", function(d) { return y(d.y1); })
 	      .attr("height", function(d) { return y(d.y0) - y(d.y1); })
 	      .attr('title', function(d) { return d.y1-d.y0})
-	      .attr('data-toggle', 'tooltip')
+	      .attr('data-bs-toggle', 'tooltip')
 	      .style("fill", function(d) {
 	      	return color(d.name)
 	      });
 
+	  // enable tooltips
+	  const tooltipTriggerList = document.querySelectorAll('[data-bs-toggle="tooltip"]')
+	  const tooltipList = [...tooltipTriggerList].map(tooltipTriggerEl => new bootstrap.Tooltip(tooltipTriggerEl))
+
 
 	  var legend = svg.selectAll(".legend")
 	      .data(color.domain().slice().reverse())

incidents/templates/stats/quarterly.html

@@ -40,6 +40,7 @@ <h1>{% blocktrans with bl_name=bl.name %}Incidents quarterly statistics for <br
 
 <script src="{% static "js/d3.v3.min.js" %}"></script>
 <script src="{% static "custom_js/stats.js" %}"></script>
+<script src="{% static "js/popper.min.js" %}"></script>
 
 {%endblock%}
 

incidents/templates/stats/sandbox.html

@@ -10,6 +10,7 @@ <h1>{%  trans "Sandbox" %}</h1>
 {% block custom_js_top %}
 <script src="{% static "js/d3.v3.min.js" %}"></script>
 <script src="{% static "custom_js/stats.js" %}"></script>
+<script src="{% static "js/popper.min.js" %}"></script>
 {% endblock%}
 
 {% block custom_js %}

incidents/templates/stats/yearly.html

@@ -10,6 +10,7 @@ <h1>{%  trans "Yearly stats" %}</h1>
 {% block custom_js_top %}
 <script src="{% static "js/d3.v3.min.js" %}"></script>
 <script src="{% static "custom_js/stats.js" %}"></script>
+<script src="{% static "js/popper.min.js" %}"></script>
 
 {%endblock%}
 

incidents/templates/stats/yearly_compare.html

@@ -10,6 +10,7 @@ <h1>{% blocktrans with current_year=year previous_year=year|add:-1 %}Comparison
 {% block custom_js_top %}
 <script src="{% static "js/d3.v3.min.js" %}"></script>
 <script src="{% static "custom_js/stats.js" %}"></script>
+<script src="{% static "js/popper.min.js" %}"></script>
 
 {%endblock%}