Add settings page

zio/stable
Paul Frazee 2022-09-29 11:59:11 -05:00
parent 8ff5f81f24
commit e3e4c4366c
4 changed files with 88 additions and 4 deletions

View File

@ -151,7 +151,12 @@ export const Component = observer(() => {
url="/notifications"
gradient="purple"
/>
<FatMenuItem icon="gear" label="Settings" url="/" gradient="blue" />
<FatMenuItem
icon="gear"
label="Settings"
url="/settings"
gradient="blue"
/>
</View>
</View>
<View style={[s.p10, styles.section]}>

View File

@ -10,6 +10,7 @@ import {PostRepostedBy} from './screens/PostRepostedBy'
import {Profile} from './screens/Profile'
import {ProfileFollowers} from './screens/ProfileFollowers'
import {ProfileFollows} from './screens/ProfileFollows'
import {Settings} from './screens/Settings'
export type ScreenParams = {
params: Record<string, any>
@ -27,6 +28,7 @@ export const routes: Route[] = [
[Home, 'house', r('/')],
[Search, 'magnifying-glass', r('/search')],
[Notifications, 'bell', r('/notifications')],
[Settings, 'bell', r('/settings')],
[Profile, ['far', 'user'], r('/profile/(?<name>[^/]+)')],
[ProfileFollowers, 'users', r('/profile/(?<name>[^/]+)/followers')],
[ProfileFollows, 'users', r('/profile/(?<name>[^/]+)/follows')],

View File

@ -0,0 +1,68 @@
import React, {useEffect} from 'react'
import {Image, StyleSheet, Text, TouchableOpacity, View} from 'react-native'
import {observer} from 'mobx-react-lite'
import {useStores} from '../../state'
import {ScreenParams} from '../routes'
import {s, colors} from '../lib/styles'
import {DEF_AVATER} from '../lib/assets'
import {Link} from '../com/util/Link'
export const Settings = observer(function Settings({visible}: ScreenParams) {
const store = useStores()
useEffect(() => {
if (!visible) {
return
}
store.nav.setTitle('Settings')
}, [visible, store])
const onPressSignout = () => {
store.session.logout()
}
return (
<View style={[s.flex1, s.pl10, s.pr10]}>
<Text style={styles.title}>Settings</Text>
<View style={[s.flexRow]}>
<Text>Signed in as</Text>
<View style={s.flex1} />
<TouchableOpacity onPress={onPressSignout}>
<Text style={[s.blue3, s.bold]}>Sign out</Text>
</TouchableOpacity>
</View>
<Link href={`/profile/${store.me.name}`} title="Your profile">
<View style={styles.profile}>
<Image style={styles.avi} source={DEF_AVATER} />
<View>
<Text style={[s.f18]}>{store.me.displayName}</Text>
<Text style={[s.gray5]}>@{store.me.name}</Text>
</View>
</View>
</Link>
</View>
)
})
const styles = StyleSheet.create({
title: {
fontSize: 32,
fontWeight: 'bold',
marginTop: 20,
marginBottom: 14,
},
profile: {
flexDirection: 'row',
marginVertical: 6,
backgroundColor: colors.white,
borderRadius: 4,
paddingVertical: 10,
paddingHorizontal: 10,
},
avi: {
width: 40,
height: 40,
borderRadius: 30,
marginRight: 8,
},
})

View File

@ -2,14 +2,22 @@ Paul's todo list
- General
- Update to RN 0.70
- Go through every button and make sure it does what it's supposed to
- Onboarding flow
- *
- Private beta
- Users list
- Firehose
- Composer
- Update the view after creating a post
- Profile
- Real badges
- Edit profile: avatar, cover photo
- Disable badges for now
- Disable editing avi or banner
- More button
- Search view
- *
- Notifications view
- *
- Linking
- Web linking
- App linking
@ -20,4 +28,5 @@ Paul's todo list
- Follows list
- Bugs
- Check that sub components arent reloading too much
- Titles are getting screwed up (possibly swipe related)
- Titles are getting screwed up (possibly swipe related)
- Likes, RTs?