From 6dcefaf1e4332142d2722123ae6f3ec0842593b9 Mon Sep 17 00:00:00 2001 From: Aditya Pratap Singh Hada <49001649+apshada@users.noreply.github.com> Date: Tue, 16 Apr 2024 15:59:59 +0530 Subject: [PATCH] [MM-56585]Show only unreads filter stays active after changing the 'Group unreads' setting (#7790) * showing unread and threads, of group unread setting in on * using third variable to maintain state for showing categories * removed useState from useMemo * Removed state, return orderctegroies if onlyUnreads & unreadsOnTop is true * test cases updates * removed onlyUnreads props from threads * removed onlyUnreads * test cases updated * removed unnecessary changes * removed onlyUnreads from dep --------- Co-authored-by: Mattermost Build --- .../threads_button.test.tsx.snap | 95 ------------------- app/components/threads_button/index.ts | 13 +-- .../threads_button/threads_button.test.tsx | 25 ----- .../threads_button/threads_button.tsx | 8 -- .../categories_list/categories/categories.tsx | 18 ++-- 5 files changed, 12 insertions(+), 147 deletions(-) diff --git a/app/components/threads_button/__snapshots__/threads_button.test.tsx.snap b/app/components/threads_button/__snapshots__/threads_button.test.tsx.snap index f487a6ac2..1c1a7389b 100644 --- a/app/components/threads_button/__snapshots__/threads_button.test.tsx.snap +++ b/app/components/threads_button/__snapshots__/threads_button.test.tsx.snap @@ -189,98 +189,3 @@ exports[`Thread item in the channel list Threads Component should match snapshot `; - -exports[`Thread item in the channel list Threads Component should match snapshot with only unreads filter 1`] = `null`; - -exports[`Thread item in the channel list Threads Component should match snapshot, groupUnreadsSeparately false, always show 1`] = ` - - - - - Threads - - - -`; diff --git a/app/components/threads_button/index.ts b/app/components/threads_button/index.ts index d63e44ddb..847b1272e 100644 --- a/app/components/threads_button/index.ts +++ b/app/components/threads_button/index.ts @@ -2,31 +2,20 @@ // See LICENSE.txt for license information. import {withDatabase, withObservables} from '@nozbe/watermelondb/react'; -import {of as of$} from 'rxjs'; import {switchMap} from 'rxjs/operators'; -import Preferences from '@constants/preferences'; -import {getSidebarPreferenceAsBool} from '@helpers/api/preference'; -import {querySidebarPreferences} from '@queries/servers/preference'; -import {observeCurrentChannelId, observeCurrentTeamId, observeOnlyUnreads} from '@queries/servers/system'; +import {observeCurrentChannelId, observeCurrentTeamId} from '@queries/servers/system'; import {observeUnreadsAndMentionsInTeam} from '@queries/servers/thread'; import ThreadsButton from './threads_button'; import type {WithDatabaseArgs} from '@typings/database/database'; -import type PreferenceModel from '@typings/database/models/servers/preference'; const enhanced = withObservables([], ({database}: WithDatabaseArgs) => { const currentTeamId = observeCurrentTeamId(database); return { currentChannelId: observeCurrentChannelId(database), - groupUnreadsSeparately: querySidebarPreferences(database, Preferences.CHANNEL_SIDEBAR_GROUP_UNREADS). - observeWithColumns(['value']). - pipe( - switchMap((prefs: PreferenceModel[]) => of$(getSidebarPreferenceAsBool(prefs, Preferences.CHANNEL_SIDEBAR_GROUP_UNREADS))), - ), - onlyUnreads: observeOnlyUnreads(database), unreadsAndMentions: currentTeamId.pipe( switchMap( (teamId) => observeUnreadsAndMentionsInTeam(database, teamId), diff --git a/app/components/threads_button/threads_button.test.tsx b/app/components/threads_button/threads_button.test.tsx index ebea2b58f..0ea6bb03d 100644 --- a/app/components/threads_button/threads_button.test.tsx +++ b/app/components/threads_button/threads_button.test.tsx @@ -9,8 +9,6 @@ import Threads from './threads_button'; const baseProps = { currentChannelId: 'someChannelId', - groupUnreadsSeparately: true, - onlyUnreads: false, unreadsAndMentions: { unreads: false, mentions: 0, @@ -25,17 +23,6 @@ describe('Thread item in the channel list', () => { expect(toJSON()).toMatchSnapshot(); }); - test('Threads Component should match snapshot with only unreads filter', () => { - const {toJSON} = renderWithIntlAndTheme( - , - ); - - expect(toJSON()).toMatchSnapshot(); - }); - test('Threads Component should match snapshot with onCenterBg', () => { const {toJSON} = renderWithIntlAndTheme( { expect(toJSON()).toMatchSnapshot(); }); - - test('Threads Component should match snapshot, groupUnreadsSeparately false, always show', () => { - const {toJSON} = renderWithIntlAndTheme( - , - ); - - expect(toJSON()).toMatchSnapshot(); - }); }); diff --git a/app/components/threads_button/threads_button.tsx b/app/components/threads_button/threads_button.tsx index 6a150cbae..4bf53b7ff 100644 --- a/app/components/threads_button/threads_button.tsx +++ b/app/components/threads_button/threads_button.tsx @@ -39,9 +39,7 @@ const getStyleSheet = makeStyleSheetFromTheme((theme: Theme) => ({ type Props = { currentChannelId: string; - groupUnreadsSeparately: boolean; onCenterBg?: boolean; - onlyUnreads: boolean; onPress?: () => void; shouldHighlighActive?: boolean; unreadsAndMentions: { @@ -53,9 +51,7 @@ type Props = { const ThreadsButton = ({ currentChannelId, - groupUnreadsSeparately, onCenterBg, - onlyUnreads, onPress, unreadsAndMentions, shouldHighlighActive = false, @@ -113,10 +109,6 @@ const ThreadsButton = ({ return [container, icon, text, badge]; }, [customStyles, isActive, onCenterBg, styles, unreads, isOnHome]); - if (groupUnreadsSeparately && (onlyUnreads && !isActive && !unreads && !mentions)) { - return null; - } - return ( { - if (onlyUnreads && !unreadsOnTop) { + if (showOnlyUnreadsCategory) { return ['UNREADS' as const]; } + const orderedCategories = [...categories]; orderedCategories.sort((a, b) => a.sortOrder - b.sortOrder); + if (unreadsOnTop) { return ['UNREADS' as const, ...orderedCategories]; } return orderedCategories; - }, [categories, onlyUnreads, unreadsOnTop]); + }, [categories, unreadsOnTop, showOnlyUnreadsCategory]); const [initiaLoad, setInitialLoad] = useState(!categoriesToShow.length); @@ -74,7 +78,7 @@ const Categories = ({ currentTeamId={teamId} isTablet={isTablet} onChannelSwitch={onChannelSwitch} - onlyUnreads={onlyUnreads} + onlyUnreads={showOnlyUnreadsCategory} /> ); } @@ -89,7 +93,7 @@ const Categories = ({ /> ); - }, [teamId, intl.locale, isTablet, onChannelSwitch, onlyUnreads]); + }, [teamId, intl.locale, isTablet, onChannelSwitch, showOnlyUnreadsCategory]); useEffect(() => { const t = setTimeout(() => { @@ -105,17 +109,17 @@ const Categories = ({ return ( <> - {!switchingTeam && !initiaLoad && onlyUnreads && + {!switchingTeam && !initiaLoad && showOnlyUnreadsCategory && } - {!switchingTeam && !initiaLoad && !onlyUnreads && ( + {!switchingTeam && !initiaLoad && !showOnlyUnreadsCategory && (