diff --git a/client/src/contexts/AuthProvider.tsx b/client/src/contexts/AuthProvider.tsx
index 50b1723..3bac10d 100644
--- a/client/src/contexts/AuthProvider.tsx
+++ b/client/src/contexts/AuthProvider.tsx
@@ -18,10 +18,11 @@
 import { Account } from 'jami-web-common/dist/Account';
 import { HttpStatusCode } from 'jami-web-common/dist/enums/http-status-code';
 import { createContext, useCallback, useContext, useEffect, useState } from 'react';
-import { Outlet, useNavigate } from 'react-router-dom';
+import { useNavigate } from 'react-router-dom';
 
 import ProcessingRequest from '../components/ProcessingRequest';
 import { apiUrl } from '../utils/constants';
+import { WithChildren } from '../utils/utils';
 
 interface IAuthContext {
   token: string;
@@ -31,7 +32,7 @@
 
 const AuthContext = createContext<IAuthContext | undefined>(undefined);
 
-export default () => {
+export default ({ children }: WithChildren) => {
   const [token, setToken] = useState<string | undefined>();
   const [account, setAccount] = useState<Account | undefined>();
   const navigate = useNavigate();
@@ -91,7 +92,7 @@
         account,
       }}
     >
-      <Outlet />
+      {children}
     </AuthContext.Provider>
   );
 };
diff --git a/client/src/contexts/WebSocketProvider.tsx b/client/src/contexts/WebSocketProvider.tsx
new file mode 100644
index 0000000..86b794f
--- /dev/null
+++ b/client/src/contexts/WebSocketProvider.tsx
@@ -0,0 +1,104 @@
+/*
+ * Copyright (C) 2022 Savoir-faire Linux Inc.
+ *
+ * This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation; either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public
+ * License along with this program.  If not, see
+ * <https://www.gnu.org/licenses/>.
+ */
+import { WebSocketMessage, WebSocketMessageType } from 'jami-web-common';
+import { createContext, useCallback, useEffect, useRef, useState } from 'react';
+
+import { apiUrl } from '../utils/constants';
+import { WithChildren } from '../utils/utils';
+import { useAuthContext } from './AuthProvider';
+
+export type WebSocketMessageFn = (message: WebSocketMessage) => void;
+
+interface IWebSocketContext {
+  bind: (type: WebSocketMessageType, callback: WebSocketMessageFn) => void;
+  send: WebSocketMessageFn;
+}
+
+export const WebSocketContext = createContext<IWebSocketContext | undefined>(undefined);
+
+export default ({ children }: WithChildren) => {
+  const [isConnected, setIsConnected] = useState(false);
+  const webSocketRef = useRef<WebSocket>();
+  const callbacksRef = useRef(new Map<WebSocketMessageType, WebSocketMessageFn[]>());
+
+  const { token: accessToken } = useAuthContext();
+
+  const bind = useCallback((type: WebSocketMessageType, messageCallback: WebSocketMessageFn) => {
+    const messageCallbacks = callbacksRef.current.get(type);
+    if (messageCallbacks) {
+      messageCallbacks.push(messageCallback);
+    } else {
+      callbacksRef.current.set(type, [messageCallback]);
+    }
+  }, []);
+
+  const send = useCallback(
+    (message: WebSocketMessage) => {
+      if (isConnected) {
+        webSocketRef.current?.send(JSON.stringify(message));
+      }
+    },
+    [isConnected]
+  );
+
+  const handleOnOpen = useCallback(() => setIsConnected(true), []);
+
+  const handleOnClose = useCallback(() => {
+    setIsConnected(false);
+    callbacksRef.current.clear();
+  }, []);
+
+  const handleOnMessage = useCallback(({ data }: MessageEvent<string>) => {
+    const message: WebSocketMessage = JSON.parse(data);
+    const messageCallbacks = callbacksRef.current.get(message.type);
+    if (messageCallbacks) {
+      for (const messageCallback of messageCallbacks) {
+        messageCallback(message);
+      }
+    } else {
+      console.warn(`Unhandled message of type ${message.type}`);
+    }
+  }, []);
+
+  const handleOnError = useCallback((event: Event) => {
+    console.error('Closing WebSocket due to an error:', event);
+    webSocketRef.current?.close();
+  }, []);
+
+  useEffect(() => {
+    const url = new URL(apiUrl);
+    url.protocol = 'ws:';
+    url.searchParams.set('accessToken', accessToken);
+
+    const webSocket = new WebSocket(url);
+    webSocket.onopen = handleOnOpen;
+    webSocket.onclose = handleOnClose;
+    webSocket.onmessage = handleOnMessage;
+    webSocket.onerror = handleOnError;
+
+    webSocketRef.current = webSocket;
+
+    return () => webSocket.close();
+  }, [accessToken, handleOnOpen, handleOnClose, handleOnMessage, handleOnError]);
+
+  return isConnected ? (
+    <WebSocketContext.Provider value={{ bind, send }}>{children}</WebSocketContext.Provider>
+  ) : (
+    <>{children}</>
+  );
+};
diff --git a/client/src/index.tsx b/client/src/index.tsx
index 968e62b..49ed2ef 100644
--- a/client/src/index.tsx
+++ b/client/src/index.tsx
@@ -24,13 +24,14 @@
 import { StrictMode } from 'react';
 import { createRoot } from 'react-dom/client';
 import { Provider } from 'react-redux';
-import { createBrowserRouter, createRoutesFromElements, Route, RouterProvider } from 'react-router-dom';
+import { createBrowserRouter, createRoutesFromElements, Outlet, Route, RouterProvider } from 'react-router-dom';
 import socketio from 'socket.io-client';
 
 import App from './App';
 import ContactList from './components/ContactList';
 import AuthProvider from './contexts/AuthProvider';
 import { SocketProvider } from './contexts/Socket';
+import WebSocketProvider from './contexts/WebSocketProvider';
 import AccountSelection from './pages/AccountSelection';
 import AccountSettings from './pages/AccountSettings';
 import CallInterface from './pages/CallInterface';
@@ -58,7 +59,15 @@
     <Route path="/" element={<App />}>
       <Route index element={<Welcome />} />
       <Route path="theme" element={<ThemeDemonstrator />} />
-      <Route element={<AuthProvider />}>
+      <Route
+        element={
+          <AuthProvider>
+            <WebSocketProvider>
+              <Outlet />
+            </WebSocketProvider>
+          </AuthProvider>
+        }
+      >
         <Route path="account" element={<JamiMessenger />} />
         <Route path="settings" element={<AccountSettings />} />
         <Route path="contacts" element={<ContactList />} />