From 9a13fe50cc4b81c389679750d496ceee1a759653 Mon Sep 17 00:00:00 2001
From: Cooper Edmunds <cooper6789@gmail.com>
Date: Fri, 1 Dec 2023 15:02:42 -0500
Subject: [PATCH 1/2] Use lastActiveTab from AsyncStorage for non-desktop
---
src/view/screens/Home.tsx | 40 ++++++++++++++++++++++++++++++++++++---
1 file changed, 37 insertions(+), 3 deletions(-)
diff --git a/src/view/screens/Home.tsx b/src/view/screens/Home.tsx
index e5a3035a..025a0b15 100644
--- a/src/view/screens/Home.tsx
+++ b/src/view/screens/Home.tsx
@@ -14,13 +14,43 @@ import {usePreferencesQuery} from '#/state/queries/preferences'
import {UsePreferencesQueryResponse} from '#/state/queries/preferences/types'
import {emitSoftReset} from '#/state/events'
import {useSession} from '#/state/session'
+import {save, load} from '#/lib/storage'
+import {useWebMediaQueries} from '#/lib/hooks/useWebMediaQueries'
type Props = NativeStackScreenProps<HomeTabNavigatorParams, 'Home'>
export function HomeScreen(props: Props) {
const {data: preferences} = usePreferencesQuery()
+ const {isDesktop} = useWebMediaQueries()
+ const [lastActiveTab, setLastActiveTab] = React.useState<number | undefined>(
+ undefined,
+ )
- if (preferences) {
- return <HomeScreenReady {...props} preferences={preferences} />
+ React.useEffect(() => {
+ const loadLastActieTab = async () => {
+ try {
+ const savedTab = await load('lastActiveTab')
+ const tabIndex = savedTab ? parseInt(savedTab, 10) : 0
+ setLastActiveTab(tabIndex)
+ } catch {
+ setLastActiveTab(0)
+ }
+ }
+ // Ignoring lastActiveTab for desktop
+ if (isDesktop) {
+ setLastActiveTab(0)
+ } else {
+ loadLastActieTab()
+ }
+ }, [isDesktop])
+
+ if (preferences && lastActiveTab !== undefined) {
+ return (
+ <HomeScreenReady
+ {...props}
+ preferences={preferences}
+ lastActiveTab={lastActiveTab}
+ />
+ )
} else {
return (
<View style={styles.loading}>
@@ -32,13 +62,15 @@ export function HomeScreen(props: Props) {
function HomeScreenReady({
preferences,
+ lastActiveTab,
}: Props & {
preferences: UsePreferencesQueryResponse
+ lastActiveTab: number
}) {
const {hasSession} = useSession()
const setMinimalShellMode = useSetMinimalShellMode()
const setDrawerSwipeDisabled = useSetDrawerSwipeDisabled()
- const [selectedPage, setSelectedPage] = React.useState(0)
+ const [selectedPage, setSelectedPage] = React.useState(lastActiveTab)
/**
* Used to ensure that we re-compute `customFeeds` AND force a re-render of
@@ -80,6 +112,7 @@ function HomeScreenReady({
(index: number) => {
setMinimalShellMode(false)
setSelectedPage(index)
+ save('lastActiveTab', index)
setDrawerSwipeDisabled(index > 0)
},
[setDrawerSwipeDisabled, setSelectedPage, setMinimalShellMode],
@@ -125,6 +158,7 @@ function HomeScreenReady({
<Pager
key={pinnedFeedOrderKey}
testID="homeScreen"
+ initialPage={selectedPage > customFeeds.length ? 0 : selectedPage}
onPageSelected={onPageSelected}
onPageScrollStateChanged={onPageScrollStateChanged}
renderTabBar={renderTabBar}
From 17c58d40ffe6a5532b5436f1a2bd2c9dc85fd8a0 Mon Sep 17 00:00:00 2001
From: Cooper Edmunds <cooper6789@gmail.com>
Date: Mon, 4 Dec 2023 16:10:03 -0500
Subject: [PATCH 2/2] Track active page using string instead of index
---
src/view/screens/Home.tsx | 62 ++++++++++++++++++++++-----------------
1 file changed, 35 insertions(+), 27 deletions(-)
diff --git a/src/view/screens/Home.tsx b/src/view/screens/Home.tsx
index 025a0b15..6100d42d 100644
--- a/src/view/screens/Home.tsx
+++ b/src/view/screens/Home.tsx
@@ -14,41 +14,36 @@ import {usePreferencesQuery} from '#/state/queries/preferences'
import {UsePreferencesQueryResponse} from '#/state/queries/preferences/types'
import {emitSoftReset} from '#/state/events'
import {useSession} from '#/state/session'
-import {save, load} from '#/lib/storage'
+import {loadString, saveString} from '#/lib/storage'
import {useWebMediaQueries} from '#/lib/hooks/useWebMediaQueries'
type Props = NativeStackScreenProps<HomeTabNavigatorParams, 'Home'>
export function HomeScreen(props: Props) {
const {data: preferences} = usePreferencesQuery()
const {isDesktop} = useWebMediaQueries()
- const [lastActiveTab, setLastActiveTab] = React.useState<number | undefined>(
+ const [initialPage, setInitialPage] = React.useState<string | undefined>(
undefined,
)
React.useEffect(() => {
- const loadLastActieTab = async () => {
+ const loadLastActivePage = async () => {
try {
- const savedTab = await load('lastActiveTab')
- const tabIndex = savedTab ? parseInt(savedTab, 10) : 0
- setLastActiveTab(tabIndex)
+ const lastActivePage =
+ (await loadString('lastActivePage')) ?? 'Following'
+ setInitialPage(lastActivePage)
} catch {
- setLastActiveTab(0)
+ setInitialPage('Following')
}
}
- // Ignoring lastActiveTab for desktop
- if (isDesktop) {
- setLastActiveTab(0)
- } else {
- loadLastActieTab()
- }
- }, [isDesktop])
+ loadLastActivePage()
+ }, [])
- if (preferences && lastActiveTab !== undefined) {
+ if (preferences && initialPage !== undefined) {
return (
<HomeScreenReady
{...props}
preferences={preferences}
- lastActiveTab={lastActiveTab}
+ initialPage={isDesktop ? 'Following' : initialPage}
/>
)
} else {
@@ -62,15 +57,15 @@ export function HomeScreen(props: Props) {
function HomeScreenReady({
preferences,
- lastActiveTab,
+ initialPage,
}: Props & {
preferences: UsePreferencesQueryResponse
- lastActiveTab: number
+ initialPage: string
}) {
const {hasSession} = useSession()
const setMinimalShellMode = useSetMinimalShellMode()
const setDrawerSwipeDisabled = useSetDrawerSwipeDisabled()
- const [selectedPage, setSelectedPage] = React.useState(lastActiveTab)
+ const [selectedPage, setSelectedPage] = React.useState<string>(initialPage)
/**
* Used to ensure that we re-compute `customFeeds` AND force a re-render of
@@ -78,6 +73,13 @@ function HomeScreenReady({
*/
const pinnedFeedOrderKey = JSON.stringify(preferences.feeds.pinned)
+ const selectedPageIndex = React.useMemo(() => {
+ const index = ['Following', ...preferences.feeds.pinned].indexOf(
+ selectedPage,
+ )
+ return Math.max(index, 0)
+ }, [preferences.feeds.pinned, selectedPage])
+
const customFeeds = React.useMemo(() => {
const pinned = preferences.feeds.pinned
const feeds: FeedDescriptor[] = []
@@ -101,21 +103,27 @@ function HomeScreenReady({
useFocusEffect(
React.useCallback(() => {
setMinimalShellMode(false)
- setDrawerSwipeDisabled(selectedPage > 0)
+ setDrawerSwipeDisabled(selectedPageIndex > 0)
return () => {
setDrawerSwipeDisabled(false)
}
- }, [setDrawerSwipeDisabled, selectedPage, setMinimalShellMode]),
+ }, [setDrawerSwipeDisabled, selectedPageIndex, setMinimalShellMode]),
)
const onPageSelected = React.useCallback(
(index: number) => {
setMinimalShellMode(false)
- setSelectedPage(index)
- save('lastActiveTab', index)
setDrawerSwipeDisabled(index > 0)
+ const page = ['Following', ...preferences.feeds.pinned][index]
+ setSelectedPage(page)
+ saveString('lastActivePage', page)
},
- [setDrawerSwipeDisabled, setSelectedPage, setMinimalShellMode],
+ [
+ setDrawerSwipeDisabled,
+ setSelectedPage,
+ setMinimalShellMode,
+ preferences.feeds.pinned,
+ ],
)
const onPressSelected = React.useCallback(() => {
@@ -158,7 +166,7 @@ function HomeScreenReady({
<Pager
key={pinnedFeedOrderKey}
testID="homeScreen"
- initialPage={selectedPage > customFeeds.length ? 0 : selectedPage}
+ initialPage={selectedPageIndex}
onPageSelected={onPageSelected}
onPageScrollStateChanged={onPageScrollStateChanged}
renderTabBar={renderTabBar}
@@ -166,7 +174,7 @@ function HomeScreenReady({
<FeedPage
key="1"
testID="followingFeedPage"
- isPageFocused={selectedPage === 0}
+ isPageFocused={selectedPageIndex === 0}
feed={homeFeedParams.mergeFeedEnabled ? 'home' : 'following'}
feedParams={homeFeedParams}
renderEmptyState={renderFollowingEmptyState}
@@ -177,7 +185,7 @@ function HomeScreenReady({
<FeedPage
key={f}
testID="customFeedPage"
- isPageFocused={selectedPage === 1 + index}
+ isPageFocused={selectedPageIndex === 1 + index}
feed={f}
renderEmptyState={renderCustomFeedEmptyState}
/>