diff --git a/apps/dispatch/app/_components/left/Chat.tsx b/apps/dispatch/app/_components/left/Chat.tsx index 21b0b177..d09a5ebf 100644 --- a/apps/dispatch/app/_components/left/Chat.tsx +++ b/apps/dispatch/app/_components/left/Chat.tsx @@ -2,7 +2,7 @@ import { ChatBubbleIcon, PaperPlaneIcon } from "@radix-ui/react-icons"; import { useLeftMenuStore } from "_store/leftMenuStore"; import { useSession } from "next-auth/react"; -import { Fragment, useEffect, useState } from "react"; +import { Fragment, useEffect, useState, useRef } from "react"; import { cn } from "@repo/shared-components"; import { asPublicUser } from "@repo/db"; import { useQuery } from "@tanstack/react-query"; @@ -30,6 +30,8 @@ export const Chat = () => { const [message, setMessage] = useState(""); const dispatcherConnected = useDispatchConnectionStore((state) => state.status === "connected"); const pilotConnected = usePilotConnectionStore((state) => state.status === "connected"); + const [someChat, setSomeChat] = useState(false); + const audioRef = useRef(null); const { data: dispatcher } = useQuery({ queryKey: ["dispatcher"], @@ -61,16 +63,27 @@ export const Chat = () => { } }, [btnActive, setChatOpen]); + useEffect(() => { + if (Object.values(chats).some((c) => c.notification)) { + setSomeChat(true); + if (audioRef.current) { + audioRef.current.volume = 0.5; + audioRef.current.play().catch(() => {}); + } + } else { + setSomeChat(false); + } + }, [chats]); + return (
+