From f2cfa2603fc64e96db671f75f7ff6cbe519073e7 Mon Sep 17 00:00:00 2001
From: MaximeLecardonnel6x7 <mlecardo@hotmail.fr>
Date: Thu, 13 Feb 2025 14:41:52 +0100
Subject: [PATCH] Update template explainability.

---
 shapash/report/html/explainability.html | 85 +++++++++++++++----------
 1 file changed, 51 insertions(+), 34 deletions(-)

diff --git a/shapash/report/html/explainability.html b/shapash/report/html/explainability.html
index 51a70292..a490a45e 100644
--- a/shapash/report/html/explainability.html
+++ b/shapash/report/html/explainability.html
@@ -1,48 +1,65 @@
 {% if labels|length > 1 %}
-    {% with menuId='dropdownMenuLabel', menuText='Response', values=labels, menuDivVisible='explain-all' %}
-        {% include "dropdown.html" %}
-    {% endwith %}
+{% with menuId='dropdownMenuLabel', menuText='Response', values=labels, menuDivVisible='explain-all' %}
+{% include "dropdown.html" %}
+{% endwith %}
 {% else %}
 {% endif %}
 <h3 data-toc-skip>Global feature importance plot</h3>
 {% for label in labels %}
-    <div class="row" id="explain-all-div-{{ label['name'] }}" style="{% if label['index'] != 0 %}display:none;{% endif %} margin-right:5px; margin-left:5px; margin-top:5px;">
-        {{ label['feature_importance_plot'] }}
-    </div>
+<div class="row" id="explain-all-div-{{ label['name'] }}"
+    style="{% if label['index'] != 0 %}display:none;{% endif %} margin-right:5px; margin-left:5px; margin-top:5px;">
+    {{ label['feature_importance_plot'] }}
+</div>
 {% endfor %}
 <h3>Features contribution plots</h3>
 {% for label in labels %}
-    <div class="row" id="explain-all-div-{{ label['name'] }}-2" style="{% if label['index'] != 0 %}display:none;{% endif %} margin-right:5px; margin-left:5px; margin-top:5px;">
-        {% with menuId='dropdownMenu2', menuText='Feature', values=label['features'], menuDivVisible='explain-contrib-'~label['index'] %}
-            {% include "dropdown.html" %}
-        {% endwith %}
-        {% for col in label['features'] %}
-            <div class="row" id="explain-contrib-{{ label['index'] }}-div-{{ col['name'] }}" style="{% if col['feature_index'] != 0 %}display:none;{% endif %} margin-right:5px; margin-left:5px;">
-                <h4>{{ col['name'] }} - {{ col['type'] }}</h4>
-                {% if col['name'] != col['description'] %}
-                    <blockquote class="panel-content">{{ col['description'] }}</blockquote>
-                {% else %}
-                {% endif %}
-                {{ col['plot'] }}
-            </div>
-        {% endfor %}
+<div class="row" id="explain-all-div-{{ label['name'] }}-2"
+    style="{% if label['index'] != 0 %}display:none;{% endif %} margin-right:5px; margin-left:5px; margin-top:5px;">
+    {% with menuId='dropdownMenu2', menuText='Feature', values=label['features'],
+    menuDivVisible='explain-contrib-'~label['index'] %}
+    {% include "dropdown.html" %}
+    {% endwith %}
+    {% for col in label['features'] %}
+    <div class="row" id="explain-contrib-{{ label['index'] }}-div-{{ col['name'] }}"
+        style="{% if col['feature_index'] != 0 %}display:none;{% endif %} margin-right:5px; margin-left:5px;">
+        <h4>{{ col['name'] }} - {{ col['type'] }}</h4>
+        {% if col['name'] != col['description'] %}
+        <blockquote class="panel-content">{{ col['description'] }}</blockquote>
+        {% else %}
+        {% endif %}
+        {{ col['plot'] }}
     </div>
+    {% endfor %}
+</div>
 {% endfor %}
+{% set has_interaction = false %}
+{% for label in labels %}
+{% if label['features_interaction']|length > 0 %}
+{% set has_interaction = true %}
+{% endif %}
+{% endfor %}
+
+{% if has_interaction %}
 <h3>Features Top Interaction plots</h3>
 {% for label in labels %}
-    <div class="row" id="explain-all-div-interaction-{{ label['name'] }}-2" style="{% if label['index'] != 0 %}display:none;{% endif %} margin-right:5px; margin-left:5px; margin-top:5px;">
-        {% with menuId='dropdownMenu3', menuText='Interactions', values=label['features_interaction'], menuDivVisible='explain-contrib-interaction-'~label['index'] %}
-            {% include "dropdown.html" %}
-        {% endwith %}
-        {% for col in label['features_interaction'] %}
-            <div class="row" id="explain-contrib-interaction-{{ label['index'] }}-div-{{ col['name'] }}" style="{% if col['feature_index'] != 0 %}display:none;{% endif %} margin-right:5px; margin-left:5px;">
-                <h4>{{ col['name'] }} - {{ col['type'] }}</h4>
-                {% if col['name'] != col['description'] %}
-                    <blockquote class="panel-content">{{ col['description'] }}</blockquote>
-                {% else %}
-                {% endif %}
-                {{ col['plot'] }}
-            </div>
-        {% endfor %}
+{% if label['features_interaction']|length > 0 %}
+<div class="row" id="explain-all-div-interaction-{{ label['name'] }}-2"
+    style="{% if label['index'] != 0 %}display:none;{% endif %} margin-right:5px; margin-left:5px; margin-top:5px;">
+    {% with menuId='dropdownMenu3', menuText='Interactions', values=label['features_interaction'],
+    menuDivVisible='explain-contrib-interaction-'~label['index'] %}
+    {% include "dropdown.html" %}
+    {% endwith %}
+    {% for col in label['features_interaction'] %}
+    <div class="row" id="explain-contrib-interaction-{{ label['index'] }}-div-{{ col['name'] }}"
+        style="{% if col['feature_index'] != 0 %}display:none;{% endif %} margin-right:5px; margin-left:5px;">
+        <h4>{{ col['name'] }} - {{ col['type'] }}</h4>
+        {% if col['name'] != col['description'] %}
+        <blockquote class="panel-content">{{ col['description'] }}</blockquote>
+        {% endif %}
+        {{ col['plot'] }}
     </div>
+    {% endfor %}
+</div>
+{% endif %}
 {% endfor %}
+{% endif %}