feat(nimbus): Add basic feature tracking table to feature health page.

experimenter/experimenter/nimbus_ui/constants.py

@@ -147,6 +147,11 @@ class NimbusUIConstants:
         experiences, etc. associated with your selected feature.""",
     }
 
+    FEATURE_PAGE_TOOLTIPS = {
+        "feature_changes_tooltip": """This shows any changes made to the Nimbus feature
+        manifest such as code changes for the feature you have chosen."""
+    }
+
     class ReviewRequestMessages(Enum):
         END_EXPERIMENT = "end this experiment"
         END_ENROLLMENT = "end enrollment for this experiment"

experimenter/experimenter/nimbus_ui/templates/nimbus_experiments/features.html

@@ -331,6 +331,58 @@ <h5 class="fw-semibold">
             </div>
           </div>
         </div>
+        <hr>
+        <h5 class="fw-semibold">
+          <img src="{% static 'assets/qa-runs.svg' %}"
+            <img src="{% static 'assets/feature-changes.svg' %}"
+                 alt="Hugging Foxes"
+                 style="width: 60px;
+                        height: auto" />
+            Feature Changes
+            <i class="fa-regular fa-circle-question"
+               data-bs-toggle="tooltip"
+               data-bs-placement="top"
+               data-bs-title="{{ tooltips.feature_changes_tooltip }}"></i>
+            |
+            <span class="badge bg-secondary">Number of changes: {{ feature_changes.count|default:"0" }}</span>
+          </h5>
+          <div>
+            <div id="feature-changes-table">
+              <table class="table table-hover table-borderless align-middle mb-3">
+                <thead>
+                  <tr>
+                    <th scope="col" class="fw-semibold text-body">
+                      <span>Feature Version</span>
+                    </th>
+                    <th scope="col" class="fw-semibold text-body">
+                      <span>Date / Time</span>
+                    </th>
+                    <th scope="col" class="fw-semibold text-body">
+                      <span>Change Size</span>
+                    </th>
+                    <th scope="col" class="fw-semibold text-body">
+                      <span>Change Diff</span>
+                    </th>
+                  </tr>
+                </thead>
+                <tbody>
+                  {% for change in feature_changes %}
+                    <tr scope="row">
+                      <td id="feature-version">{{ change.change_version|format_not_set }}</td>
+                      <td id="feature-change-date">{{ change.change_date|date:"m/d/Y @ H:i"|format_not_set }}</td>
+                      <td id="feature-change-size">{{ change.change_size|format_not_set }}</td>
+                      <td id="feature-change-complexity">{{ change.softvision_complexity|format_not_set }}</td>
+                    </tr>
+                  {% empty %}
+                    <tr>
+                      <td colspan="11" class="text-center text-muted py-5">No Tracked Feature Changes</td>
+                    </tr>
+                  </tr>
+                {% endfor %}
+              </tbody>
+            </table>
+          </div>
+        </div>
       </div>
     </div>
   </div>

experimenter/experimenter/nimbus_ui/tests/test_views.py

@@ -3576,14 +3576,18 @@ def test_features_view_renders_table_with_correct_elements(
         )
 
         feature_id = self.feature_configs[feature_config].id
-        url = reverse("nimbus-ui-features")
         response = self.client.get(
-            f"{url}?application={application.value}&feature_configs={feature_id}"
+            reverse("nimbus-ui-features"),
+            {
+                "application": application.value,
+                "feature_configs": feature_id,
+            },
         )
 
         self.assertEqual(response.status_code, 200)
         self.assertContains(response, "deliveries-table")
         self.assertContains(response, "qa-info-table")
+        self.assertContains(response, "feature-changes-table")
         self.assertContains(response, experiment)
 
     def test_features_view_deliveries_table_can_sort_by_recipe_name(self):

experimenter/experimenter/nimbus_ui/views.py

@@ -764,6 +764,7 @@ def get_context_data(self, **kwargs):
         context = {
             "form": form,
             "links": NimbusUIConstants.FEATURE_PAGE_LINKS,
+            "tooltips": NimbusUIConstants.FEATURE_PAGE_TOOLTIPS,
             "application": self.request.GET.get("application"),
             "feature_configs": self.request.GET.get("feature_configs"),
             "paginator": deliveries_paginator,