From 52d1de43bd10f19e847747f05069f877ac8f5c47 Mon Sep 17 00:00:00 2001
From: Valentin Deniaud <vdeniaud@entrouvert.com>
Date: Wed, 27 Apr 2022 18:03:08 +0200
Subject: [PATCH] dataviz: reload chart filters cell to reflect subfilters
 (#62533)

---
 combo/apps/dataviz/forms.py                   |  6 ++++
 combo/apps/dataviz/models.py                  | 13 +++++++-
 .../templates/combo/chart-filters.html        | 17 ++++++++++
 .../dataviz/templates/combo/chartngcell.html  | 16 +++++-----
 combo/apps/dataviz/views.py                   | 21 +++++++++++-
 combo/public/static/js/combo.public.js        |  7 +++-
 tests/test_dataviz.py                         | 32 +++++++++++++++++++
 7 files changed, 101 insertions(+), 11 deletions(-)

diff --git a/combo/apps/dataviz/forms.py b/combo/apps/dataviz/forms.py
index 768f9316..cccc9f65 100644
--- a/combo/apps/dataviz/forms.py
+++ b/combo/apps/dataviz/forms.py
@@ -19,6 +19,7 @@ from collections import OrderedDict
 
 from django import forms
 from django.conf import settings
+from django.core.cache import cache
 from django.db import transaction
 from django.db.models import Q
 from django.db.models.fields import BLANK_CHOICE_DASH
@@ -275,6 +276,7 @@ class ChartFiltersForm(ChartFiltersMixin, forms.ModelForm):
 
     def __init__(self, *args, **kwargs):
         page = kwargs.pop('page')
+        filters_cell_id = kwargs.pop('filters_cell_id', None)
         super().__init__(*args, **kwargs)
 
         chart_cells = list(ChartNgCell.objects.filter(page=page, statistic__isnull=False).order_by('order'))
@@ -282,6 +284,10 @@ class ChartFiltersForm(ChartFiltersMixin, forms.ModelForm):
             self.fields.clear()
             return
 
+        if filters_cell_id:
+            for cell in chart_cells:
+                cell.subfilters = cache.get(cell.get_cache_key(filters_cell_id), cell.subfilters)
+
         first_cell = chart_cells[0]
         for field in self._meta.fields:
             self.fields[field].initial = getattr(first_cell, field)
diff --git a/combo/apps/dataviz/models.py b/combo/apps/dataviz/models.py
index df295b6e..108281f8 100644
--- a/combo/apps/dataviz/models.py
+++ b/combo/apps/dataviz/models.py
@@ -727,6 +727,9 @@ class ChartNgCell(CellBase):
             self.filter_params = {k: v for k, v in self.filter_params.items() if k in subfilter_ids}
             self.save()
 
+    def get_cache_key(self, filters_cell_id):
+        return 'dataviz:%s:%s' % (filters_cell_id, self.pk)
+
 
 @register_cell_class
 class ChartFiltersCell(CellBase):
@@ -745,5 +748,13 @@ class ChartFiltersCell(CellBase):
         from .forms import ChartFiltersForm
 
         ctx = super().get_cell_extra_context(context)
-        ctx['form'] = ChartFiltersForm(page=self.page)
+        if 'filters_cell_id' in context['request'].GET:  # detect refresh on submit
+            ctx['form'] = ChartFiltersForm(
+                data=context['request'].GET,
+                page=self.page,
+                filters_cell_id=context['request'].GET['filters_cell_id'],
+            )
+        else:
+            ctx['form'] = ChartFiltersForm(page=self.page)
+
         return ctx
diff --git a/combo/apps/dataviz/templates/combo/chart-filters.html b/combo/apps/dataviz/templates/combo/chart-filters.html
index 496dbb1b..3d47d893 100644
--- a/combo/apps/dataviz/templates/combo/chart-filters.html
+++ b/combo/apps/dataviz/templates/combo/chart-filters.html
@@ -23,6 +23,20 @@
 
 <script>
   $(function () {
+    if (!$('body').data('filters-cell-id')) {
+      $('body').data('filters-cell-id', Math.random().toString(36).slice(2, 7));
+
+      var loaded_cell_count = 0;
+      document.querySelectorAll('div.chartngcell embed').forEach(graph => {
+        graph.addEventListener('load', function() {
+            if (++loaded_cell_count == $('div.chartngcell embed').length) {
+              combo_load_cell($('.chart-filters-cell'));
+              loaded_cell_count = 0;
+          }
+        });
+      });
+    }
+
     start_field = $('#id_time_range_start');
     end_field = $('#id_time_range_end');
     $('#id_time_range').change(function() {
@@ -37,6 +51,9 @@
     $('#chart-filters').submit(function(e) {
       e.preventDefault();
       $(window).trigger('combo:refresh-graphs');
+      chart_cell = $(this).parents('.cell');
+      new_url = chart_cell.data('ajax-cell-url') + '?filters_cell_id=' + $('body').data('filters-cell-id') + '&' + $(this).serialize();
+      chart_cell.data('ajax-cell-url', new_url);
     });
   });
 </script>
diff --git a/combo/apps/dataviz/templates/combo/chartngcell.html b/combo/apps/dataviz/templates/combo/chartngcell.html
index 489ad98c..e725dcc1 100644
--- a/combo/apps/dataviz/templates/combo/chartngcell.html
+++ b/combo/apps/dataviz/templates/combo/chartngcell.html
@@ -5,11 +5,12 @@
 <script>
 $(function() {
   var extra_context = $('#chart-{{cell.id}}').parents('.cell').data('extra-context');
-  var chart_filters_form = $('#chart-filters');
   $(window).on('combo:refresh-graphs', function() {
     qs = [];
-    if(chart_filters_form)
-        qs.push(chart_filters_form.serialize());
+    if($('#chart-filters')) {
+      qs.push($('#chart-filters').serialize());
+      qs.push('filters_cell_id=' + $('body').data('filters-cell-id'));
+    }
     if(extra_context)
         qs.push('ctx=' + extra_context);
     $.ajax({
@@ -30,14 +31,13 @@ $(function() {
 $(function() {
   var last_width = 1;
   var extra_context = $('#chart-{{cell.id}}').parents('.cell').data('extra-context');
-  var chart_filters_form = $('#chart-filters');
   $(window).on('load resize gadjo:sidepage-toggled combo:resize-graphs', function() {
     var chart_cell = $('#chart-{{cell.id}}').parent();
     var new_width = Math.floor($(chart_cell).width());
     var ratio = new_width / last_width;
     var qs = '?width=' + new_width
-    if(chart_filters_form)
-        qs += '&' + chart_filters_form.serialize()
+    if($('#chart-filters'))
+        qs += '&' + $('#chart-filters').serialize() + '&filters_cell_id=' + $('body').data('filters-cell-id')
     if(extra_context)
         qs += '&ctx=' + extra_context
     if (ratio > 1.2 || ratio < 0.8) {
@@ -47,8 +47,8 @@ $(function() {
   }).trigger('combo:resize-graphs');
   $(window).on('combo:refresh-graphs', function() {
     var qs = '?width=' + last_width
-    if(chart_filters_form)
-        qs += '&' + chart_filters_form.serialize()
+    if($('#chart-filters'))
+        qs += '&' + $('#chart-filters').serialize() + '&filters_cell_id=' + $('body').data('filters-cell-id')
     if(extra_context)
         qs += '&ctx=' + extra_context
     $('#chart-{{cell.id}}').attr('src', "{% url 'combo-dataviz-graph' cell=cell.id %}" + qs);
diff --git a/combo/apps/dataviz/views.py b/combo/apps/dataviz/views.py
index 6bdfc2af..0c6d0021 100644
--- a/combo/apps/dataviz/views.py
+++ b/combo/apps/dataviz/views.py
@@ -15,6 +15,7 @@
 # along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
 from django.core import signing
+from django.core.cache import cache
 from django.core.exceptions import PermissionDenied
 from django.http import Http404, HttpResponse, HttpResponseBadRequest
 from django.shortcuts import render
@@ -24,7 +25,7 @@ from django.views.decorators.clickjacking import xframe_options_sameorigin
 from django.views.generic import DetailView
 from requests.exceptions import HTTPError
 
-from combo.utils import get_templated_url, requests
+from combo.utils import NothingInCacheException, get_templated_url, requests
 
 from .forms import ChartNgPartialForm
 from .models import ChartNgCell, Gauge, MissingVariable, UnsupportedDataSet
@@ -42,6 +43,7 @@ class DatavizGraphView(DetailView):
 
     def dispatch(self, request, *args, **kwargs):
         self.cell = self.get_object()
+        self.filters_cell_id = request.GET.get('filters_cell_id')
 
         if not self.cell.page.is_visible(request.user):
             raise PermissionDenied()
@@ -50,6 +52,10 @@ class DatavizGraphView(DetailView):
         if not self.cell.statistic or not self.cell.statistic.url:
             raise Http404('misconfigured cell')
 
+        if self.filters_cell_id:
+            self.cell.subfilters = cache.get(
+                self.cell.get_cache_key(self.filters_cell_id), self.cell.subfilters
+            )
         return super().dispatch(request, *args, **kwargs)
 
     def get(self, request, *args, **kwargs):
@@ -84,6 +90,9 @@ class DatavizGraphView(DetailView):
             else:
                 return self.error(_('Unknown HTTP error: %s' % e))
 
+        if self.filters_cell_id:
+            self.update_subfilters_cache(form.instance)
+
         if self.cell.chart_type == 'table':
             if not chart.raw_series:
                 return self.error(_('No data'))
@@ -107,5 +116,15 @@ class DatavizGraphView(DetailView):
         }
         return render(self.request, 'combo/dataviz-error.svg', context=context, content_type='image/svg+xml')
 
+    def update_subfilters_cache(self, cell):
+        try:
+            data = cell.get_statistic_data(raise_if_not_cached=True)
+        except NothingInCacheException:
+            pass  # should not happen
+        else:
+            cache.set(
+                cell.get_cache_key(self.filters_cell_id), data.json()['data'].get('subfilters', []), 300
+            )
+
 
 dataviz_graph = xframe_options_sameorigin(DatavizGraphView.as_view())
diff --git a/combo/public/static/js/combo.public.js b/combo/public/static/js/combo.public.js
index eb3ec073..25500b43 100644
--- a/combo/public/static/js/combo.public.js
+++ b/combo/public/static/js/combo.public.js
@@ -4,7 +4,12 @@ function combo_load_cell(elem) {
   var extra_context = $elem.data('extra-context');
   $.support.cors = true; /* IE9 */
   var qs;
-  if (window.location.search) {
+  if (url.includes('?')) {
+    qs = '&';
+    if (window.location.search) {
+      qs += window.location.search.slice(1) + '&';
+    }
+  } else if (window.location.search) {
     qs = window.location.search + '&';
   } else {
     qs = '?';
diff --git a/tests/test_dataviz.py b/tests/test_dataviz.py
index 435092ce..4d778079 100644
--- a/tests/test_dataviz.py
+++ b/tests/test_dataviz.py
@@ -2566,3 +2566,35 @@ def test_spooler_refresh_statistics_data_bijoe(statistics):
 
     refresh_statistics_data(cell.pk)
     assert len(bijoe_mock.call['requests']) == 1
+
+
+@with_httmock(new_api_mock)
+def test_chart_filters_cell_dynamic_subfilters(new_api_statistics, app, admin_user):
+    page = Page.objects.create(title='One', slug='index')
+    ChartFiltersCell.objects.create(page=page, order=1, placeholder='content')
+    cell = ChartNgCell.objects.create(page=page, order=2, placeholder='content')
+    cell.statistic = Statistic.objects.get(slug='with-subfilter')
+    cell.save()
+
+    app = login(app)
+    resp = app.get('/')
+    assert 'form' in resp.form.fields
+    assert 'menu' not in resp.form.fields
+
+    # ensure choice exist
+    resp.form['form'] = 'food-request'
+
+    # simulate chart cell ajax refresh on form submission
+    app.get('/api/dataviz/graph/%s/' % cell.pk + '?form=food-request&filters_cell_id=xxx')
+
+    # simulate filters cell ajax refresh after cell refresh
+    location = resp.pyquery('.chartfilterscell').attr('data-ajax-cell-url')
+    resp = app.get(location + '?form=food-request&filters_cell_id=xxx')
+    assert resp.form['form'].value == 'food-request'
+    assert 'menu' in resp.form.fields
+
+    # check isolation between pages by modifying filters_cell_id
+    app.get('/api/dataviz/graph/%s/' % cell.pk + '?form=contact&filters_cell_id=yyy')
+    resp = app.get(location + '?form=food-request&filters_cell_id=xxx')
+    assert 'form' in resp.form.fields
+    assert 'menu' in resp.form.fields
-- 
2.30.2