feat(alerts): Show error via JS when too many alerts would be sent

Fixes: #1227
freelawproject · Mar 18, 2020 · 22cb2ad · 22cb2ad
1 parent 56e72a0
commit 22cb2ad
Show file tree

Hide file tree

Showing 2 changed files with 35 additions and 13 deletions.
diff --git a/cl/search/templates/includes/alert_modal.html b/cl/search/templates/includes/alert_modal.html
@@ -16,8 +16,8 @@ <h3>
           {% endif %}
         </h3>
       </div>
-      <div class="modal-body">
-        {% if user.is_authenticated %}
+      {% if user.is_authenticated %}
+        <div class="modal-body logged-in hidden">
           {% if not request.GET.edit_alert %}
             <p>Get regular notifications about this query by creating an alert. <a href="{% url "alert_help" %}">Learn more&nbsp;<i
                     class="fa fa-question-circle gray"></i></a>
@@ -108,12 +108,14 @@ <h3>
               </div>
             </div>
           </form>
-        {% else %}
-          {# Anonymous user #}
+        </div>
+      {% else %}
+        {# Anonymous user #}
+        <div class="modal-body logged-out">
           <p>To get alerts for this search, <a href="{% url "sign-in" %}?next={{ request.path }}?{{ get_string|urlencode }}page={{ results.number }}">sign in</a> or <a href="{% url "register" %}?next={{ request.path }}?next={{ request.path }}?{{ get_string|urlencode }}page={{ results.number }}">register</a> as a new user.
           </p>
-        {% endif %}
-      </div><!-- end .modal-body -->
+        </div>
+      {% endif %}
     </div><!-- end .modal-content -->
   </div><!-- end .modal-dialog -->
 </div>
diff --git a/cl/search/templates/search.html b/cl/search/templates/search.html
@@ -58,18 +58,38 @@
   {% endif %}
   <script type="text/javascript">
     $("#modal-save-alert").on('show.bs.modal', function (e) {
-      let estimate = $(this).find('#alert-estimate');
-      let icon = estimate.find('i');
-      let msg = estimate.find('span');
+      const modalBody = $('.modal-body.logged-in');
+      if (modalBody.length === 0){
+        // Not logged in; abort. Don't do alert estimation ajax
+        return
+      }
+      const estimate = $(this).find('#alert-estimate');
+      const icon = estimate.find('i');
+      const msg = estimate.find('span');
+      const numDaysToEstimate = 100;
       $.ajax({
         url: "{% url "alert_frequency" version=3 day_count=100 %}" + window.location.search,
         success: function(data){
-          // Update icon and text
-          icon.removeClass('fa-spinner fa-pulse').addClass('fa-clock-o');
-          msg.text(" " + data.count + " hits in the last 100 days")
+          // Check if this is impractically large. If so, block it
+          const hitsPerDay = Math.floor(data.count / numDaysToEstimate);
+          if (hitsPerDay > {{ MAX_ALERT_RESULTS_PER_DAY }}){
+            // Wipe the screen; show an error
+            modalBody.empty();
+            modalBody.append(
+              $('<p/>').text("This query averages about " + hitsPerDay + " results per day. This is more than our system can support and may create a lot of messages in your inbox."),
+              $('<p/>').text("Please narrow your query to have fewer results per day.")
+            );
+            modalBody.removeClass("hidden");
+          } else {
+            // Show the form; Update icon and text
+            modalBody.removeClass("hidden");
+            icon.removeClass('fa-spinner fa-pulse fa-warning').addClass('fa-clock-o');
+            msg.text(" " + data.count + " hits in the last 100 days")
+          }
         },
         error: function(){
-          icon.removeClass("fa spinner fa-pulse").addClass("fa-warning");
+          modalBody.removeClass("hidden");
+          icon.removeClass("fa-spinner fa-pulse fa-clock-o").addClass("fa-warning");
           msg.text(" Unable to get estimate for this alert");
         }
       })