13 files changed, 119 insertions, 37 deletions
diff --git a/src/view/screens/Home.tsx b/src/view/screens/Home.tsx
deleted file mode 100644
index 1b41b2d35..000000000
--- a/src/view/screens/Home.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import React, {useEffect} from 'react'
-import {View} from 'react-native'
-import {Shell} from '../shell'
-import {Feed} from '../com/feed/Feed'
-import type {RootTabsScreenProps} from '../routes/types'
-import {useStores} from '../../state'
-
-export function Home({navigation}: RootTabsScreenProps<'HomeTab'>) {
-  const store = useStores()
-  useEffect(() => {
-    console.log('Fetching home feed')
-    store.homeFeed.setup()
-  }, [store.homeFeed])
-
-  const onNavigateContent = (screen: string, props: Record<string, string>) => {
-    // @ts-ignore it's up to the callers to supply correct params -prf
-    navigation.navigate(screen, props)
-  }
-
-  return (
-    <Shell>
-      <View>
-        <Feed feed={store.homeFeed} onNavigateContent={onNavigateContent} />
-      </View>
-    </Shell>
-  )
-}
diff --git a/src/view/screens/stacks/Composer.tsx b/src/view/screens/stacks/Composer.tsx
new file mode 100644
index 000000000..e1b36567a
--- /dev/null
+++ b/src/view/screens/stacks/Composer.tsx
@@ -0,0 +1,50 @@
+import React, {useLayoutEffect, useRef} from 'react'
+import {Text, TouchableOpacity} from 'react-native'
+import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
+import {Shell} from '../../shell'
+import type {RootTabsScreenProps} from '../../routes/types'
+import {Composer as ComposerComponent} from '../../com/composer/Composer'
+
+export const Composer = ({
+  navigation,
+  route,
+}: RootTabsScreenProps<'Composer'>) => {
+  const {replyTo} = route.params
+  const ref = useRef<{publish: () => Promise<boolean>}>()
+
+  useLayoutEffect(() => {
+    navigation.setOptions({
+      headerShown: true,
+      headerTitle: replyTo ? 'Reply' : 'New Post',
+      headerLeft: () => (
+        <TouchableOpacity onPress={() => navigation.goBack()}>
+          <FontAwesomeIcon icon="x" />
+        </TouchableOpacity>
+      ),
+      headerRight: () => (
+        <TouchableOpacity
+          onPress={() => {
+            if (!ref.current) {
+              return
+            }
+            ref.current.publish().then(
+              posted => {
+                if (posted) {
+                  navigation.goBack()
+                }
+              },
+              err => console.error('Failed to create post', err),
+            )
+          }}>
+          <Text>Post</Text>
+        </TouchableOpacity>
+      ),
+    })
+  }, [navigation, replyTo, ref])
+
+  return (
+    <Shell>
+      <ComposerComponent ref={ref} replyTo={replyTo} />
+    </Shell>
+  )
+}
diff --git a/src/view/screens/content/PostLikedBy.tsx b/src/view/screens/stacks/PostLikedBy.tsx
index f12990141..f12990141 100644
--- a/src/view/screens/content/PostLikedBy.tsx
+++ b/src/view/screens/stacks/PostLikedBy.tsx
diff --git a/src/view/screens/content/PostRepostedBy.tsx b/src/view/screens/stacks/PostRepostedBy.tsx
index 000c1a7fc..000c1a7fc 100644
--- a/src/view/screens/content/PostRepostedBy.tsx
+++ b/src/view/screens/stacks/PostRepostedBy.tsx
diff --git a/src/view/screens/content/PostThread.tsx b/src/view/screens/stacks/PostThread.tsx
index 485a2e49a..485a2e49a 100644
--- a/src/view/screens/content/PostThread.tsx
+++ b/src/view/screens/stacks/PostThread.tsx
diff --git a/src/view/screens/content/Profile.tsx b/src/view/screens/stacks/Profile.tsx
index ccdaed4a4..ccdaed4a4 100644
--- a/src/view/screens/content/Profile.tsx
+++ b/src/view/screens/stacks/Profile.tsx
diff --git a/src/view/screens/tabroots/Home.tsx b/src/view/screens/tabroots/Home.tsx
new file mode 100644
index 000000000..446a5a7e9
--- /dev/null
+++ b/src/view/screens/tabroots/Home.tsx
@@ -0,0 +1,59 @@
+import React, {useEffect, useLayoutEffect} from 'react'
+import {Image, StyleSheet, TouchableOpacity, View} from 'react-native'
+import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
+import {Shell} from '../../shell'
+import {Feed} from '../../com/feed/Feed'
+import type {RootTabsScreenProps} from '../../routes/types'
+import {useStores} from '../../../state'
+import {AVIS} from '../../lib/assets'
+
+export function Home({navigation}: RootTabsScreenProps<'HomeTab'>) {
+  const store = useStores()
+  useEffect(() => {
+    console.log('Fetching home feed')
+    store.homeFeed.setup()
+  }, [store.homeFeed])
+
+  const onNavigateContent = (screen: string, props: Record<string, string>) => {
+    // @ts-ignore it's up to the callers to supply correct params -prf
+    navigation.navigate(screen, props)
+  }
+
+  useLayoutEffect(() => {
+    navigation.setOptions({
+      headerShown: true,
+      headerTitle: 'V I B E',
+      headerLeft: () => (
+        <TouchableOpacity
+          onPress={() => navigation.push('Profile', {name: 'alice.com'})}>
+          <Image source={AVIS['alice.com']} style={styles.avi} />
+        </TouchableOpacity>
+      ),
+      headerRight: () => (
+        <TouchableOpacity
+          onPress={() => {
+            navigation.push('Composer', {})
+          }}>
+          <FontAwesomeIcon icon="plus" style={{color: '#006bf7'}} />
+        </TouchableOpacity>
+      ),
+    })
+  }, [navigation])
+
+  return (
+    <Shell>
+      <View>
+        <Feed feed={store.homeFeed} onNavigateContent={onNavigateContent} />
+      </View>
+    </Shell>
+  )
+}
+
+const styles = StyleSheet.create({
+  avi: {
+    width: 20,
+    height: 20,
+    borderRadius: 10,
+    resizeMode: 'cover',
+  },
+})
diff --git a/src/view/screens/Login.tsx b/src/view/screens/tabroots/Login.tsx
index d08a5a256..a5f670bdd 100644
--- a/src/view/screens/Login.tsx
+++ b/src/view/screens/tabroots/Login.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import {Text, View} from 'react-native'
 import {observer} from 'mobx-react-lite'
-import {Shell} from '../shell'
+import {Shell} from '../../shell'
 // import type {RootTabsScreenProps} from '../routes/types'
 // import {useStores} from '../../state'
 
diff --git a/src/view/screens/Menu.tsx b/src/view/screens/tabroots/Menu.tsx
index d0cc0826f..dca5ad33b 100644
--- a/src/view/screens/Menu.tsx
+++ b/src/view/screens/tabroots/Menu.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
-import {Shell} from '../shell'
+import {Shell} from '../../shell'
 import {ScrollView, Text, View} from 'react-native'
-import type {RootTabsScreenProps} from '../routes/types'
+import type {RootTabsScreenProps} from '../../routes/types'
 
 export const Menu = (_props: RootTabsScreenProps<'MenuTab'>) => {
   return (
diff --git a/src/view/screens/NotFound.tsx b/src/view/screens/tabroots/NotFound.tsx
index 5357a428a..a35808cbc 100644
--- a/src/view/screens/NotFound.tsx
+++ b/src/view/screens/tabroots/NotFound.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
-import {Shell} from '../shell'
+import {Shell} from '../../shell'
 import {Text, Button, View} from 'react-native'
-import type {RootTabsScreenProps} from '../routes/types'
+import type {RootTabsScreenProps} from '../../routes/types'
 
 export const NotFound = ({navigation}: RootTabsScreenProps<'NotFound'>) => {
   return (
diff --git a/src/view/screens/Notifications.tsx b/src/view/screens/tabroots/Notifications.tsx
index a7918f177..091410ad8 100644
--- a/src/view/screens/Notifications.tsx
+++ b/src/view/screens/tabroots/Notifications.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
-import {Shell} from '../shell'
+import {Shell} from '../../shell'
 import {Text, View} from 'react-native'
-import type {RootTabsScreenProps} from '../routes/types'
+import type {RootTabsScreenProps} from '../../routes/types'
 
 export const Notifications = (
   _props: RootTabsScreenProps<'NotificationsTab'>,
diff --git a/src/view/screens/Search.tsx b/src/view/screens/tabroots/Search.tsx
index 26df2954c..044ca749c 100644
--- a/src/view/screens/Search.tsx
+++ b/src/view/screens/tabroots/Search.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
-import {Shell} from '../shell'
+import {Shell} from '../../shell'
 import {Text, View} from 'react-native'
-import type {RootTabsScreenProps} from '../routes/types'
+import type {RootTabsScreenProps} from '../../routes/types'
 
 export const Search = (_props: RootTabsScreenProps<'SearchTab'>) => {
   return (
diff --git a/src/view/screens/Signup.tsx b/src/view/screens/tabroots/Signup.tsx
index 4a8c5df2d..dc2af2b1e 100644
--- a/src/view/screens/Signup.tsx
+++ b/src/view/screens/tabroots/Signup.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import {Text, View} from 'react-native'
 import {observer} from 'mobx-react-lite'
-import {Shell} from '../shell'
+import {Shell} from '../../shell'
 // import type {RootTabsScreenProps} from '../routes/types'
 // import {useStores} from '../../state'