From a3d1439ca65a43ae0802fab00edd220448561af3 Mon Sep 17 00:00:00 2001
From: Nick Mowen <nickmowen213@gmail.com>
Date: Tue, 6 Sep 2022 14:16:24 -0600
Subject: [PATCH] Add haptic feedback for modifications like deleting or
 favoriting an event

---
 web/src/routes/Events.jsx | 31 ++++++++++++++++++++++++++++---
 1 file changed, 28 insertions(+), 3 deletions(-)

diff --git a/web/src/routes/Events.jsx b/web/src/routes/Events.jsx
index b93d661e4..687f75df0 100644
--- a/web/src/routes/Events.jsx
+++ b/web/src/routes/Events.jsx
@@ -23,6 +23,7 @@ import Button from '../components/Button';
 import Dialog from '../components/Dialog';
 
 const API_LIMIT = 25;
+const HAPTIC_FEEDBACK_DURATION = 100;
 
 const daysAgo = (num) => {
   let date = new Date();
@@ -110,7 +111,14 @@ export default function Events({ path, ...props }) {
   );
 
   const onSave = async (e, eventId, save) => {
-    e.stopPropagation();
+    if (e) {
+      e.stopPropagation();
+
+      if ("vibrate" in navigator) {
+        navigator.vibrate(HAPTIC_FEEDBACK_DURATION);
+      }
+    }
+
     let response;
     if (save) {
       response = await axios.post(`events/${eventId}/retain`);
@@ -123,7 +131,13 @@ export default function Events({ path, ...props }) {
   };
 
   const onDelete = async (e, eventId, saved) => {
-    e.stopPropagation();
+    if (e) {
+      e.stopPropagation();
+
+      if ("vibrate" in navigator) {
+        navigator.vibrate(HAPTIC_FEEDBACK_DURATION);
+      }
+    }
 
     if (saved) {
       setDeleteFavoriteState({ deletingFavoriteEventId: eventId, showDeleteFavorite: true });
@@ -140,7 +154,14 @@ export default function Events({ path, ...props }) {
   const downloadButton = useRef();
 
   const onDownloadClick = (e, event) => {
-    e.stopPropagation();
+    if (e) {
+      e.stopPropagation();
+
+      if ("vibrate" in navigator) {
+        navigator.vibrate(HAPTIC_FEEDBACK_DURATION);
+      }
+    }
+
     setDownloadEvent((_prev) => ({
       id: event.id,
       has_clip: event.has_clip,
@@ -197,6 +218,10 @@ export default function Events({ path, ...props }) {
 
   const onSendToPlus = async (id, e) => {
     if (e) {
+      if ("vibrate" in navigator) {
+        navigator.vibrate(HAPTIC_FEEDBACK_DURATION);
+      }
+
       e.stopPropagation();
     }