From 1eb54f825255b96699dbf218b61ad54b574e20b7 Mon Sep 17 00:00:00 2001
From: Jonathan Bobel <jonathan.bobel@gsa.gov>
Date: Fri, 16 Aug 2024 11:27:48 -0400
Subject: [PATCH] Activity chart updates

---
 app/assets/javascripts/activityChart.js       | 33 +++++++++++++++++--
 .../sass/uswds/_data-visualization.scss       |  3 ++
 2 files changed, 34 insertions(+), 2 deletions(-)

diff --git a/app/assets/javascripts/activityChart.js b/app/assets/javascripts/activityChart.js
index d16d23827..da9c65e38 100644
--- a/app/assets/javascripts/activityChart.js
+++ b/app/assets/javascripts/activityChart.js
@@ -201,6 +201,8 @@
                 deliveredData = [];
                 failedData = [];
 
+                let totalMessages = 0;
+
                 for (var dateString in data) {
                     if (data.hasOwnProperty(dateString)) {
                         const dateParts = dateString.split('-');
@@ -209,11 +211,38 @@
                         labels.push(formattedDate);
                         deliveredData.push(data[dateString].sms.delivered);
                         failedData.push(data[dateString].sms.failure);
+
+                        // Calculate the total number of messages
+                        totalMessages += data[dateString].sms.delivered + data[dateString].sms.failure;
                     }
                 }
 
-                createChart('#weeklyChart', labels, deliveredData, failedData);
-                createTable('weeklyTable', 'activityChart', labels, deliveredData, failedData);
+                // Check if there are no messages sent
+                const subTitle = document.querySelector(`#activityChartContainer .chart-subtitle`);
+                if (totalMessages === 0) {
+                    // Remove existing chart and render the alert message
+                    d3.select('#weeklyChart').selectAll('*').remove();
+                    d3.select('#weeklyChart')
+                        .append('div')
+                        .html(`
+                            <div class="usa-alert usa-alert--info usa-alert--slim">
+                                <div class="usa-alert__body">
+                                    <p class="usa-alert__text">
+                                        No messages sent in the last 7 days
+                                    </p>
+                                </div>
+                            </div>
+                        `);
+                    // Hide the subtitle
+                    if (subTitle) {
+                        subTitle.style.display = 'none';
+                    }
+                } else {
+                    // If there are messages, create the chart and table
+                    createChart('#weeklyChart', labels, deliveredData, failedData);
+                    createTable('weeklyTable', 'activityChart', labels, deliveredData, failedData);
+                }
+
                 return data;
             })
             .catch(error => console.error('Error fetching daily stats:', error));
diff --git a/app/assets/sass/uswds/_data-visualization.scss b/app/assets/sass/uswds/_data-visualization.scss
index 48c5f1256..e479334a3 100644
--- a/app/assets/sass/uswds/_data-visualization.scss
+++ b/app/assets/sass/uswds/_data-visualization.scss
@@ -9,6 +9,9 @@ $failed: color('gray-cool-20');
   &.usage {
     height: units(4);
   }
+  svg {
+    overflow: visible;
+  }
 }
 
 #totalMessageChartContainer {