Extract shell state into separate context (#1824)

* WIP

* Add shell state

* Integrate new shell state for drawer and minimal shell mode

* Replace isDrawerSwipeDisabled

* Split shell state into separate contexts to avoid needless re-renders

* Fix typo

---------

Co-authored-by: Paul Frazee <pfrazee@gmail.com>
This commit is contained in:
Eric Bailey 2023-11-07 13:37:47 -06:00 committed by GitHub
parent 7158157f5f
commit bfe196bac5
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
51 changed files with 368 additions and 238 deletions

View file

@ -43,11 +43,13 @@ import {NavigationProp} from 'lib/routes/types'
import {useNavigationTabState} from 'lib/hooks/useNavigationTabState'
import {isWeb} from 'platform/detection'
import {formatCount, formatCountShortOnly} from 'view/com/util/numeric/format'
import {useSetDrawerOpen} from '#/state/shell'
export const DrawerContent = observer(function DrawerContentImpl() {
const theme = useTheme()
const pal = usePalette('default')
const store = useStores()
const setDrawerOpen = useSetDrawerOpen()
const navigation = useNavigation<NavigationProp>()
const {track} = useAnalytics()
const {isAtHome, isAtSearch, isAtFeeds, isAtNotifications, isAtMyProfile} =
@ -62,7 +64,7 @@ export const DrawerContent = observer(function DrawerContentImpl() {
(tab: string) => {
track('Menu:ItemClicked', {url: tab})
const state = navigation.getState()
store.shell.closeDrawer()
setDrawerOpen(false)
if (isWeb) {
// hack because we have flat navigator for web and MyProfile does not exist on the web navigator -ansh
if (tab === 'MyProfile') {
@ -83,7 +85,7 @@ export const DrawerContent = observer(function DrawerContentImpl() {
}
}
},
[store, track, navigation],
[store, track, navigation, setDrawerOpen],
)
const onPressHome = React.useCallback(() => onPressTab('Home'), [onPressTab])
@ -110,20 +112,20 @@ export const DrawerContent = observer(function DrawerContentImpl() {
const onPressLists = React.useCallback(() => {
track('Menu:ItemClicked', {url: 'Lists'})
navigation.navigate('Lists')
store.shell.closeDrawer()
}, [navigation, track, store.shell])
setDrawerOpen(false)
}, [navigation, track, setDrawerOpen])
const onPressModeration = React.useCallback(() => {
track('Menu:ItemClicked', {url: 'Moderation'})
navigation.navigate('Moderation')
store.shell.closeDrawer()
}, [navigation, track, store.shell])
setDrawerOpen(false)
}, [navigation, track, setDrawerOpen])
const onPressSettings = React.useCallback(() => {
track('Menu:ItemClicked', {url: 'Settings'})
navigation.navigate('Settings')
store.shell.closeDrawer()
}, [navigation, track, store.shell])
setDrawerOpen(false)
}, [navigation, track, setDrawerOpen])
const onPressFeedback = React.useCallback(() => {
track('Menu:FeedbackClicked')
@ -437,13 +439,14 @@ const InviteCodes = observer(function InviteCodesImpl({
}) {
const {track} = useAnalytics()
const store = useStores()
const setDrawerOpen = useSetDrawerOpen()
const pal = usePalette('default')
const {invitesAvailable} = store.me
const onPress = React.useCallback(() => {
track('Menu:ItemClicked', {url: '#invite-codes'})
store.shell.closeDrawer()
setDrawerOpen(false)
store.shell.openModal({name: 'invite-codes'})
}, [store, track])
}, [store, track, setDrawerOpen])
return (
<TouchableOpacity
testID="menuItemInviteCodes"