🔒️(frontend) enhance notification data decoding with improved validation

Strengthen decodeNotificationDataReceived function with additional validation
to properly handle malicious input. Ensures application security when
processing potentially dangerous notification data from untrusted sources.

src/frontend/src/features/notifications/MainNotificationToast.tsx

@@ -69,11 +69,11 @@ export const MainNotificationToast = () => {
       payload: Uint8Array,
       participant?: RemoteParticipant
     ) => {
-      const { type, data } = decodeNotificationDataReceived(payload)
+      const notification = decodeNotificationDataReceived(payload)
 
-      if (!participant) return
+      if (!participant || !notification) return
 
-      switch (type) {
+      switch (notification.type) {
         case NotificationType.ParticipantMuted:
           toastQueue.add(
             {
@@ -84,7 +84,8 @@ export const MainNotificationToast = () => {
           )
           break
         case NotificationType.ReactionReceived:
-          if (data?.emoji) handleEmoji(data.emoji, participant)
+          if (notification.data?.emoji)
+            handleEmoji(notification.data.emoji, participant)
           break
         default:
           return

src/frontend/src/features/notifications/utils.ts

@@ -30,7 +30,22 @@ export const closeLowerHandToasts = () => {
 
 export const decodeNotificationDataReceived = (
   payload: Uint8Array
-): NotificationPayload => {
+): NotificationPayload | undefined => {
-  const decoder = new TextDecoder()
+  if (!payload || !(payload instanceof Uint8Array)) {
-  return JSON.parse(decoder.decode(payload))
+    throw new Error('Invalid payload: expected Uint8Array')
+  }
+  try {
+    const decoder = new TextDecoder()
+    const jsonString = decoder.decode(payload)
+    if (!jsonString || typeof jsonString !== 'string') {
+      throw new Error('Invalid decoded content')
+    }
+    // Parse with additional validation if needed
+    const parsed = JSON.parse(jsonString)
+    return parsed as NotificationPayload
+  } catch (error) {
+    // Handle errors appropriately for your application
+    console.error('Failed to decode notification payload:', error)
+    return
+  }
 }

src/frontend/src/features/rooms/hooks/useWaitingParticipants.ts

@@ -23,8 +23,8 @@ export const useWaitingParticipants = () => {
   const isAdminOrOwner = useIsAdminOrOwner()
 
   const handleDataReceived = useCallback((payload: Uint8Array) => {
-    const { type } = decodeNotificationDataReceived(payload)
+    const notification = decodeNotificationDataReceived(payload)
-    if (type === NotificationType.ParticipantWaiting) {
+    if (notification?.type === NotificationType.ParticipantWaiting) {
       setListEnabled(true)
     }
   }, [])