Redirect user from call page when not in call

When a user tries to access a call page while not in a call, redirect the user to the home page.

Misc changes:

- Add route state to the call route that includes the CallStatus.
- CallProvider redirects to home if the callStatus isn't set (meaning
  the user isn't in a call).
- Remove `beginCall` function in `ConversationProvider`. Added `useStartCall` hook that redirects the user to the call page. The `CallProvider` automatically sends the `BeginCall` message when the user reaches the page for the first time.
- Reorder functions in CallProvider to have `useEffect` functions at the top

GitLab: #164
Change-Id: I6cec1b9f31cb308d92a69112f5b38d1bdf79e05f
diff --git a/client/src/pages/Messenger.tsx b/client/src/pages/Messenger.tsx
index c2bc1e7..7f10e41 100644
--- a/client/src/pages/Messenger.tsx
+++ b/client/src/pages/Messenger.tsx
@@ -43,9 +43,11 @@
   const [searchQuery, setSearchQuery] = useState('');
   const [searchResult, setSearchResults] = useState<Conversation | undefined>(undefined);
 
-  const {
-    urlParams: { contactId },
-  } = useUrlParams<AddContactRouteParams>();
+  const { urlParams } = useUrlParams<AddContactRouteParams>();
+
+  // TODO: Rework the contact adding logic so that adding a contact does not make the current conversationId undefined.
+  //       The newContactId should not come from the route, but from a state.
+  const newContactId = urlParams?.contactId;
 
   const accountId = account.getId();
 
@@ -101,7 +103,7 @@
       <Stack flexGrow={0} flexShrink={0} overflow="auto">
         <Header />
         <NewContactForm onChange={setSearchQuery} />
-        {contactId && <AddContactPage contactId={contactId} />}
+        {newContactId && <AddContactPage contactId={newContactId} />}
         {conversations ? (
           <ConversationList search={searchResult} conversations={conversations} accountId={accountId} />
         ) : (