diff --git a/app/actions/local/systems.ts b/app/actions/local/systems.ts index 0a463a1c1..070e4c807 100644 --- a/app/actions/local/systems.ts +++ b/app/actions/local/systems.ts @@ -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); diff --git a/app/constants/database.ts b/app/constants/database.ts index 6dd371065..67bab033c 100644 --- a/app/constants/database.ts +++ b/app/constants/database.ts @@ -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', diff --git a/app/queries/servers/system.ts b/app/queries/servers/system.ts index 0155f1d55..2780a9e27 100644 --- a/app/queries/servers/system.ts +++ b/app/queries/servers/system.ts @@ -77,6 +77,13 @@ export const observeCurrentUserId = (database: Database): Observable => ); }; +export const observeGlobalThreadsTab = (database: Database): Observable => { + 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 => { try { const status = await serverDatabase.get(SYSTEM).find(SYSTEM_IDENTIFIERS.PUSH_VERIFICATION_STATUS); diff --git a/app/screens/global_threads/global_threads.tsx b/app/screens/global_threads/global_threads.tsx new file mode 100644 index 000000000..695dc45ac --- /dev/null +++ b/app/screens/global_threads/global_threads.tsx @@ -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); + 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 ( + + + + + + {!switchingTeam && + + + + } + + ); +}; + +export default GlobalThreads; diff --git a/app/screens/global_threads/index.tsx b/app/screens/global_threads/index.tsx index 56f0510e6..7b9cbbe2f 100644 --- a/app/screens/global_threads/index.tsx +++ b/app/screens/global_threads/index.tsx @@ -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('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 ( - - - - - - {!switchingTeam && - - - - } - - ); -}; - -export default GlobalThreads; +export default withDatabase(enhanced(GlobalThreads));