about summary refs log tree commit diff
path: root/src/view/com/post-thread/PostVotedBy.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/view/com/post-thread/PostVotedBy.tsx')
-rw-r--r--src/view/com/post-thread/PostVotedBy.tsx77
1 files changed, 14 insertions, 63 deletions
diff --git a/src/view/com/post-thread/PostVotedBy.tsx b/src/view/com/post-thread/PostVotedBy.tsx
index 680bbadf4..2734aaea9 100644
--- a/src/view/com/post-thread/PostVotedBy.tsx
+++ b/src/view/com/post-thread/PostVotedBy.tsx
@@ -2,14 +2,10 @@ import React, {useEffect} from 'react'
 import {observer} from 'mobx-react-lite'
 import {ActivityIndicator, StyleSheet, View} from 'react-native'
 import {CenteredView, FlatList} from '../util/Views'
-import {VotesViewModel, VoteItem} from '../../../state/models/votes-view'
-import {Link} from '../util/Link'
-import {Text} from '../util/text/Text'
+import {VotesViewModel, VoteItem} from 'state/models/votes-view'
 import {ErrorMessage} from '../util/error/ErrorMessage'
-import {UserAvatar} from '../util/UserAvatar'
-import {useStores} from '../../../state'
-import {s} from '../../lib/styles'
-import {usePalette} from '../../lib/hooks/usePalette'
+import {ProfileCardWithFollowBtn} from '../profile/ProfileCard'
+import {useStores} from 'state/index'
 
 export const PostVotedBy = observer(function PostVotedBy({
   uri,
@@ -57,7 +53,17 @@ export const PostVotedBy = observer(function PostVotedBy({
 
   // loaded
   // =
-  const renderItem = ({item}: {item: VoteItem}) => <LikedByItem item={item} />
+  const renderItem = ({item}: {item: VoteItem}) => (
+    <ProfileCardWithFollowBtn
+      key={item.actor.did}
+      did={item.actor.did}
+      declarationCid={item.actor.declaration.cid}
+      handle={item.actor.handle}
+      displayName={item.actor.displayName}
+      avatar={item.actor.avatar}
+      isFollowedBy={!!item.actor.viewer?.followedBy}
+    />
+  )
   return (
     <FlatList
       data={view.votes}
@@ -77,62 +83,7 @@ export const PostVotedBy = observer(function PostVotedBy({
   )
 })
 
-const LikedByItem = ({item}: {item: VoteItem}) => {
-  const pal = usePalette('default')
-
-  return (
-    <Link
-      style={[styles.outer, pal.view]}
-      href={`/profile/${item.actor.handle}`}
-      title={item.actor.handle}
-      noFeedback>
-      <View style={styles.layout}>
-        <View style={styles.layoutAvi}>
-          <UserAvatar
-            size={40}
-            displayName={item.actor.displayName}
-            handle={item.actor.handle}
-            avatar={item.actor.avatar}
-          />
-        </View>
-        <View style={styles.layoutContent}>
-          <Text style={[s.f15, s.bold, pal.text]}>
-            {item.actor.displayName || item.actor.handle}
-          </Text>
-          <Text style={[s.f14, s.gray5, pal.textLight]}>
-            @{item.actor.handle}
-          </Text>
-        </View>
-      </View>
-    </Link>
-  )
-}
-
 const styles = StyleSheet.create({
-  outer: {
-    marginTop: 1,
-  },
-  layout: {
-    flexDirection: 'row',
-  },
-  layoutAvi: {
-    width: 60,
-    paddingLeft: 10,
-    paddingTop: 10,
-    paddingBottom: 10,
-  },
-  avi: {
-    width: 40,
-    height: 40,
-    borderRadius: 20,
-    resizeMode: 'cover',
-  },
-  layoutContent: {
-    flex: 1,
-    paddingRight: 10,
-    paddingTop: 10,
-    paddingBottom: 10,
-  },
   footer: {
     height: 200,
     paddingTop: 20,