Some checks failed
Build and Publish Docker Image / build-and-push (push) Has been cancelled
28 lines
760 B
TypeScript
28 lines
760 B
TypeScript
import { t } from "@lingui/core/macro";
|
|
import { useWS } from "../hooks/useWS.ts";
|
|
import { useChat } from "../hooks/useChat.ts";
|
|
|
|
/** Header chat button with an unread-message badge. Opens the app-wide chat. */
|
|
export function ChatButton() {
|
|
const { unreadChatCount } = useWS();
|
|
const { openChat } = useChat();
|
|
|
|
return (
|
|
<button
|
|
type="button"
|
|
className="chat-button"
|
|
onClick={openChat}
|
|
aria-label={unreadChatCount > 0
|
|
? t`Chat (${unreadChatCount} unread)`
|
|
: t`Chat`}
|
|
>
|
|
<span className="chat-button-icon">💬</span>
|
|
{unreadChatCount > 0 && (
|
|
<span className="notification-badge">
|
|
{unreadChatCount > 99 ? "99+" : unreadChatCount}
|
|
</span>
|
|
)}
|
|
</button>
|
|
);
|
|
}
|