diff --git a/web/sidebar/app-switcher.react.js b/web/sidebar/app-switcher.react.js index 25824467b..152b11222 100644 --- a/web/sidebar/app-switcher.react.js +++ b/web/sidebar/app-switcher.react.js @@ -1,139 +1,133 @@ // @flow -import invariant from 'invariant'; import * as React from 'react'; import { useDispatch } from 'react-redux'; import { mostRecentlyReadThreadSelector, unreadCount, } from 'lib/selectors/thread-selectors'; import { useSelector } from '../redux/redux-utils'; import SWMansionIcon from '../SWMansionIcon.react'; import { updateNavInfoActionType } from '../types/nav-types'; import css from './left-layout-aside.css'; import NavigationPanel from './navigation-panel.react'; function AppSwitcher(): React.Node { const activeChatThreadID = useSelector( state => state.navInfo.activeChatThreadID, ); const mostRecentlyReadThread = useSelector(mostRecentlyReadThreadSelector); - const activeThreadCurrentlyUnread = useSelector( + const isActiveThreadCurrentlyUnread = useSelector( state => !activeChatThreadID || !!state.threadStore.threadInfos[activeChatThreadID]?.currentUser.unread, ); const dispatch = useDispatch(); const onClickChat = React.useCallback( (event: SyntheticEvent) => { event.preventDefault(); dispatch({ type: updateNavInfoActionType, payload: { tab: 'chat', - activeChatThreadID: activeThreadCurrentlyUnread + activeChatThreadID: isActiveThreadCurrentlyUnread ? mostRecentlyReadThread : activeChatThreadID, }, }); }, [ dispatch, - activeThreadCurrentlyUnread, + isActiveThreadCurrentlyUnread, mostRecentlyReadThread, activeChatThreadID, ], ); - const viewerID = useSelector( - state => state.currentUserInfo && state.currentUserInfo.id, - ); - const boundUnreadCount = useSelector(unreadCount); - invariant(viewerID, 'should be set'); let chatBadge = null; if (boundUnreadCount > 0) { chatBadge = {boundUnreadCount}; } const chatNavigationItem = React.useMemo( () => (

{chatBadge} Chat

), [chatBadge, onClickChat], ); const onClickCalendar = React.useCallback( (event: SyntheticEvent) => { event.preventDefault(); dispatch({ type: updateNavInfoActionType, payload: { tab: 'calendar' }, }); }, [dispatch], ); const isCalendarEnabled = useSelector(state => state.enabledApps.calendar); const calendarNavigationItem = React.useMemo(() => { if (!isCalendarEnabled) { return null; } return (

Calendar

); }, [isCalendarEnabled, onClickCalendar]); const onClickApps = React.useCallback( (event: SyntheticEvent) => { event.preventDefault(); dispatch({ type: updateNavInfoActionType, payload: { tab: 'apps', }, }); }, [dispatch], ); const appNavigationItem = React.useMemo( () => (

Apps

), [onClickApps], ); return ( {chatNavigationItem} {calendarNavigationItem} {appNavigationItem} ); } export default AppSwitcher;