From da7ba8d479298676083af4a1a61ee681e0f2c3d1 Mon Sep 17 00:00:00 2001 From: Nouman Tahir Date: Tue, 17 Oct 2023 15:29:34 +0500 Subject: [PATCH] checking new waves on tab reactive --- src/screens/waves/screen/wavesScreen.tsx | 35 ++++++++++++++++++------ 1 file changed, 27 insertions(+), 8 deletions(-) diff --git a/src/screens/waves/screen/wavesScreen.tsx b/src/screens/waves/screen/wavesScreen.tsx index ecaa2f072..86444ef8b 100644 --- a/src/screens/waves/screen/wavesScreen.tsx +++ b/src/screens/waves/screen/wavesScreen.tsx @@ -1,5 +1,5 @@ import React, { useEffect, useRef, useState } from 'react'; -import { ActivityIndicator, NativeScrollEvent, NativeSyntheticEvent, RefreshControl, View, FlatList, AppState, Alert } from 'react-native'; +import { ActivityIndicator, NativeScrollEvent, NativeSyntheticEvent, RefreshControl, View, FlatList, AppState } from 'react-native'; import { Comments, EmptyScreen, Header, PostOptionsModal } from '../../../components'; import styles from '../styles/wavesScreen.styles'; import { wavesQueries } from '../../../providers/queries'; @@ -8,29 +8,34 @@ import WavesHeader from '../children/wavesHeader'; import { PostTypes } from '../../../constants/postTypes'; import ScrollTopPopup from '../../../components/tabbedPosts/view/scrollTopPopup'; import { debounce } from 'lodash'; -import reactotron from 'reactotron-react-native'; +import { useNavigationState } from '@react-navigation/native'; const SCROLL_POPUP_THRESHOLD = 5000; -const WavesScreen = () => { +const WavesScreen = ({ route }) => { //refs const postOptionsModalRef = useRef(null); const postsListRef = useRef(); const blockPopupRef = useRef(false); const scrollOffsetRef = useRef(0); const appState = useRef(AppState.currentState); + const isFirstRender = useRef(true); const wavesQuery = wavesQueries.useWavesQuery('ecency.waves'); const isDarkTheme = useAppSelector(state => state.application.isDarkTheme) + const navState = useNavigationState(state => state); + const [enableScrollTop, setEnableScrollTop] = useState(false); const [popupAvatars, setPopupAvatars] = useState([]) + useEffect(() => { + const _stateSub = AppState.addEventListener('change', _handleAppStateChange); return () => { _stateSub.remove(); @@ -38,6 +43,15 @@ const WavesScreen = () => { }, []) + useEffect(() => { + if (navState.routeNames[navState.index] === route.name && !isFirstRender.current) { + _latestWavesCheck(); + } + isFirstRender.current = false; + }, [navState.index]) + + + //actions const _handleAppStateChange = async (nextAppState) => { @@ -45,16 +59,21 @@ const WavesScreen = () => { appState.current.match(/inactive|background/) && nextAppState === 'active' ) { - const latestWaves = await wavesQuery.latestWavesFetch() - if (latestWaves.length > 0) { - setPopupAvatars(latestWaves.map((item) => item.avatar)) - setEnableScrollTop(true) - } + _latestWavesCheck() } appState.current = nextAppState; }; + + const _latestWavesCheck = async () => { + const latestWaves = await wavesQuery.latestWavesFetch() + if (latestWaves.length > 0) { + setPopupAvatars(latestWaves.map((item) => item.avatar)) + setEnableScrollTop(true) + } + } + const _fetchData = (fetchProps: any) => { if (fetchProps?.refresh) { wavesQuery.refresh();