about summary refs log tree commit diff
path: root/src/view/com/posts
diff options
context:
space:
mode:
Diffstat (limited to 'src/view/com/posts')
-rw-r--r--src/view/com/posts/Feed.tsx19
-rw-r--r--src/view/com/posts/FeedItem.tsx9
2 files changed, 15 insertions, 13 deletions
diff --git a/src/view/com/posts/Feed.tsx b/src/view/com/posts/Feed.tsx
index 726338f81..db6877660 100644
--- a/src/view/com/posts/Feed.tsx
+++ b/src/view/com/posts/Feed.tsx
@@ -5,6 +5,7 @@ import {
   View,
   FlatList,
   StyleProp,
+  StyleSheet,
   ViewStyle,
 } from 'react-native'
 import {PostFeedLoadingPlaceholder} from '../util/LoadingPlaceholder'
@@ -14,6 +15,7 @@ import {FeedModel} from '../../../state/models/feed-view'
 import {FeedItem} from './FeedItem'
 import {PromptButtons} from './PromptButtons'
 import {OnScrollCb} from '../../lib/hooks/useOnMainScroll'
+import {s} from '../../lib/styles'
 
 const COMPOSE_PROMPT_ITEM = {_reactKey: '__prompt__'}
 const EMPTY_FEED_ITEM = {_reactKey: '__empty__'}
@@ -47,7 +49,7 @@ export const Feed = observer(function Feed({
         <EmptyState
           icon="bars"
           message="This feed is empty!"
-          style={{paddingVertical: 40}}
+          style={styles.emptyState}
         />
       )
     } else {
@@ -76,7 +78,7 @@ export const Feed = observer(function Feed({
   }
   const FeedFooter = () =>
     feed.isLoading ? (
-      <View style={{paddingTop: 20}}>
+      <View style={styles.feedFooter}>
         <ActivityIndicator />
       </View>
     ) : (
@@ -87,11 +89,7 @@ export const Feed = observer(function Feed({
       {!data && <PromptButtons onPressCompose={onPressCompose} />}
       {feed.isLoading && !data && <PostFeedLoadingPlaceholder />}
       {feed.hasError && (
-        <ErrorMessage
-          message={feed.error}
-          style={{margin: 6}}
-          onPressTryAgain={onPressTryAgain}
-        />
+        <ErrorMessage message={feed.error} onPressTryAgain={onPressTryAgain} />
       )}
       {feed.hasLoaded && data && (
         <FlatList
@@ -101,7 +99,7 @@ export const Feed = observer(function Feed({
           renderItem={renderItem}
           ListFooterComponent={FeedFooter}
           refreshing={feed.isRefreshing}
-          contentContainerStyle={{paddingBottom: 100}}
+          contentContainerStyle={s.contentContainer}
           onScroll={onScroll}
           onRefresh={onRefresh}
           onEndReached={onEndReached}
@@ -110,3 +108,8 @@ export const Feed = observer(function Feed({
     </View>
   )
 })
+
+const styles = StyleSheet.create({
+  feedFooter: {paddingTop: 20},
+  emptyState: {paddingVertical: 40},
+})
diff --git a/src/view/com/posts/FeedItem.tsx b/src/view/com/posts/FeedItem.tsx
index 4133c17d4..584fa0973 100644
--- a/src/view/com/posts/FeedItem.tsx
+++ b/src/view/com/posts/FeedItem.tsx
@@ -124,7 +124,7 @@ export const FeedItem = observer(function ({
             style={[
               styles.bottomReplyLine,
               {borderColor: pal.colors.replyLine},
-              isNoTop ? {top: 64} : undefined,
+              isNoTop ? styles.bottomReplyLineNoTop : undefined,
             ]}
           />
         )}
@@ -163,7 +163,7 @@ export const FeedItem = observer(function ({
               timestamp={item.post.indexedAt}
             />
             {!isChild && replyAuthorDid !== '' && (
-              <View style={[s.flexRow, s.mb2, {alignItems: 'center'}]}>
+              <View style={[s.flexRow, s.mb2, s.alignCenter]}>
                 <FontAwesomeIcon
                   icon="reply"
                   size={9}
@@ -195,9 +195,7 @@ export const FeedItem = observer(function ({
                   lineHeight={1.3}
                 />
               </View>
-            ) : (
-              <View style={{height: 5}} />
-            )}
+            ) : undefined}
             {item.post.embed ? (
               <PostEmbeds embed={item.post.embed} style={styles.embed} />
             ) : null}
@@ -281,6 +279,7 @@ const styles = StyleSheet.create({
     bottom: 0,
     borderLeftWidth: 2,
   },
+  bottomReplyLineNoTop: {top: 64},
   includeReason: {
     flexDirection: 'row',
     paddingLeft: 50,