- add globalThreadsTab to SYSTEM_IDENTIFIERS (#6841)

- save the lastview globalThreadsTab to the database after unmounting the
threads view
- default to all on first opening of the threads view
This commit is contained in:
Jason Frerich 2022-12-07 07:04:19 -06:00 committed by GitHub
parent 506ab06638
commit 36fe93f182
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 135 additions and 80 deletions

View file

@ -89,6 +89,21 @@ export async function setLastServerVersionCheck(serverUrl: string, reset = false
}
}
export async function setGlobalThreadsTab(serverUrl: string, globalThreadsTab: GlobalThreadsTab) {
try {
const {operator} = DatabaseManager.getServerDatabaseAndOperator(serverUrl);
await operator.handleSystem({
systems: [{
id: SYSTEM_IDENTIFIERS.GLOBAL_THREADS_TAB,
value: globalThreadsTab,
}],
prepareRecordsOnly: false,
});
} catch (error) {
logError('setGlobalThreadsTab', error);
}
}
export async function dismissAnnouncement(serverUrl: string, announcementText: string) {
try {
const {operator} = DatabaseManager.getServerDatabaseAndOperator(serverUrl);

View file

@ -59,6 +59,7 @@ export const SYSTEM_IDENTIFIERS = {
CURRENT_USER_ID: 'currentUserId',
DATA_RETENTION_POLICIES: 'dataRetentionPolicies',
EXPANDED_LINKS: 'expandedLinks',
GLOBAL_THREADS_TAB: 'globalThreadsTab',
LAST_DISMISSED_BANNER: 'lastDismissedBanner',
LAST_SERVER_VERSION_CHECK: 'LastServerVersionCheck',
LICENSE: 'license',

View file

@ -77,6 +77,13 @@ export const observeCurrentUserId = (database: Database): Observable<string> =>
);
};
export const observeGlobalThreadsTab = (database: Database): Observable<string> => {
return querySystemValue(database, SYSTEM_IDENTIFIERS.GLOBAL_THREADS_TAB).observe().pipe(
switchMap((result) => (result.length ? result[0].observe() : of$({value: 'all'}))),
switchMap((model) => of$(model.value)),
);
};
export const getPushVerificationStatus = async (serverDatabase: Database): Promise<string> => {
try {
const status = await serverDatabase.get<SystemModel>(SYSTEM).find(SYSTEM_IDENTIFIERS.PUSH_VERIFICATION_STATUS);

View file

@ -0,0 +1,102 @@
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react';
import {useIntl} from 'react-intl';
import {Keyboard, StyleSheet, View} from 'react-native';
import {Edge, SafeAreaView} from 'react-native-safe-area-context';
import {setGlobalThreadsTab} from '@actions/local/systems';
import NavigationHeader from '@components/navigation_header';
import RoundedHeaderContext from '@components/rounded_header_context';
import {useServerUrl} from '@context/server';
import {useAppState, useIsTablet} from '@hooks/device';
import {useDefaultHeaderHeight} from '@hooks/header';
import {useTeamSwitch} from '@hooks/team_switch';
import {popTopScreen} from '@screens/navigation';
import ThreadsList from './threads_list';
type Props = {
componentId?: string;
globalThreadsTab: GlobalThreadsTab;
};
const edges: Edge[] = ['left', 'right'];
const styles = StyleSheet.create({
flex: {
flex: 1,
},
});
const GlobalThreads = ({componentId, globalThreadsTab}: Props) => {
const appState = useAppState();
const serverUrl = useServerUrl();
const intl = useIntl();
const switchingTeam = useTeamSwitch();
const isTablet = useIsTablet();
const defaultHeight = useDefaultHeaderHeight();
const [tab, setTab] = useState<GlobalThreadsTab>(globalThreadsTab);
const mounted = useRef(false);
const containerStyle = useMemo(() => {
const marginTop = defaultHeight;
return {flex: 1, marginTop};
}, [defaultHeight]);
useEffect(() => {
mounted.current = true;
return () => {
setGlobalThreadsTab(serverUrl, tab);
mounted.current = false;
};
}, [serverUrl, tab]);
const contextStyle = useMemo(() => ({
top: defaultHeight,
}), [defaultHeight]);
const onBackPress = useCallback(() => {
Keyboard.dismiss();
popTopScreen(componentId);
}, [componentId]);
return (
<SafeAreaView
edges={edges}
mode='margin'
style={styles.flex}
testID='global_threads.screen'
>
<NavigationHeader
showBackButton={!isTablet}
isLargeTitle={false}
onBackPress={onBackPress}
title={
intl.formatMessage({
id: 'threads',
defaultMessage: 'Threads',
})
}
/>
<View style={contextStyle}>
<RoundedHeaderContext/>
</View>
{!switchingTeam &&
<View style={containerStyle}>
<ThreadsList
forceQueryAfterAppState={appState}
setTab={setTab}
tab={tab}
testID={'global_threads.threads_list'}
/>
</View>
}
</SafeAreaView>
);
};
export default GlobalThreads;

View file

@ -1,89 +1,19 @@
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import React, {useCallback, useMemo, useState} from 'react';
import {useIntl} from 'react-intl';
import {Keyboard, StyleSheet, View} from 'react-native';
import {Edge, SafeAreaView} from 'react-native-safe-area-context';
import {withDatabase} from '@nozbe/watermelondb/DatabaseProvider';
import withObservables from '@nozbe/with-observables';
import NavigationHeader from '@components/navigation_header';
import RoundedHeaderContext from '@components/rounded_header_context';
import {useAppState, useIsTablet} from '@hooks/device';
import {useDefaultHeaderHeight} from '@hooks/header';
import {useTeamSwitch} from '@hooks/team_switch';
import {popTopScreen} from '@screens/navigation';
import {observeGlobalThreadsTab} from '@queries/servers/system';
import ThreadsList from './threads_list';
import GlobalThreads from './global_threads';
type Props = {
componentId?: string;
};
import type {WithDatabaseArgs} from '@typings/database/database';
const edges: Edge[] = ['left', 'right'];
const styles = StyleSheet.create({
flex: {
flex: 1,
},
const enhanced = withObservables([], ({database}: WithDatabaseArgs) => {
return {
globalThreadsTab: observeGlobalThreadsTab(database),
};
});
const GlobalThreads = ({componentId}: Props) => {
const appState = useAppState();
const intl = useIntl();
const switchingTeam = useTeamSwitch();
const isTablet = useIsTablet();
const defaultHeight = useDefaultHeaderHeight();
const [tab, setTab] = useState<GlobalThreadsTab>('all');
const containerStyle = useMemo(() => {
const marginTop = defaultHeight;
return {flex: 1, marginTop};
}, [defaultHeight]);
const contextStyle = useMemo(() => ({
top: defaultHeight,
}), [defaultHeight]);
const onBackPress = useCallback(() => {
Keyboard.dismiss();
popTopScreen(componentId);
}, [componentId]);
return (
<SafeAreaView
edges={edges}
mode='margin'
style={styles.flex}
testID='global_threads.screen'
>
<NavigationHeader
showBackButton={!isTablet}
isLargeTitle={false}
onBackPress={onBackPress}
title={
intl.formatMessage({
id: 'threads',
defaultMessage: 'Threads',
})
}
/>
<View style={contextStyle}>
<RoundedHeaderContext/>
</View>
{!switchingTeam &&
<View style={containerStyle}>
<ThreadsList
forceQueryAfterAppState={appState}
setTab={setTab}
tab={tab}
testID={'global_threads.threads_list'}
/>
</View>
}
</SafeAreaView>
);
};
export default GlobalThreads;
export default withDatabase(enhanced(GlobalThreads));