Handle play() and load() promises for audio elements

Updated audio playback and preloading logic to check for and handle returned promises from play() and load() methods. This prevents uncaught promise rejections in browsers where these methods may return undefined, improving reliability and error handling for notification sounds.

components/admin/AdminAnalytics.tsx

@@ -438,7 +438,7 @@ export default function AdminAnalytics() {
               <span>Today: {analyticsData?.orders?.totalToday || 0}</span>
               <TrendIndicator 
                 current={analyticsData?.orders?.totalToday || 0} 
-                previous={(analyticsData?.orders?.total || 0) / 30} // Rough estimate
+                previous={(analyticsData?.orders?.total || 0) / 30}
               />
             </div>
             

components/audio-preloader.tsx

@@ -12,9 +12,16 @@ export function AudioPreloader() {
     audio.preload = 'auto'
     
     // Try to load it immediately
-    audio.load().catch(err => {
+    try {
+      const loadPromise = audio.load();
+      if (loadPromise !== undefined) {
+        loadPromise.catch(err => {
+          console.log('Audio preload failed (non-critical):', err)
+        });
+      }
+    } catch (err) {
       console.log('Audio preload failed (non-critical):', err)
-    })
+    }
 
     return () => {
       // Cleanup

components/dashboard/ChatDetail.tsx

@@ -153,21 +153,24 @@ export default function ChatDetail({ chatId }: { chatId: string }) {
   const playNotificationSound = () => {
     if (audioRef.current) {
       audioRef.current.currentTime = 0;
-      audioRef.current.play().catch(err => {
+      const playPromise = audioRef.current.play();
-        console.log('Error playing sound:', err);
+      if (playPromise !== undefined) {
-        // Fallback to simple beep if audio file fails
+        playPromise.catch(err => {
-        try {
+          console.log('Error playing sound:', err);
-          const context = new (window.AudioContext || (window as any).webkitAudioContext)();
+          // Fallback to simple beep if audio file fails
-          const oscillator = context.createOscillator();
+          try {
-          oscillator.type = 'sine';
+            const context = new (window.AudioContext || (window as any).webkitAudioContext)();
-          oscillator.frequency.setValueAtTime(800, context.currentTime);
+            const oscillator = context.createOscillator();
-          oscillator.connect(context.destination);
+            oscillator.type = 'sine';
-          oscillator.start();
+            oscillator.frequency.setValueAtTime(800, context.currentTime);
-          oscillator.stop(context.currentTime + 0.2);
+            oscillator.connect(context.destination);
-        } catch (e) {
+            oscillator.start();
-          console.error('Could not play fallback audio', e);
+            oscillator.stop(context.currentTime + 0.2);
-        }
+          } catch (e) {
-      });
+            console.error('Could not play fallback audio', e);
+          }
+        });
+      }
     } else {
       // Fallback to simple beep if audio element is not available
       try {

components/dashboard/ChatTable.tsx

@@ -92,9 +92,12 @@ export default function ChatTable() {
   // Play notification sound
   const playNotificationSound = () => {
     if (audioRef.current) {
-      audioRef.current.play().catch(e => {
+      const playPromise = audioRef.current.play();
-        console.log("Failed to play notification sound:", e);
+      if (playPromise !== undefined) {
-      });
+        playPromise.catch(e => {
+          console.log("Failed to play notification sound:", e);
+        });
+      }
     }
   };
   

components/notifications/OrderNotifications.tsx

@@ -51,21 +51,24 @@ export default function OrderNotifications() {
   const playNotificationSound = () => {
     if (audioRef.current) {
       audioRef.current.currentTime = 0;
-      audioRef.current.play().catch(err => {
+      const playPromise = audioRef.current.play();
-        console.log('Error playing sound:', err);
+      if (playPromise !== undefined) {
-        // Fallback to simple beep if audio file fails
+        playPromise.catch(err => {
-        try {
+          console.log('Error playing sound:', err);
-          const context = new (window.AudioContext || (window as any).webkitAudioContext)();
+          // Fallback to simple beep if audio file fails
-          const oscillator = context.createOscillator();
+          try {
-          oscillator.type = 'sine';
+            const context = new (window.AudioContext || (window as any).webkitAudioContext)();
-          oscillator.frequency.setValueAtTime(800, context.currentTime);
+            const oscillator = context.createOscillator();
-          oscillator.connect(context.destination);
+            oscillator.type = 'sine';
-          oscillator.start();
+            oscillator.frequency.setValueAtTime(800, context.currentTime);
-          oscillator.stop(context.currentTime + 0.2);
+            oscillator.connect(context.destination);
-        } catch (e) {
+            oscillator.start();
-          console.error('Could not play fallback audio', e);
+            oscillator.stop(context.currentTime + 0.2);
-        }
+          } catch (e) {
-      });
+            console.error('Could not play fallback audio', e);
+          }
+        });
+      }
     }
   };
 

lib/notification-context.tsx

@@ -147,21 +147,24 @@ export function NotificationProvider({ children }: NotificationProviderProps) {
   const playNotificationSound = () => {
     if (audioRef.current) {
       audioRef.current.currentTime = 0;
-      audioRef.current.play().catch(err => {
+      const playPromise = audioRef.current.play();
-        console.log('Error playing sound:', err);
+      if (playPromise !== undefined) {
-        // Fallback beep if audio file fails
+        playPromise.catch(err => {
-        try {
+          console.log('Error playing sound:', err);
-          const context = new (window.AudioContext || (window as any).webkitAudioContext)();
+          // Fallback beep if audio file fails
-          const oscillator = context.createOscillator();
+          try {
-          oscillator.type = 'sine';
+            const context = new (window.AudioContext || (window as any).webkitAudioContext)();
-          oscillator.frequency.setValueAtTime(800, context.currentTime);
+            const oscillator = context.createOscillator();
-          oscillator.connect(context.destination);
+            oscillator.type = 'sine';
-          oscillator.start();
+            oscillator.frequency.setValueAtTime(800, context.currentTime);
-          oscillator.stop(context.currentTime + 0.2);
+            oscillator.connect(context.destination);
-        } catch (e) {
+            oscillator.start();
-          console.error('Could not play fallback audio', e);
+            oscillator.stop(context.currentTime + 0.2);
-        }
+          } catch (e) {
-      });
+            console.error('Could not play fallback audio', e);
+          }
+        });
+      }
     }
   };