diff --git a/app/soapbox/components/helmet.tsx b/app/soapbox/components/helmet.tsx index 23a73e744..6fa678a04 100644 --- a/app/soapbox/components/helmet.tsx +++ b/app/soapbox/components/helmet.tsx @@ -1,6 +1,7 @@ import React from 'react'; import { Helmet as ReactHelmet } from 'react-helmet'; +import { useStatContext } from 'soapbox/contexts/stat-context'; import { useAppSelector, useInstance, useSettings } from 'soapbox/hooks'; import { RootState } from 'soapbox/store'; import FaviconService from 'soapbox/utils/favicon-service'; @@ -9,15 +10,15 @@ FaviconService.initFaviconService(); const getNotifTotals = (state: RootState): number => { const notifications = state.notifications.unread || 0; - const chats = state.chats.items.reduce((acc: any, curr: any) => acc + Math.min(curr.get('unread', 0), 1), 0); const reports = state.admin.openReports.count(); const approvals = state.admin.awaitingApproval.count(); - return notifications + chats + reports + approvals; + return notifications + reports + approvals; }; const Helmet: React.FC = ({ children }) => { const instance = useInstance(); - const unreadCount = useAppSelector((state) => getNotifTotals(state)); + const { unreadChatsCount } = useStatContext(); + const unreadCount = useAppSelector((state) => getNotifTotals(state) + unreadChatsCount); const demetricator = useSettings().get('demetricator'); const hasUnreadNotifications = React.useMemo(() => !(unreadCount < 1 || demetricator), [unreadCount, demetricator]); diff --git a/app/soapbox/features/chats/components/chat-message-list.tsx b/app/soapbox/features/chats/components/chat-message-list.tsx index 5261a337a..1f6fd6adb 100644 --- a/app/soapbox/features/chats/components/chat-message-list.tsx +++ b/app/soapbox/features/chats/components/chat-message-list.tsx @@ -307,7 +307,9 @@ const ChatMessageList: React.FC = ({ chat }) => { title={getFormattedTimestamp(chatMessage)} className={ classNames({ - 'text-ellipsis break-words relative rounded-md py-2 px-3 max-w-full space-y-2': true, + 'text-ellipsis break-words relative rounded-md py-2 px-3 max-w-full space-y-2 [&_.mention]:underline': true, + '[&_.mention]:text-primary-600 dark:[&_.mention]:text-accent-blue': !isMyMessage, + '[&_.mention]:text-white dark:[&_.mention]:white': isMyMessage, 'bg-primary-500 text-white': isMyMessage, 'bg-gray-200 dark:bg-gray-800 text-gray-900 dark:text-gray-100': !isMyMessage, '!bg-transparent !p-0 emoji-lg': isOnlyEmoji, diff --git a/app/soapbox/features/chats/components/chat-page/components/blankslate-empty.tsx b/app/soapbox/features/chats/components/chat-page/components/blankslate-empty.tsx index cc883f11f..f2d8a38f5 100644 --- a/app/soapbox/features/chats/components/chat-page/components/blankslate-empty.tsx +++ b/app/soapbox/features/chats/components/chat-page/components/blankslate-empty.tsx @@ -28,7 +28,7 @@ const BlankslateEmpty: React.FC = () => { diff --git a/app/soapbox/features/chats/components/chat-page/components/welcome.tsx b/app/soapbox/features/chats/components/chat-page/components/welcome.tsx index 584f61e73..0cc172e81 100644 --- a/app/soapbox/features/chats/components/chat-page/components/welcome.tsx +++ b/app/soapbox/features/chats/components/chat-page/components/welcome.tsx @@ -13,7 +13,7 @@ type FormData = { const messages = defineMessages({ title: { id: 'chat.welcome.title', defaultMessage: 'Welcome to {br} Chats!' }, - subtitle: { id: 'chat.welcome.subtitle', defaultMessage: 'Exchange private messages with other users.' }, + subtitle: { id: 'chat.welcome.subtitle', defaultMessage: 'Exchange direct messages with other users.' }, acceptingMessageLabel: { id: 'chat.welcome.accepting_messages.label', defaultMessage: 'Allow users to start a new chat with you' }, notice: { id: 'chat.welcome.notice', defaultMessage: 'You can change these settings later.' }, submit: { id: 'chat.welcome.submit', defaultMessage: 'Save & Continue' }, diff --git a/app/soapbox/features/chats/components/chat-pane/blankslate.tsx b/app/soapbox/features/chats/components/chat-pane/blankslate.tsx index 936267b5f..d817a8f48 100644 --- a/app/soapbox/features/chats/components/chat-pane/blankslate.tsx +++ b/app/soapbox/features/chats/components/chat-pane/blankslate.tsx @@ -5,7 +5,7 @@ import { Button, Stack, Text } from 'soapbox/components/ui'; const messages = defineMessages({ title: { id: 'chat_search.empty_results_blankslate.title', defaultMessage: 'No messages yet' }, - body: { id: 'chat_search.empty_results_blankslate.body', defaultMessage: 'You can start a chat with anyone that follows you.' }, + body: { id: 'chat_search.empty_results_blankslate.body', defaultMessage: 'Search for someone to chat with.' }, action: { id: 'chat_search.empty_results_blankslate.action', defaultMessage: 'Message someone' }, }); diff --git a/app/soapbox/features/chats/components/chat-search/blankslate.tsx b/app/soapbox/features/chats/components/chat-search/blankslate.tsx index 7ee22bdaa..ed2583e9f 100644 --- a/app/soapbox/features/chats/components/chat-search/blankslate.tsx +++ b/app/soapbox/features/chats/components/chat-search/blankslate.tsx @@ -4,8 +4,8 @@ import { defineMessages, useIntl } from 'react-intl'; import { Stack, Text } from 'soapbox/components/ui'; const messages = defineMessages({ - title: { id: 'chat_search.blankslate.title', defaultMessage: 'Search followers' }, - body: { id: 'chat_search.blankslate.body', defaultMessage: 'You can start a chat with anyone that follows you.' }, + title: { id: 'chat_search.blankslate.title', defaultMessage: 'Start a chat' }, + body: { id: 'chat_search.blankslate.body', defaultMessage: 'Search for someone to chat with.' }, }); const Blankslate = () => { diff --git a/app/soapbox/queries/chats.ts b/app/soapbox/queries/chats.ts index 15de81e9e..68fa7fc21 100644 --- a/app/soapbox/queries/chats.ts +++ b/app/soapbox/queries/chats.ts @@ -253,7 +253,6 @@ const useChatActions = (chatId: string) => { return { ...page, result: [ - ...page.result, normalizeChatMessage({ content: variables.content, id: String(Number(new Date())), @@ -262,6 +261,7 @@ const useChatActions = (chatId: string) => { pending: true, unread: true, }), + ...page.result, ], }; }