From dad579daee6cda7d53845100872cf5a7021d4fc0 Mon Sep 17 00:00:00 2001 From: Harrison Healey Date: Thu, 24 Aug 2023 10:33:47 -0400 Subject: [PATCH] MM-54211 Fix Unreads category being visible with no unread channels (#24334) --- .../src/components/sidebar/sidebar.test.tsx | 149 +++++++++++++++++- .../components/sidebar/unread_channels.tsx | 4 + 2 files changed, 149 insertions(+), 4 deletions(-) diff --git a/webapp/channels/src/components/sidebar/sidebar.test.tsx b/webapp/channels/src/components/sidebar/sidebar.test.tsx index a2e3656ff1..17790bf3ae 100644 --- a/webapp/channels/src/components/sidebar/sidebar.test.tsx +++ b/webapp/channels/src/components/sidebar/sidebar.test.tsx @@ -1,19 +1,30 @@ // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. // See LICENSE.txt for license information. -import React from 'react'; import {shallow} from 'enzyme'; +import React from 'react'; -import Sidebar from 'components/sidebar/sidebar'; -import Constants, {ModalIdentifiers} from '../../utils/constants'; +import {DeepPartial} from '@mattermost/types/utilities'; + +import {Preferences} from 'mattermost-redux/constants'; + +import mergeObjects from 'packages/mattermost-redux/test/merge_objects'; +import {renderWithFullContext, screen} from 'tests/react_testing_utils'; +import type {GlobalState} from 'types/store'; +import Constants, {ModalIdentifiers} from 'utils/constants'; +import {TestHelper} from 'utils/test_helper'; + +import Sidebar from './sidebar'; describe('components/sidebar', () => { + const currentTeamId = 'fake_team_id'; + const baseProps = { canCreatePublicChannel: true, canCreatePrivateChannel: true, canJoinPublicChannel: true, isOpen: false, - teamId: 'fake_team_id', + teamId: currentTeamId, hasSeenModal: true, isCloud: false, unreadFilterEnabled: false, @@ -113,4 +124,134 @@ describe('components/sidebar', () => { expect(wrapper).toMatchSnapshot(); }); + + describe('unreads category', () => { + const currentUserId = 'current_user_id'; + + const channel1 = TestHelper.getChannelMock({id: 'channel1', team_id: currentTeamId}); + const channel2 = TestHelper.getChannelMock({id: 'channel2', team_id: currentTeamId}); + + const baseState: DeepPartial = { + entities: { + channels: { + currentChannelId: channel1.id, + channels: { + channel1, + channel2, + }, + channelsInTeam: { + [currentTeamId]: [channel1.id, channel2.id], + }, + messageCounts: { + channel1: {total: 10}, + channel2: {total: 10}, + }, + myMembers: { + channel1: TestHelper.getChannelMembershipMock({channel_id: channel1.id, user_id: currentUserId, msg_count: 10}), + channel2: TestHelper.getChannelMembershipMock({channel_id: channel2.id, user_id: currentUserId, msg_count: 10}), + }, + }, + teams: { + currentTeamId, + teams: { + [currentTeamId]: TestHelper.getTeamMock({id: currentTeamId}), + }, + }, + users: { + currentUserId, + }, + }, + }; + + test('should not render unreads category when disabled by user preference', () => { + const testState = mergeObjects(baseState, { + entities: { + channels: { + messageCounts: { + [channel2.id]: {total: 15}, + }, + }, + preferences: { + myPreferences: TestHelper.getPreferencesMock([ + {category: Preferences.CATEGORY_SIDEBAR_SETTINGS, name: Preferences.SHOW_UNREAD_SECTION, value: 'false'}, + ]), + }, + }, + }); + + renderWithFullContext( + , + mergeObjects(baseState, testState), + ); + + expect(screen.queryByText('UNREADS')).not.toBeInTheDocument(); + }); + + test('should render unreads category when there are unread channels', () => { + const testState: DeepPartial = { + entities: { + channels: { + messageCounts: { + [channel2.id]: {total: 15}, + }, + }, + preferences: { + myPreferences: TestHelper.getPreferencesMock([ + {category: Preferences.CATEGORY_SIDEBAR_SETTINGS, name: Preferences.SHOW_UNREAD_SECTION, value: 'true'}, + ]), + }, + }, + }; + + renderWithFullContext( + , + mergeObjects(baseState, testState), + ); + + expect(screen.queryByText('UNREADS')).toBeInTheDocument(); + }); + + test('should not render unreads category when there are no unread channels', () => { + const testState: DeepPartial = { + entities: { + preferences: { + myPreferences: TestHelper.getPreferencesMock([ + {category: Preferences.CATEGORY_SIDEBAR_SETTINGS, name: Preferences.SHOW_UNREAD_SECTION, value: 'true'}, + ]), + }, + }, + }; + + renderWithFullContext( + , + mergeObjects(baseState, testState), + ); + + expect(screen.queryByText('UNREADS')).not.toBeInTheDocument(); + }); + + test('should render unreads category when there are no unread channels but the current channel was previously unread', () => { + const testState: DeepPartial = { + entities: { + preferences: { + myPreferences: TestHelper.getPreferencesMock([ + {category: Preferences.CATEGORY_SIDEBAR_SETTINGS, name: Preferences.SHOW_UNREAD_SECTION, value: 'true'}, + ]), + }, + }, + views: { + channel: { + lastUnreadChannel: {id: channel1.id}, + }, + }, + }; + + renderWithFullContext( + , + mergeObjects(baseState, testState), + ); + + expect(screen.queryByText('UNREADS')).toBeInTheDocument(); + }); + }); }); diff --git a/webapp/channels/src/components/sidebar/unread_channels.tsx b/webapp/channels/src/components/sidebar/unread_channels.tsx index 62f9d73fba..fef136b6d8 100644 --- a/webapp/channels/src/components/sidebar/unread_channels.tsx +++ b/webapp/channels/src/components/sidebar/unread_channels.tsx @@ -35,6 +35,10 @@ export default function UnreadChannels({ trackEvent('ui', 'ui_sidebar_category_menu_viewUnreadCategory'); }, [unreadChannels, dispatch]); + if (unreadChannels.length === 0) { + return null; + } + return (