Move "user media" logic into its own provider.

- This new provider is meant to be reused by the settings in the future

Change-Id: I513c07f2390445fb4802091b316244665218f948
diff --git a/client/src/pages/CallPending.tsx b/client/src/pages/CallPending.tsx
index 7ed5aad..c965d45 100644
--- a/client/src/pages/CallPending.tsx
+++ b/client/src/pages/CallPending.tsx
@@ -30,11 +30,13 @@
 import ConversationAvatar from '../components/ConversationAvatar';
 import { CallStatus, useCallContext } from '../contexts/CallProvider';
 import { useConversationContext } from '../contexts/ConversationProvider';
+import { useUserMediaContext } from '../contexts/UserMediaProvider';
 import { VideoElementWithSinkId } from '../utils/utils';
 
 export const CallPending = () => {
   const { conversationDisplayName } = useConversationContext();
-  const { callRole, localStream } = useCallContext();
+  const { localStream } = useUserMediaContext();
+  const { callRole } = useCallContext();
   const localVideoRef = useRef<VideoElementWithSinkId | null>(null);
 
   useEffect(() => {