Dr Rai delete action overlay animation (#5691)

**Story card:**
[sc-16727](https://app.shortcut.com/simpledotorg/story/16727/dr-rai-loading-animations)

## Because

Animation for deleting an action plan.
Dashboard currently loads slowly

## This addresses

Showing an animation informs users that the site is loading, rather than
not working. Improving the user experience and reducing confusion.


https://github.com/user-attachments/assets/96b6a5e9-71e3-4f15-973d-d75c551eb3fd
_Data shown in this example is randomly generated and not production
data; names may be associated with real places._

## Test instructions

- Branch `dr-rai-action-delete-animation`
- Add at least 2 actions to a single action plan.
- Delete one of the action plans
- Ensure the overlay is shown on the action being deleted

---------

Co-authored-by: Igbanam <[email protected]>

Author: jamiecarter7

app/assets/stylesheets/dr_rai.scss

@@ -569,3 +569,29 @@ $font-condensed: "Roboto Condensed", sans-serif;
   -moz-transition: all 0.4s ease-out;
   -ms-transition: all 0.4s ease-out;
 }
+
+.fa-spin {
+  -webkit-animation: fa-spin 0.1s infinite linear !important;
+  animation: fa-spin 1s infinite linear !important;
+}
+
+.deleting-overlay {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  gap: 8px;
+  color: white;
+  background: rgba(77, 78, 54, 0.65);
+  border-radius: 4px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  opacity: 1;
+  transition: opacity 0.3s ease-in-out;
+  transition-behavior: allow-discrete;
+  @starting-style {
+    opacity: 0;
+  }
+}

app/components/dashboard/dr_rai_report.html.erb

@@ -45,6 +45,10 @@
               </div>
             </div>
           </div>
+          <div class="deleting-overlay d-none">
+              <i class=" fa-solid fa-spinner-third fa-spin fa-fast-spin"></i>
+              <p >Removing action, this page will refresh shortly...</p>
+          </div>
         </div>
       <% end %>
     <% else %>
@@ -410,7 +414,14 @@
 
       // Close the offcanvas
       $('.bs-canvas-close').trigger('click')
+
     })
+
+    // show action delete overlay, takes several seconds to process
+    $('.dropdown-item.delete').on("click", function(e) {
+      $(this).closest('.action-card').find('.deleting-overlay').removeClass('d-none'); // show overlay only for this card
+    });
   });
 </script>
+
 <% end %>