diff --git a/frontend/src/App.jsx b/frontend/src/App.jsx
index a57cd1b0..5aa5df23 100644
--- a/frontend/src/App.jsx
+++ b/frontend/src/App.jsx
@@ -85,65 +85,66 @@ const App = () => {
       withGlobalStyles
       withNormalizeCSS
     >
-      <Router>
-        <AppShell
-          header={{
-            height: 0,
-          }}
-          navbar={{
-            width: open ? drawerWidth : miniDrawerWidth,
-          }}
-        >
-          <Sidebar
-            drawerWidth
-            miniDrawerWidth
-            collapsed={!open}
-            toggleDrawer={toggleDrawer}
-          />
+      <WebsocketProvider>
+        <Router>
+          <AppShell
+            header={{
+              height: 0,
+            }}
+            navbar={{
+              width: open ? drawerWidth : miniDrawerWidth,
+            }}
+          >
+            <Sidebar
+              drawerWidth
+              miniDrawerWidth
+              collapsed={!open}
+              toggleDrawer={toggleDrawer}
+            />
 
-          <AppShell.Main>
-            <Box
-              style={{
-                display: 'flex',
-                flexDirection: 'column',
-                // transition: 'margin-left 0.3s',
-                backgroundColor: '#18181b',
-                height: '100vh',
-                color: 'white',
-              }}
-            >
-              <Box sx={{ p: 2, flex: 1, overflow: 'auto' }}>
-                <Routes>
-                  {isAuthenticated ? (
-                    <>
-                      <Route path="/channels" element={<Channels />} />
-                      <Route path="/sources" element={<ContentSources />} />
-                      <Route path="/guide" element={<Guide />} />
-                      <Route path="/dvr" element={<DVR />} />
-                      <Route path="/stats" element={<Stats />} />
-                      <Route path="/settings" element={<Settings />} />
-                    </>
-                  ) : (
-                    <Route path="/login" element={<Login needsSuperuser />} />
-                  )}
-                  <Route
-                    path="*"
-                    element={
-                      <Navigate
-                        to={isAuthenticated ? defaultRoute : '/login'}
-                        replace
-                      />
-                    }
-                  />
-                </Routes>
+            <AppShell.Main>
+              <Box
+                style={{
+                  display: 'flex',
+                  flexDirection: 'column',
+                  // transition: 'margin-left 0.3s',
+                  backgroundColor: '#18181b',
+                  height: '100vh',
+                  color: 'white',
+                }}
+              >
+                <Box sx={{ p: 2, flex: 1, overflow: 'auto' }}>
+                  <Routes>
+                    {isAuthenticated ? (
+                      <>
+                        <Route path="/channels" element={<Channels />} />
+                        <Route path="/sources" element={<ContentSources />} />
+                        <Route path="/guide" element={<Guide />} />
+                        <Route path="/dvr" element={<DVR />} />
+                        <Route path="/stats" element={<Stats />} />
+                        <Route path="/settings" element={<Settings />} />
+                      </>
+                    ) : (
+                      <Route path="/login" element={<Login needsSuperuser />} />
+                    )}
+                    <Route
+                      path="*"
+                      element={
+                        <Navigate
+                          to={isAuthenticated ? defaultRoute : '/login'}
+                          replace
+                        />
+                      }
+                    />
+                  </Routes>
+                </Box>
               </Box>
-            </Box>
-          </AppShell.Main>
-        </AppShell>
-        <M3URefreshNotification />
-        <Notifications containerWidth={350} />
-        <WebsocketProvider />
-      </Router>
+            </AppShell.Main>
+          </AppShell>
+          <M3URefreshNotification />
+          <Notifications containerWidth={350} />
+        </Router>
+      </WebsocketProvider>
 
       <FloatingVideo />
     </MantineProvider>
diff --git a/frontend/src/WebSocket.jsx b/frontend/src/WebSocket.jsx
index 72533910..1d33565f 100644
--- a/frontend/src/WebSocket.jsx
+++ b/frontend/src/WebSocket.jsx
@@ -14,19 +14,17 @@ import useEPGsStore from './store/epgs';
 import { Box, Button, Stack } from '@mantine/core';
 import API from './api';
 
-export const WebsocketContext = createContext(false, null, () => {});
+export const WebsocketContext = createContext([false, () => {}, null]);
 
 export const WebsocketProvider = ({ children }) => {
   const [isReady, setIsReady] = useState(false);
   const [val, setVal] = useState(null);
 
-  const { fetchStreams } = useStreamsStore();
   const { fetchChannels, setChannelStats, fetchChannelGroups } =
     useChannelsStore();
   const { fetchPlaylists, setRefreshProgress, setProfilePreview } =
     usePlaylistsStore();
   const { fetchEPGData, fetchEPGs } = useEPGsStore();
-  const { playlists } = usePlaylistsStore();
 
   const ws = useRef(null);