multiplex user notifications over a single private channel

src/components/Header/Header.jsx

@@ -1,13 +1,17 @@
-import styles from "./Header.module.css"
 import { Link, NavLink } from "react-router";
 import {useContext, useEffect, useRef, useState} from "react";
+import {AuthContext} from "../../contexts/auth/AuthContext.js";
+
+import styles from "./Header.module.css"
+
 import getUserNotifications from "../../utils/notifications/getUserNotifications.js";
 import deleteNotificationUser from "../../utils/notifications/deleteNotificationUser.js";
 import initEcho from "../../utils/echo/initEcho.js"
 import readNotifications from "../../utils/notifications/readNotifications.js";
-import {AuthContext} from "../../contexts/auth/AuthContext.js";
 import getUser from "../../utils/getUser.js";
 import { userCreatedListener } from "../../utils/echo/listeners/userCreatedListener";
+import { userNotificationsListener } from "../../utils/echo/listeners/userNotificationsListener.js";
+
 
 
 function Header() {
@@ -39,6 +43,7 @@ function Header() {
 
                 const activeChannels = [
                     userCreatedListener(echo, userData, setNotifications, setunreadNotification),
+                    userNotificationsListener(echo, userData, setNotifications, setunreadNotification),
                 ];
                 channelsToLeave = activeChannels.filter(name => name !== null);