Place calls on top of story viewer, pause stories while in call

ts/components/StoryViewer.tsx

@@ -56,6 +56,7 @@ export type PropsType = {
     | 'sharedGroupNames'
     | 'title'
   >;
+  hasActiveCall?: boolean;
   hasAllStoriesMuted: boolean;
   i18n: LocalizerType;
   loadStoryReplies: (conversationId: string, messageId: string) => unknown;
@@ -103,6 +104,7 @@ export const StoryViewer = ({
   deleteStoryForEveryone,
   getPreferredBadge,
   group,
+  hasActiveCall,
   hasAllStoriesMuted,
   i18n,
   loadStoryReplies,
@@ -276,6 +278,7 @@ export const StoryViewer = ({
   const [pauseStory, setPauseStory] = useState(false);
 
   const shouldPauseViewing =
+    hasActiveCall ||
     hasConfirmHideStory ||
     hasExpandedCaption ||
     hasStoryDetailsModal ||

ts/state/selectors/calling.ts

@@ -59,6 +59,12 @@ export const isInCall = createSelector(
   (call: CallStateType | undefined): boolean => Boolean(call)
 );
 
+export const isInFullScreenCall = createSelector(
+  getCalling,
+  (state: CallingStateType): boolean =>
+    Boolean(state.activeCallState && !state.activeCallState.pip)
+);
+
 export const getIncomingCall = createSelector(
   getCallsByConversation,
   getUserACI,

ts/state/smart/StoryViewer.tsx

@@ -24,6 +24,7 @@ import {
   getStoryReplies,
   getStoryByIdSelector,
 } from '../selectors/stories';
+import { isInFullScreenCall } from '../selectors/calling';
 import { renderEmojiPicker } from './renderEmojiPicker';
 import { strictAssert } from '../../util/assert';
 import { useActions as useEmojisActions } from '../ducks/emojis';
@@ -79,11 +80,14 @@ export function SmartStoryViewer(): JSX.Element | null {
     getHasAllStoriesMuted
   );
 
+  const hasActiveCall = useSelector(isInFullScreenCall);
+
   return (
     <StoryViewer
       currentIndex={selectedStoryData.currentIndex}
       getPreferredBadge={getPreferredBadge}
       group={conversationStory.group}
+      hasActiveCall={hasActiveCall}
       hasAllStoriesMuted={hasAllStoriesMuted}
       i18n={i18n}
       numStories={selectedStoryData.numStories}