Unify audio playback under App component

ts/state/ducks/audioPlayer.ts

@@ -3,12 +3,17 @@
 
 import { useBoundActions } from '../../util/hooks';
 
-import { SwitchToAssociatedViewActionType } from './conversations';
+import {
+  SwitchToAssociatedViewActionType,
+  MessageDeletedActionType,
+  MessageChangedActionType,
+} from './conversations';
 
 // State
 
 export type AudioPlayerStateType = {
   readonly activeAudioID: string | undefined;
+  readonly activeAudioContext: string | undefined;
 };
 
 // Actions
@@ -17,6 +22,7 @@ type SetActiveAudioIDAction = {
   type: 'audioPlayer/SET_ACTIVE_AUDIO_ID';
   payload: {
     id: string | undefined;
+    context: string | undefined;
   };
 };
 
@@ -30,10 +36,13 @@ export const actions = {
 
 export const useActions = (): typeof actions => useBoundActions(actions);
 
-function setActiveAudioID(id: string | undefined): SetActiveAudioIDAction {
+function setActiveAudioID(
+  id: string | undefined,
+  context: string
+): SetActiveAudioIDAction {
   return {
     type: 'audioPlayer/SET_ACTIVE_AUDIO_ID',
-    payload: { id },
+    payload: { id, context },
   };
 }
 
@@ -42,12 +51,18 @@ function setActiveAudioID(id: string | undefined): SetActiveAudioIDAction {
 function getEmptyState(): AudioPlayerStateType {
   return {
     activeAudioID: undefined,
+    activeAudioContext: undefined,
   };
 }
 
 export function reducer(
   state: Readonly<AudioPlayerStateType> = getEmptyState(),
-  action: Readonly<AudioPlayerActionType | SwitchToAssociatedViewActionType>
+  action: Readonly<
+    | AudioPlayerActionType
+    | SwitchToAssociatedViewActionType
+    | MessageDeletedActionType
+    | MessageChangedActionType
+  >
 ): AudioPlayerStateType {
   if (action.type === 'audioPlayer/SET_ACTIVE_AUDIO_ID') {
     const { payload } = action;
@@ -55,6 +70,7 @@ export function reducer(
     return {
       ...state,
       activeAudioID: payload.id,
+      activeAudioContext: payload.context,
     };
   }
 
@@ -66,5 +82,36 @@ export function reducer(
     };
   }
 
+  // Reset activeAudioID on when played message is deleted on expiration.
+  if (action.type === 'MESSAGE_DELETED') {
+    const { id } = action.payload;
+    if (state.activeAudioID !== id) {
+      return state;
+    }
+
+    return {
+      ...state,
+      activeAudioID: undefined,
+    };
+  }
+
+  // Reset activeAudioID on when played message is deleted for everyone.
+  if (action.type === 'MESSAGE_CHANGED') {
+    const { id, data } = action.payload;
+
+    if (state.activeAudioID !== id) {
+      return state;
+    }
+
+    if (!data.deletedForEveryone) {
+      return state;
+    }
+
+    return {
+      ...state,
+      activeAudioID: undefined,
+    };
+  }
+
   return state;
 }