diff options
author | John Fawcett <jrf0110@gmail.com> | 2023-04-12 20:27:55 -0500 |
---|---|---|
committer | GitHub <noreply@github.com> | 2023-04-12 18:27:55 -0700 |
commit | f6769b283fe83d7abbc0545077b3dca978184eed (patch) | |
tree | fab3973591fd0514d290de18f37280baca5563f9 /src/view/com/pager/FeedsTabBar.tsx | |
parent | 2fed6c402159c6084dd481ab87c5e8b034e910ac (diff) | |
download | voidsky-f6769b283fe83d7abbc0545077b3dca978184eed.tar.zst |
Mobile Web (#427)
* WIP * WIP * Fix header offset on web * Remove debug * Fix web mobile feed and FAB layout * Fix modals on mobile web * Remove dead code * Remove ios config that shouldnt be committed now * Move bottom bar into its own folder * Fix web drawer navigation and state behaviors * Remove dark mode toggle from web drawer for now * Fix search on mobile web * Fix the logged out splash screen on mobile web * Fixes to detox simulator --------- Co-authored-by: Paul Frazee <pfrazee@gmail.com>
Diffstat (limited to 'src/view/com/pager/FeedsTabBar.tsx')
-rw-r--r-- | src/view/com/pager/FeedsTabBar.tsx | 70 |
1 files changed, 1 insertions, 69 deletions
diff --git a/src/view/com/pager/FeedsTabBar.tsx b/src/view/com/pager/FeedsTabBar.tsx index 76e0a6fc6..aa0ba7b24 100644 --- a/src/view/com/pager/FeedsTabBar.tsx +++ b/src/view/com/pager/FeedsTabBar.tsx @@ -1,69 +1 @@ -import React from 'react' -import {Animated, StyleSheet, TouchableOpacity} from 'react-native' -import {observer} from 'mobx-react-lite' -import {TabBar} from 'view/com/pager/TabBar' -import {RenderTabBarFnProps} from 'view/com/pager/Pager' -import {UserAvatar} from '../util/UserAvatar' -import {useStores} from 'state/index' -import {usePalette} from 'lib/hooks/usePalette' -import {useAnimatedValue} from 'lib/hooks/useAnimatedValue' - -export const FeedsTabBar = observer( - ( - props: RenderTabBarFnProps & {testID?: string; onPressSelected: () => void}, - ) => { - const store = useStores() - const pal = usePalette('default') - const interp = useAnimatedValue(0) - - React.useEffect(() => { - Animated.timing(interp, { - toValue: store.shell.minimalShellMode ? 1 : 0, - duration: 100, - useNativeDriver: true, - isInteraction: false, - }).start() - }, [interp, store.shell.minimalShellMode]) - const transform = { - transform: [{translateY: Animated.multiply(interp, -100)}], - } - - const onPressAvi = React.useCallback(() => { - store.shell.openDrawer() - }, [store]) - - return ( - <Animated.View style={[pal.view, styles.tabBar, transform]}> - <TouchableOpacity - testID="viewHeaderDrawerBtn" - style={styles.tabBarAvi} - onPress={onPressAvi}> - <UserAvatar avatar={store.me.avatar} size={30} /> - </TouchableOpacity> - <TabBar - {...props} - items={['Following', "What's hot"]} - indicatorPosition="bottom" - indicatorColor={pal.colors.link} - /> - </Animated.View> - ) - }, -) - -const styles = StyleSheet.create({ - tabBar: { - position: 'absolute', - zIndex: 1, - left: 0, - right: 0, - top: 0, - flexDirection: 'row', - alignItems: 'center', - paddingHorizontal: 18, - }, - tabBarAvi: { - marginTop: 1, - marginRight: 18, - }, -}) +export * from './FeedsTabBarMobile' |