[Gekidou MM-45046] Always show threads button when filtered and unfiltered (#6635)

This commit is contained in:
Jason Frerich
2022-09-13 17:38:39 -05:00
committed by GitHub
parent a98c3d5d3a
commit 94f1598455
4 changed files with 119 additions and 16 deletions

View File

@@ -83,3 +83,85 @@ 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`] = `
<View
accessible={true}
collapsable={false}
focusable={true}
onClick={[Function]}
onResponderGrant={[Function]}
onResponderMove={[Function]}
onResponderRelease={[Function]}
onResponderTerminate={[Function]}
onResponderTerminationRequest={[Function]}
onStartShouldSetResponder={[Function]}
style={
Object {
"opacity": 1,
}
}
testID="channel_list.threads.button"
>
<View
style={
Object {
"marginLeft": -18,
"marginRight": -20,
}
}
>
<View
style={
Array [
Object {
"alignItems": "center",
"flexDirection": "row",
"minHeight": 40,
"paddingHorizontal": 20,
},
undefined,
]
}
>
<Icon
name="message-text-outline"
style={
Array [
Object {
"color": "rgba(255,255,255,0.5)",
"fontSize": 24,
},
undefined,
]
}
/>
<Text
style={
Array [
Object {
"flex": 1,
},
Object {
"fontFamily": "OpenSans",
"fontSize": 16,
"fontWeight": "400",
"lineHeight": 24,
},
Object {
"color": "rgba(255,255,255,0.72)",
"marginTop": -1,
"paddingLeft": 12,
"paddingRight": 20,
},
undefined,
undefined,
]
}
>
Threads
</Text>
</View>
</View>
</View>
`;

View File

@@ -3,8 +3,13 @@
import {withDatabase} from '@nozbe/watermelondb/DatabaseProvider';
import withObservables from '@nozbe/with-observables';
import {of as of$} from 'rxjs';
import {switchMap} from 'rxjs/operators';
import Preferences from '@app/constants/preferences';
import {PreferenceModel} from '@app/database/models/server';
import {queryPreferencesByCategoryAndName} from '@app/queries/servers/preference';
import {getPreferenceAsBool} from '@helpers/api/preference';
import {observeCurrentChannelId, observeCurrentTeamId, observeOnlyUnreads} from '@queries/servers/system';
import {observeUnreadsAndMentionsInTeam} from '@queries/servers/thread';
@@ -17,6 +22,11 @@ const enhanced = withObservables([], ({database}: WithDatabaseArgs) => {
return {
currentChannelId: observeCurrentChannelId(database),
groupUnreadsSeparately: queryPreferencesByCategoryAndName(database, Preferences.CATEGORY_SIDEBAR_SETTINGS, Preferences.CHANNEL_SIDEBAR_GROUP_UNREADS).
observeWithColumns(['value']).
pipe(
switchMap((prefs: PreferenceModel[]) => of$(getPreferenceAsBool(prefs, Preferences.CATEGORY_SIDEBAR_SETTINGS, Preferences.CHANNEL_SIDEBAR_GROUP_UNREADS, false))),
),
onlyUnreads: observeOnlyUnreads(database),
unreadsAndMentions: currentTeamId.pipe(
switchMap(

View File

@@ -7,31 +7,41 @@ import {renderWithIntlAndTheme} from '@test/intl-test-helper';
import Threads from './threads_button';
const baseProps = {
currentChannelId: 'someChannelId',
groupUnreadsSeparately: true,
onlyUnreads: false,
unreadsAndMentions: {
unreads: false,
mentions: 0,
},
};
describe('Thread item in the channel list', () => {
test('Threads Component should match snapshot', () => {
const {toJSON} = renderWithIntlAndTheme(
<Threads
currentChannelId='someChannelId'
onlyUnreads={false}
unreadsAndMentions={{
unreads: false,
mentions: 0,
}}
/>,
<Threads {...baseProps}/>,
);
expect(toJSON()).toMatchSnapshot();
});
test('Threads Component should match snapshot with only unreads filter', () => {
const {toJSON} = renderWithIntlAndTheme(
<Threads
currentChannelId='someChannelId'
{...baseProps}
onlyUnreads={true}
/>,
);
expect(toJSON()).toMatchSnapshot();
});
test('Threads Component should match snapshot, groupUnreadsSeparately false, always show', () => {
const {toJSON} = renderWithIntlAndTheme(
<Threads
{...baseProps}
groupUnreadsSeparately={false}
onlyUnreads={true}
unreadsAndMentions={{
unreads: false,
mentions: 0,
}}
/>,
);

View File

@@ -38,13 +38,14 @@ const getStyleSheet = makeStyleSheetFromTheme((theme: Theme) => ({
type Props = {
currentChannelId: string;
onlyUnreads: boolean;
groupUnreadsSeparately: boolean;
unreadsAndMentions: {
unreads: boolean;
mentions: number;
};
};
const ThreadsButton = ({currentChannelId, onlyUnreads, unreadsAndMentions}: Props) => {
const ThreadsButton = ({currentChannelId, groupUnreadsSeparately, onlyUnreads, unreadsAndMentions}: Props) => {
const isTablet = useIsTablet();
const serverUrl = useServerUrl();
@@ -81,7 +82,7 @@ const ThreadsButton = ({currentChannelId, onlyUnreads, unreadsAndMentions}: Prop
return [container, icon, text];
}, [customStyles, isActive, styles, unreads]);
if (onlyUnreads && !isActive && !unreads && !mentions) {
if (groupUnreadsSeparately && (onlyUnreads && !isActive && !unreads && !mentions)) {
return null;
}