diff options
Diffstat (limited to 'src/view/screens')
-rw-r--r-- | src/view/screens/Contacts.tsx | 2 | ||||
-rw-r--r-- | src/view/screens/Debug.tsx | 80 | ||||
-rw-r--r-- | src/view/screens/Home.tsx | 11 | ||||
-rw-r--r-- | src/view/screens/Log.tsx | 4 | ||||
-rw-r--r-- | src/view/screens/Login.tsx | 94 | ||||
-rw-r--r-- | src/view/screens/NotFound.tsx | 23 | ||||
-rw-r--r-- | src/view/screens/Notifications.tsx | 5 | ||||
-rw-r--r-- | src/view/screens/Onboard.tsx | 13 | ||||
-rw-r--r-- | src/view/screens/PostDownvotedBy.tsx | 2 | ||||
-rw-r--r-- | src/view/screens/PostRepostedBy.tsx | 2 | ||||
-rw-r--r-- | src/view/screens/PostThread.tsx | 21 | ||||
-rw-r--r-- | src/view/screens/PostUpvotedBy.tsx | 2 | ||||
-rw-r--r-- | src/view/screens/Profile.tsx | 19 | ||||
-rw-r--r-- | src/view/screens/ProfileFollowers.tsx | 2 | ||||
-rw-r--r-- | src/view/screens/ProfileFollows.tsx | 2 | ||||
-rw-r--r-- | src/view/screens/Search.tsx | 4 | ||||
-rw-r--r-- | src/view/screens/Settings.tsx | 12 |
17 files changed, 146 insertions, 152 deletions
diff --git a/src/view/screens/Contacts.tsx b/src/view/screens/Contacts.tsx index a6cc7244e..cba17f285 100644 --- a/src/view/screens/Contacts.tsx +++ b/src/view/screens/Contacts.tsx @@ -17,7 +17,7 @@ export const Contacts = ({navIdx, visible}: ScreenParams) => { if (visible) { store.nav.setTitle(navIdx, 'Contacts') } - }, [store, visible]) + }, [store, visible, navIdx]) const [searchText, onChangeSearchText] = useState('') const inputRef = useRef<TextInput | null>(null) diff --git a/src/view/screens/Debug.tsx b/src/view/screens/Debug.tsx index f6e2b389c..9365724a0 100644 --- a/src/view/screens/Debug.tsx +++ b/src/view/screens/Debug.tsx @@ -4,6 +4,7 @@ import {ViewHeader} from '../com/util/ViewHeader' import {ThemeProvider} from '../lib/ThemeContext' import {PaletteColorName} from '../lib/ThemeContext' import {usePalette} from '../lib/hooks/usePalette' +import {s} from '../lib/styles' import {Text} from '../com/util/text/Text' import {ViewSelector} from '../com/util/ViewSelector' @@ -48,7 +49,7 @@ function DebugInner({ const renderItem = item => { return ( <View> - <View style={{paddingTop: 10, paddingHorizontal: 10}}> + <View style={[s.pt10, s.pl10, s.pr10]}> <ToggleButton type="default-light" onPress={onToggleColorScheme} @@ -70,7 +71,7 @@ function DebugInner({ const items = [{currentView}] return ( - <View style={[{flex: 1}, pal.view]}> + <View style={[s.h100pct, pal.view]}> <ViewHeader title="Debug panel" /> <ViewSelector swipeEnabled @@ -86,7 +87,7 @@ function DebugInner({ function Heading({label}: {label: string}) { const pal = usePalette('default') return ( - <View style={{paddingTop: 10, paddingBottom: 5}}> + <View style={[s.pt10, s.pb5]}> <Text type="title-lg" style={pal.text}> {label} </Text> @@ -96,7 +97,7 @@ function Heading({label}: {label: string}) { function BaseView() { return ( - <View style={{paddingHorizontal: 10}}> + <View style={[s.pl10, s.pr10]}> <Heading label="Typography" /> <TypographyView /> <Heading label="Palettes" /> @@ -109,14 +110,14 @@ function BaseView() { <EmptyStateView /> <Heading label="Loading placeholders" /> <LoadingPlaceholderView /> - <View style={{height: 200}} /> + <View style={s.footerSpacer} /> </View> ) } function ControlsView() { return ( - <ScrollView style={{paddingHorizontal: 10}}> + <ScrollView style={[s.pl10, s.pr10]}> <Heading label="Buttons" /> <ButtonsView /> <Heading label="Dropdown Buttons" /> @@ -125,15 +126,15 @@ function ControlsView() { <ToggleButtonsView /> <Heading label="Radio Buttons" /> <RadioButtonsView /> - <View style={{height: 200}} /> + <View style={s.footerSpacer} /> </ScrollView> ) } function ErrorView() { return ( - <View style={{padding: 10}}> - <View style={{marginBottom: 5}}> + <View style={s.p10}> + <View style={s.mb5}> <ErrorScreen title="Error screen" message="A major error occurred that led the entire screen to fail" @@ -141,22 +142,22 @@ function ErrorView() { onPressTryAgain={() => {}} /> </View> - <View style={{marginBottom: 5}}> + <View style={s.mb5}> <ErrorMessage message="This is an error that occurred while things were being done" /> </View> - <View style={{marginBottom: 5}}> + <View style={s.mb5}> <ErrorMessage message="This is an error that occurred while things were being done" numberOfLines={1} /> </View> - <View style={{marginBottom: 5}}> + <View style={s.mb5}> <ErrorMessage message="This is an error that occurred while things were being done" onPressTryAgain={() => {}} /> </View> - <View style={{marginBottom: 5}}> + <View style={s.mb5}> <ErrorMessage message="This is an error that occurred while things were being done" onPressTryAgain={() => {}} @@ -171,16 +172,7 @@ function PaletteView({palette}: {palette: PaletteColorName}) { const defaultPal = usePalette('default') const pal = usePalette(palette) return ( - <View - style={[ - pal.view, - pal.border, - { - borderWidth: 1, - padding: 10, - marginBottom: 5, - }, - ]}> + <View style={[pal.view, pal.border, s.p10, s.mb5, s.border1]}> <Text style={[pal.text]}>{palette} colors</Text> <Text style={[pal.textLight]}>Light text</Text> <Text style={[pal.link]}>Link text</Text> @@ -197,21 +189,6 @@ function TypographyView() { const pal = usePalette('default') return ( <View style={[pal.view]}> - <Text type="xxl-thin" style={[pal.text]}> - 'xxl-thin' lorem ipsum dolor - </Text> - <Text type="xxl" style={[pal.text]}> - 'xxl' lorem ipsum dolor - </Text> - <Text type="xxl-medium" style={[pal.text]}> - 'xxl-medium' lorem ipsum dolor - </Text> - <Text type="xxl-bold" style={[pal.text]}> - 'xxl-bold' lorem ipsum dolor - </Text> - <Text type="xxl-heavy" style={[pal.text]}> - 'xxl-heavy' lorem ipsum dolor - </Text> <Text type="xl-thin" style={[pal.text]}> 'xl-thin' lorem ipsum dolor </Text> @@ -300,9 +277,6 @@ function TypographyView() { <Text type="button" style={[pal.text]}> Button </Text> - <Text type="overline" style={[pal.text]}> - Overline - </Text> </View> ) } @@ -325,16 +299,12 @@ function ButtonsView() { const buttonStyles = {marginRight: 5} return ( <View style={[defaultPal.view]}> - <View - style={{ - flexDirection: 'row', - marginBottom: 5, - }}> + <View style={[s.flexRow, s.mb5]}> <Button type="primary" label="Primary solid" style={buttonStyles} /> <Button type="secondary" label="Secondary solid" style={buttonStyles} /> <Button type="inverted" label="Inverted solid" style={buttonStyles} /> </View> - <View style={{flexDirection: 'row'}}> + <View style={s.flexRow}> <Button type="primary-outline" label="Primary outline" @@ -346,7 +316,7 @@ function ButtonsView() { style={buttonStyles} /> </View> - <View style={{flexDirection: 'row'}}> + <View style={s.flexRow}> <Button type="primary-light" label="Primary light" @@ -358,7 +328,7 @@ function ButtonsView() { style={buttonStyles} /> </View> - <View style={{flexDirection: 'row'}}> + <View style={s.flexRow}> <Button type="default-light" label="Default light" @@ -390,10 +360,7 @@ function DropdownButtonsView() { const defaultPal = usePalette('default') return ( <View style={[defaultPal.view]}> - <View - style={{ - marginBottom: 5, - }}> + <View style={s.mb5}> <DropdownButton type="primary" items={DROPDOWN_ITEMS} @@ -401,10 +368,7 @@ function DropdownButtonsView() { label="Primary button" /> </View> - <View - style={{ - marginBottom: 5, - }}> + <View style={s.mb5}> <DropdownButton type="bare" items={DROPDOWN_ITEMS} menuWidth={200}> <Text>Bare</Text> </DropdownButton> @@ -415,7 +379,7 @@ function DropdownButtonsView() { function ToggleButtonsView() { const defaultPal = usePalette('default') - const buttonStyles = {marginBottom: 5} + const buttonStyles = s.mb5 const [isSelected, setIsSelected] = React.useState(false) const onToggle = () => setIsSelected(!isSelected) return ( diff --git a/src/view/screens/Home.tsx b/src/view/screens/Home.tsx index 8c00f4c7c..384ee15e1 100644 --- a/src/view/screens/Home.tsx +++ b/src/view/screens/Home.tsx @@ -83,14 +83,14 @@ export const Home = observer(function Home({ } return ( - <View style={s.flex1}> + <View style={s.h100pct}> <ViewHeader title="Bluesky" subtitle="Private Beta" canGoBack={false} /> <Feed testID="homeFeed" key="default" feed={store.me.mainFeed} scrollElRef={scrollElRef} - style={{flex: 1}} + style={s.h100pct} onPressCompose={onPressCompose} onPressTryAgain={onPressTryAgain} onScroll={onMainScroll} @@ -99,9 +99,9 @@ export const Home = observer(function Home({ <TouchableOpacity style={[ styles.loadLatest, - store.shell.minimalShellMode - ? {bottom: 35} - : {bottom: 60 + clamp(safeAreaInsets.bottom, 15, 30)}, + !store.shell.minimalShellMode && { + bottom: 60 + clamp(safeAreaInsets.bottom, 15, 30), + }, ]} onPress={onPressLoadLatest} hitSlop={HITSLOP}> @@ -125,6 +125,7 @@ const styles = StyleSheet.create({ loadLatest: { position: 'absolute', left: 20, + bottom: 35, shadowColor: '#000', shadowOpacity: 0.3, shadowOffset: {width: 0, height: 1}, diff --git a/src/view/screens/Log.tsx b/src/view/screens/Log.tsx index 34eed394c..62d79f482 100644 --- a/src/view/screens/Log.tsx +++ b/src/view/screens/Log.tsx @@ -21,7 +21,7 @@ export const Log = observer(function Log({navIdx, visible}: ScreenParams) { } store.shell.setMinimalShellMode(false) store.nav.setTitle(navIdx, 'Log') - }, [visible, store]) + }, [visible, store, navIdx]) const toggler = (id: string) => () => { if (expanded.includes(id)) { @@ -52,7 +52,7 @@ export const Log = observer(function Log({navIdx, visible}: ScreenParams) { <Text type="sm" style={[styles.summary, pal.text]}> {entry.summary} </Text> - {!!entry.details ? ( + {entry.details ? ( <FontAwesomeIcon icon={ expanded.includes(entry.id) ? 'angle-up' : 'angle-down' diff --git a/src/view/screens/Login.tsx b/src/view/screens/Login.tsx index 7d99f1444..accd0f428 100644 --- a/src/view/screens/Login.tsx +++ b/src/view/screens/Login.tsx @@ -18,9 +18,9 @@ import {s, colors} from '../lib/styles' import {usePalette} from '../lib/hooks/usePalette' enum ScreenState { - SigninOrCreateAccount, - Signin, - CreateAccount, + S_SigninOrCreateAccount, + S_Signin, + S_CreateAccount, } const SigninOrCreateAccount = ({ @@ -78,58 +78,56 @@ const SigninOrCreateAccount = ({ ) } -export const Login = observer( - (/*{navigation}: RootTabsScreenProps<'Login'>*/) => { - const pal = usePalette('default') - const [screenState, setScreenState] = useState<ScreenState>( - ScreenState.SigninOrCreateAccount, - ) - - if (screenState === ScreenState.SigninOrCreateAccount) { - return ( - <LinearGradient - colors={['#007CFF', '#00BCFF']} - start={{x: 0, y: 0.8}} - end={{x: 0, y: 1}} - style={styles.container}> - <SafeAreaView testID="noSessionView" style={styles.container}> - <ErrorBoundary> - <SigninOrCreateAccount - onPressSignin={() => setScreenState(ScreenState.Signin)} - onPressCreateAccount={() => - setScreenState(ScreenState.CreateAccount) - } - /> - </ErrorBoundary> - </SafeAreaView> - </LinearGradient> - ) - } +export const Login = observer(() => { + const pal = usePalette('default') + const [screenState, setScreenState] = useState<ScreenState>( + ScreenState.S_SigninOrCreateAccount, + ) + if (screenState === ScreenState.S_SigninOrCreateAccount) { return ( - <View style={[styles.container, pal.view]}> + <LinearGradient + colors={['#007CFF', '#00BCFF']} + start={{x: 0, y: 0.8}} + end={{x: 0, y: 1}} + style={styles.container}> <SafeAreaView testID="noSessionView" style={styles.container}> <ErrorBoundary> - {screenState === ScreenState.Signin ? ( - <Signin - onPressBack={() => - setScreenState(ScreenState.SigninOrCreateAccount) - } - /> - ) : undefined} - {screenState === ScreenState.CreateAccount ? ( - <CreateAccount - onPressBack={() => - setScreenState(ScreenState.SigninOrCreateAccount) - } - /> - ) : undefined} + <SigninOrCreateAccount + onPressSignin={() => setScreenState(ScreenState.S_Signin)} + onPressCreateAccount={() => + setScreenState(ScreenState.S_CreateAccount) + } + /> </ErrorBoundary> </SafeAreaView> - </View> + </LinearGradient> ) - }, -) + } + + return ( + <View style={[styles.container, pal.view]}> + <SafeAreaView testID="noSessionView" style={styles.container}> + <ErrorBoundary> + {screenState === ScreenState.S_Signin ? ( + <Signin + onPressBack={() => + setScreenState(ScreenState.S_SigninOrCreateAccount) + } + /> + ) : undefined} + {screenState === ScreenState.S_CreateAccount ? ( + <CreateAccount + onPressBack={() => + setScreenState(ScreenState.S_SigninOrCreateAccount) + } + /> + ) : undefined} + </ErrorBoundary> + </SafeAreaView> + </View> + ) +}) const styles = StyleSheet.create({ container: { diff --git a/src/view/screens/NotFound.tsx b/src/view/screens/NotFound.tsx index 79477fa9b..c5c5ff002 100644 --- a/src/view/screens/NotFound.tsx +++ b/src/view/screens/NotFound.tsx @@ -1,5 +1,5 @@ import React from 'react' -import {Button, View} from 'react-native' +import {Button, StyleSheet, View} from 'react-native' import {ViewHeader} from '../com/util/ViewHeader' import {Text} from '../com/util/text/Text' import {useStores} from '../../state' @@ -9,13 +9,8 @@ export const NotFound = () => { return ( <View testID="notFoundView"> <ViewHeader title="Page not found" /> - <View - style={{ - justifyContent: 'center', - alignItems: 'center', - paddingTop: 100, - }}> - <Text style={{fontSize: 40, fontWeight: 'bold'}}>Page not found</Text> + <View style={styles.container}> + <Text style={styles.title}>Page not found</Text> <Button testID="navigateHomeButton" title="Home" @@ -25,3 +20,15 @@ export const NotFound = () => { </View> ) } + +const styles = StyleSheet.create({ + container: { + justifyContent: 'center', + alignItems: 'center', + paddingTop: 100, + }, + title: { + fontSize: 40, + fontWeight: 'bold', + }, +}) diff --git a/src/view/screens/Notifications.tsx b/src/view/screens/Notifications.tsx index dd6e07611..9b5dc5970 100644 --- a/src/view/screens/Notifications.tsx +++ b/src/view/screens/Notifications.tsx @@ -5,6 +5,7 @@ import {Feed} from '../com/notifications/Feed' import {useStores} from '../../state' import {ScreenParams} from '../routes' import {useOnMainScroll} from '../lib/hooks/useOnMainScroll' +import {s} from '../lib/styles' export const Notifications = ({navIdx, visible}: ScreenParams) => { const store = useStores() @@ -24,14 +25,14 @@ export const Notifications = ({navIdx, visible}: ScreenParams) => { store.me.notifications.updateReadState() }) store.nav.setTitle(navIdx, 'Notifications') - }, [visible, store]) + }, [visible, store, navIdx]) const onPressTryAgain = () => { store.me.notifications.refresh() } return ( - <View style={{flex: 1}}> + <View style={s.h100pct}> <ViewHeader title="Notifications" canGoBack={false} /> <Feed view={store.me.notifications} diff --git a/src/view/screens/Onboard.tsx b/src/view/screens/Onboard.tsx index 4aa0e6cac..e31b42adc 100644 --- a/src/view/screens/Onboard.tsx +++ b/src/view/screens/Onboard.tsx @@ -1,5 +1,5 @@ import React, {useEffect} from 'react' -import {View} from 'react-native' +import {StyleSheet, View} from 'react-native' import {observer} from 'mobx-react-lite' import {FeatureExplainer} from '../com/onboard/FeatureExplainer' import {Follows} from '../com/onboard/Follows' @@ -14,7 +14,7 @@ export const Onboard = observer(() => { if (!OnboardStageOrder.includes(store.onboard.stage)) { store.onboard.stop() } - }, [store.onboard.stage]) + }, [store.onboard]) let Com if (store.onboard.stage === OnboardStage.Explainers) { @@ -26,8 +26,15 @@ export const Onboard = observer(() => { } return ( - <View style={{flex: 1, backgroundColor: '#fff'}}> + <View style={styles.container}> <Com /> </View> ) }) + +const styles = StyleSheet.create({ + container: { + height: '100%', + backgroundColor: '#fff', + }, +}) diff --git a/src/view/screens/PostDownvotedBy.tsx b/src/view/screens/PostDownvotedBy.tsx index ab110f8f9..1401868d4 100644 --- a/src/view/screens/PostDownvotedBy.tsx +++ b/src/view/screens/PostDownvotedBy.tsx @@ -16,7 +16,7 @@ export const PostDownvotedBy = ({navIdx, visible, params}: ScreenParams) => { store.nav.setTitle(navIdx, 'Downvoted by') store.shell.setMinimalShellMode(false) } - }, [store, visible]) + }, [store, visible, navIdx]) return ( <View> diff --git a/src/view/screens/PostRepostedBy.tsx b/src/view/screens/PostRepostedBy.tsx index 4e84617df..bf4d6ec91 100644 --- a/src/view/screens/PostRepostedBy.tsx +++ b/src/view/screens/PostRepostedBy.tsx @@ -16,7 +16,7 @@ export const PostRepostedBy = ({navIdx, visible, params}: ScreenParams) => { store.nav.setTitle(navIdx, 'Reposted by') store.shell.setMinimalShellMode(false) } - }, [store, visible]) + }, [store, visible, navIdx]) return ( <View> diff --git a/src/view/screens/PostThread.tsx b/src/view/screens/PostThread.tsx index c14c93af0..febaddc09 100644 --- a/src/view/screens/PostThread.tsx +++ b/src/view/screens/PostThread.tsx @@ -6,6 +6,7 @@ import {PostThread as PostThreadComponent} from '../com/post-thread/PostThread' import {PostThreadViewModel} from '../../state/models/post-thread-view' import {ScreenParams} from '../routes' import {useStores} from '../../state' +import {s} from '../lib/styles' export const PostThread = ({navIdx, visible, params}: ScreenParams) => { const store = useStores() @@ -14,18 +15,18 @@ export const PostThread = ({navIdx, visible, params}: ScreenParams) => { const uri = makeRecordUri(name, 'app.bsky.feed.post', rkey) const view = useMemo<PostThreadViewModel>( () => new PostThreadViewModel(store, {uri}), - [uri], + [store, uri], ) - const setTitle = () => { - const author = view.thread?.author - const niceName = author?.handle || name - setViewSubtitle(`by ${niceName}`) - store.nav.setTitle(navIdx, `Post by ${niceName}`) - } useEffect(() => { let aborted = false const threadCleanup = view.registerListeners() + const setTitle = () => { + const author = view.thread?.post.author + const niceName = author?.handle || name + setViewSubtitle(`by ${niceName}`) + store.nav.setTitle(navIdx, `Post by ${niceName}`) + } if (!visible) { return threadCleanup } @@ -47,12 +48,12 @@ export const PostThread = ({navIdx, visible, params}: ScreenParams) => { aborted = true threadCleanup() } - }, [visible, store.nav, store.log, name]) + }, [visible, store.nav, store.log, store.shell, name, navIdx, view]) return ( - <View style={{flex: 1}}> + <View style={s.h100pct}> <ViewHeader title="Post" subtitle={viewSubtitle} /> - <View style={{flex: 1}}> + <View style={s.h100pct}> <PostThreadComponent uri={uri} view={view} /> </View> </View> diff --git a/src/view/screens/PostUpvotedBy.tsx b/src/view/screens/PostUpvotedBy.tsx index 7379b852f..4bba222ae 100644 --- a/src/view/screens/PostUpvotedBy.tsx +++ b/src/view/screens/PostUpvotedBy.tsx @@ -15,7 +15,7 @@ export const PostUpvotedBy = ({navIdx, visible, params}: ScreenParams) => { if (visible) { store.nav.setTitle(navIdx, 'Liked by') } - }, [store, visible]) + }, [store, visible, navIdx]) return ( <View> diff --git a/src/view/screens/Profile.tsx b/src/view/screens/Profile.tsx index bd60ca61c..7fd813809 100644 --- a/src/view/screens/Profile.tsx +++ b/src/view/screens/Profile.tsx @@ -26,10 +26,14 @@ export const Profile = observer(({navIdx, visible, params}: ScreenParams) => { const [hasSetup, setHasSetup] = useState<boolean>(false) const uiState = React.useMemo( () => new ProfileUiModel(store, {user: params.name}), - [params.user], + [params.name, store], ) useEffect(() => { + store.nav.setTitle(navIdx, params.name) + }, [store, navIdx, params.name]) + + useEffect(() => { let aborted = false const feedCleanup = uiState.feed.registerListeners() if (!visible) { @@ -38,7 +42,6 @@ export const Profile = observer(({navIdx, visible, params}: ScreenParams) => { if (hasSetup) { uiState.update() } else { - store.nav.setTitle(navIdx, params.name) uiState.setup().then(() => { if (aborted) { return @@ -50,7 +53,7 @@ export const Profile = observer(({navIdx, visible, params}: ScreenParams) => { aborted = true feedCleanup() } - }, [visible, params.name, store]) + }, [visible, store, hasSetup, uiState]) // events // = @@ -139,7 +142,7 @@ export const Profile = observer(({navIdx, visible, params}: ScreenParams) => { <EmptyState icon={['far', 'message']} message="No posts yet!" - style={{paddingVertical: 40}} + style={styles.emptyState} /> ) } @@ -187,7 +190,7 @@ export const Profile = observer(({navIdx, visible, params}: ScreenParams) => { function LoadingMoreFooter() { return ( - <View style={{paddingVertical: 20}}> + <View style={styles.loadingMoreFooter}> <ActivityIndicator /> </View> ) @@ -202,6 +205,12 @@ const styles = StyleSheet.create({ paddingVertical: 10, paddingHorizontal: 14, }, + emptyState: { + paddingVertical: 40, + }, + loadingMoreFooter: { + paddingVertical: 20, + }, endItem: { paddingTop: 20, paddingBottom: 30, diff --git a/src/view/screens/ProfileFollowers.tsx b/src/view/screens/ProfileFollowers.tsx index 49b3e2e05..f7520549e 100644 --- a/src/view/screens/ProfileFollowers.tsx +++ b/src/view/screens/ProfileFollowers.tsx @@ -14,7 +14,7 @@ export const ProfileFollowers = ({navIdx, visible, params}: ScreenParams) => { store.nav.setTitle(navIdx, `Followers of ${name}`) store.shell.setMinimalShellMode(false) } - }, [store, visible, name]) + }, [store, visible, name, navIdx]) return ( <View> diff --git a/src/view/screens/ProfileFollows.tsx b/src/view/screens/ProfileFollows.tsx index 58df6e76d..65e4004e9 100644 --- a/src/view/screens/ProfileFollows.tsx +++ b/src/view/screens/ProfileFollows.tsx @@ -14,7 +14,7 @@ export const ProfileFollows = ({navIdx, visible, params}: ScreenParams) => { store.nav.setTitle(navIdx, `Followed by ${name}`) store.shell.setMinimalShellMode(false) } - }, [store, visible, name]) + }, [store, visible, name, navIdx]) return ( <View> diff --git a/src/view/screens/Search.tsx b/src/view/screens/Search.tsx index 385489c4b..952972222 100644 --- a/src/view/screens/Search.tsx +++ b/src/view/screens/Search.tsx @@ -25,7 +25,7 @@ export const Search = ({navIdx, visible, params}: ScreenParams) => { const [query, setQuery] = useState<string>('') const autocompleteView = useMemo<UserAutocompleteViewModel>( () => new UserAutocompleteViewModel(store), - [], + [store], ) const {name} = params @@ -35,7 +35,7 @@ export const Search = ({navIdx, visible, params}: ScreenParams) => { autocompleteView.setup() store.nav.setTitle(navIdx, 'Search') } - }, [store, visible, name]) + }, [store, visible, name, navIdx, autocompleteView]) const onChangeQuery = (text: string) => { setQuery(text) diff --git a/src/view/screens/Settings.tsx b/src/view/screens/Settings.tsx index 2c6982685..d659d25d4 100644 --- a/src/view/screens/Settings.tsx +++ b/src/view/screens/Settings.tsx @@ -33,7 +33,7 @@ export const Settings = observer(function Settings({ } store.shell.setMinimalShellMode(false) store.nav.setTitle(navIdx, 'Settings') - }, [visible, store]) + }, [visible, store, navIdx]) const onPressSwitchAccount = async (acct: AccountData) => { setIsSwitching(true) @@ -130,8 +130,8 @@ export const Settings = observer(function Settings({ style={[ pal.view, styles.profile, + styles.alignCenter, s.mb2, - {alignItems: 'center'}, isSwitching && styles.dimmed, ]} onPress={isSwitching ? undefined : onPressAddAccount}> @@ -142,7 +142,7 @@ export const Settings = observer(function Settings({ </Text> </View> </TouchableOpacity> - <View style={{height: 50}} /> + <View style={styles.spacer} /> <Text type="sm-medium" style={[s.mb5]}> Developer tools </Text> @@ -168,6 +168,12 @@ const styles = StyleSheet.create({ dimmed: { opacity: 0.5, }, + spacer: { + height: 50, + }, + alignCenter: { + alignItems: 'center', + }, title: { fontSize: 32, fontWeight: 'bold', |