From aa70fea890ecd622d392270cd21453b9ae9fe578 Mon Sep 17 00:00:00 2001
From: Asespinel <79876430+Asespinel@users.noreply.github.com>
Date: Wed, 19 Jun 2024 09:22:25 -0500
Subject: [PATCH] feat: hide the survey report banner for a month after
 clicking the dismiss button (#34914)

This hides the survey report banner from the Django Admin for a
particular user for one month after they click on the "dismiss" button.
This is done completely on the client side using localStorage, so the
same user could see the banner again if they're logging in with a
different browser.
---
 .../static/survey_report/js/admin_banner.js   | 46 +++++++++++++++++--
 .../templates/survey_report/admin_banner.html |  3 +-
 2 files changed, 45 insertions(+), 4 deletions(-)

diff --git a/openedx/features/survey_report/static/survey_report/js/admin_banner.js b/openedx/features/survey_report/static/survey_report/js/admin_banner.js
index d8650321ba3..8dd9ba5565e 100644
--- a/openedx/features/survey_report/static/survey_report/js/admin_banner.js
+++ b/openedx/features/survey_report/static/survey_report/js/admin_banner.js
@@ -1,11 +1,51 @@
 $(document).ready(function(){
+    // Function to get user ID
+  function getUserId() {
+    return $('#userIdSurvey').val();
+  }
+
+  // Function to get current time in milliseconds
+  function getCurrentTime() {
+    return new Date().getTime();
+  }
+
+  // Function to set dismissal time and expiration time in local storage
+  function setDismissalAndExpirationTime(userId, dismissalTime) {
+    let expirationTime = dismissalTime + (30 * 24 * 60 * 60 * 1000); // 30 days
+    localStorage.setItem('bannerDismissalTime_' + userId, dismissalTime);
+    localStorage.setItem('bannerExpirationTime_' + userId, expirationTime);
+  }
+
+  // Function to check if banner should be shown or hidden
+  function checkBannerVisibility() {
+    let userId = getUserId();
+    let bannerDismissalTime = localStorage.getItem('bannerDismissalTime_' + userId);
+    let bannerExpirationTime = localStorage.getItem('bannerExpirationTime_' + userId);
+    let currentTime = getCurrentTime();
+
+    if (bannerDismissalTime && bannerExpirationTime && currentTime > bannerExpirationTime) {
+      // Banner was dismissed and it's not within the expiration period, so show it
+      $('#originalContent').show();
+    } else if (bannerDismissalTime && bannerExpirationTime && currentTime < bannerExpirationTime) {
+      // Banner was dismissed and it's within the expiration period, so hide it
+      $('#originalContent').hide();
+    } else {
+      // Banner has not been dismissed ever so we need to show it.
+      $('#originalContent').show();
+    }
+  }
+
+  // Click event for dismiss button
   $('#dismissButton').click(function() {
     $('#originalContent').slideUp('slow', function() {
-      // If you want to do something after the slide-up, do it here.
-      // For example, you can hide the entire div:
-      // $(this).hide();
+      let userId = getUserId();
+      let dismissalTime = getCurrentTime();
+      setDismissalAndExpirationTime(userId, dismissalTime);
     });
   });
+
+  // Check banner visibility on page load
+  checkBannerVisibility();
   // When the form is submitted
   $("#survey_report_form").submit(function(event){
     event.preventDefault();  // Prevent the form from submitting traditionally
diff --git a/openedx/features/survey_report/templates/survey_report/admin_banner.html b/openedx/features/survey_report/templates/survey_report/admin_banner.html
index fa0b37ecf75..e13eb655f63 100644
--- a/openedx/features/survey_report/templates/survey_report/admin_banner.html
+++ b/openedx/features/survey_report/templates/survey_report/admin_banner.html
@@ -1,7 +1,7 @@
 {% block survey_report_banner %}
 {% load static %}
 {% if show_survey_report_banner %}
-<div id="originalContent" style="border: 3px solid #06405d; margin-bottom: 50px; rgb(0 0 0 / 18%) 0px 3px 5px;">
+<div id="originalContent" style="border: 3px solid #06405d; margin-bottom: 50px; rgb(0 0 0 / 18%) 0px 3px 5px; display: none;">
   <div  style="background-color: #06405d;padding: 17px 37px;">
     <h1 style="margin: 0; color: #FFFF; font-weight: 600;">Join the Open edX Data Sharing Initiative and shape the future of learning</h1>
 </div>
@@ -15,6 +15,7 @@ <h1 style="margin: 0; color: #FFFF; font-weight: 600;">Join the Open edX Data Sh
    <button id="dismissButton" type="button" style="background-color:var(--close-button-bg); color: var(--button-fg); border: none; border-radius: 4px; padding: 10px 20px; margin-right: 10px; cursor: pointer;">Dismiss</button>
     <form id='survey_report_form' method="POST" action="/survey_report/generate_report" style="margin: 0; padding: 0;">
         {% csrf_token %}
+        <input type="hidden" id="userIdSurvey" value="{{ user.id }}">
         <button type="submit" style="background-color: #377D4D; color: var(--button-fg); border: none; border-radius: 4px; padding: 10px 20px; cursor: pointer;">Send Report</button>
     </form>
 </div>