zio/bsky-app
2
0
Fork 0
Code Pull requests Releases Packages Activity

Replace mobx-state-tree with mobx and get a basic home feed rendering

Browse source
This commit is contained in:
Paul Frazee 2022-07-19 15:37:24 -05:00
parent 6b32698b3e
commit dc55f58004
20 changed files with 534 additions and 273 deletions
Download patch file Download diff file Expand all files Collapse all files

25
src/view/screens/Home.tsx
View file

@ -1,20 +1,23 @@
import React from 'react'
import {Text, Button, View} from 'react-native'
import React, {useEffect} from 'react'
import {Text, View} from 'react-native'
import {Shell} from '../shell'
import type {RootTabsScreenProps} from '../routes/types'
import {Feed} from '../com/Feed'
// import type {RootTabsScreenProps} from '../routes/types'
import {useStores} from '../../state'
export function Home({navigation}: RootTabsScreenProps<'Home'>) {
export function Home(/*{navigation}: RootTabsScreenProps<'Home'>*/) {
const store = useStores()
useEffect(() => {
console.log('Fetching home feed')
store.homeFeed.fetch()
}, [store.homeFeed])
return (
<Shell>
<View style={{alignItems: 'center'}}>
<Text style={{fontSize: 20, fontWeight: 'bold'}}>Home</Text>
<Button
title="Go to Jane's profile"
onPress={() => navigation.navigate('Profile', {name: 'Jane'})}
/>
<Button title="Logout" onPress={() => store.session.logout()} />
<View>
<Text style={{fontSize: 20, fontWeight: 'bold'}}>
Hello, {store.me.displayName} ({store.me.name})
</Text>
<Feed feed={store.homeFeed} />
</View>
</Shell>
)

32
src/view/screens/Login.tsx
View file

@ -1,17 +1,18 @@
import React from 'react'
import {Text, Button, View, ActivityIndicator} from 'react-native'
import {Text, View} from 'react-native'
import {observer} from 'mobx-react-lite'
import {Shell} from '../shell'
import type {RootTabsScreenProps} from '../routes/types'
import {useStores} from '../../state'
// import type {RootTabsScreenProps} from '../routes/types'
// import {useStores} from '../../state'
export const Login = observer(({navigation}: RootTabsScreenProps<'Login'>) => {
const store = useStores()
return (
<Shell>
<View style={{justifyContent: 'center', alignItems: 'center'}}>
<Text style={{fontSize: 20, fontWeight: 'bold'}}>Sign In</Text>
{store.session.uiError ?? <Text>{store.session.uiError}</Text>}
export const Login = observer(
(/*{navigation}: RootTabsScreenProps<'Login'>*/) => {
// const store = useStores()
return (
<Shell>
<View style={{justifyContent: 'center', alignItems: 'center'}}>
<Text style={{fontSize: 20, fontWeight: 'bold'}}>Sign In</Text>
{/*store.session.uiError && <Text>{store.session.uiError}</Text>}
{!store.session.uiIsProcessing ? (
<>
<Button title="Login" onPress={() => store.session.login()} />
@ -22,8 +23,9 @@ export const Login = observer(({navigation}: RootTabsScreenProps<'Login'>) => {
</>
) : (
<ActivityIndicator />
)}
</View>
</Shell>
)
})
)*/}
</View>
</Shell>
)
},
)

14
src/view/screens/Signup.tsx
View file

@ -1,18 +1,18 @@
import React from 'react'
import {Text, Button, View, ActivityIndicator} from 'react-native'
import {Text, View} from 'react-native'
import {observer} from 'mobx-react-lite'
import {Shell} from '../shell'
import type {RootTabsScreenProps} from '../routes/types'
import {useStores} from '../../state'
// import type {RootTabsScreenProps} from '../routes/types'
// import {useStores} from '../../state'
export const Signup = observer(
({navigation}: RootTabsScreenProps<'Signup'>) => {
const store = useStores()
(/*{navigation}: RootTabsScreenProps<'Signup'>*/) => {
// const store = useStores()
return (
<Shell>
<View style={{justifyContent: 'center', alignItems: 'center'}}>
<Text style={{fontSize: 20, fontWeight: 'bold'}}>Create Account</Text>
{store.session.uiError ?? <Text>{store.session.uiError}</Text>}
{/*store.session.uiError ?? <Text>{store.session.uiError}</Text>}
{!store.session.uiIsProcessing ? (
<>
<Button
@ -26,7 +26,7 @@ export const Signup = observer(
</>
) : (
<ActivityIndicator />
)}
)*/}
</View>
</Shell>
)