Add custom feed liked by screen

zio/stable
Paul Frazee 2023-05-17 22:12:14 -05:00
parent 998879d6d6
commit a2c89b47a1
6 changed files with 51 additions and 73 deletions

View File

@ -40,7 +40,8 @@ import {SettingsScreen} from './view/screens/Settings'
import {ProfileScreen} from './view/screens/Profile'
import {ProfileFollowersScreen} from './view/screens/ProfileFollowers'
import {ProfileFollowsScreen} from './view/screens/ProfileFollows'
import {ProfileCustomFeed} from './view/screens/ProfileCustomFeed'
import {CustomFeedScreen} from './view/screens/CustomFeed'
import {CustomFeedLikedByScreen} from './view/screens/CustomFeedLikedBy'
import {ProfileListScreen} from './view/screens/ProfileList'
import {PostThreadScreen} from './view/screens/PostThread'
import {PostLikedByScreen} from './view/screens/PostLikedBy'
@ -126,7 +127,6 @@ function commonScreens(Stack: typeof HomeTab, unreadCountLabel?: string) {
title: title(`People followed by @${route.params.name}`),
})}
/>
<Stack.Screen name="ProfileCustomFeed" component={ProfileCustomFeed} />
<Stack.Screen
name="ProfileList"
component={ProfileListScreen}
@ -147,6 +147,11 @@ function commonScreens(Stack: typeof HomeTab, unreadCountLabel?: string) {
component={PostRepostedByScreen}
options={({route}) => ({title: title(`Post by @${route.params.name}`)})}
/>
<Stack.Screen name="CustomFeed" component={CustomFeedScreen} />
<Stack.Screen
name="CustomFeedLikedBy"
component={CustomFeedLikedByScreen}
/>
<Stack.Screen
name="Debug"
component={DebugScreen}

View File

@ -13,11 +13,12 @@ export type CommonNavigatorParams = {
Profile: {name: string; hideBackButton?: boolean}
ProfileFollowers: {name: string}
ProfileFollows: {name: string}
ProfileCustomFeed: {name: string; rkey: string}
ProfileList: {name: string; rkey: string}
PostThread: {name: string; rkey: string}
PostLikedBy: {name: string; rkey: string}
PostRepostedBy: {name: string; rkey: string}
CustomFeed: {name: string; rkey: string}
CustomFeedLikedBy: {name: string; rkey: string}
Debug: undefined
Log: undefined
Support: undefined

View File

@ -17,6 +17,7 @@ export const router = new Router({
PostLikedBy: '/profile/:name/post/:rkey/liked-by',
PostRepostedBy: '/profile/:name/post/:rkey/reposted-by',
CustomFeed: '/profile/:name/feed/:rkey',
CustomFeedLikedBy: '/profile/:name/feed/:rkey/liked-by',
Debug: '/sys/debug',
Log: '/sys/log',
AppPasswords: '/settings/app-passwords',

View File

@ -61,7 +61,7 @@ export const CustomFeed = observer(
accessibilityRole="button"
style={[styles.container, pal.border, style]}
onPress={() => {
navigation.navigate('ProfileCustomFeed', {
navigation.navigate('CustomFeed', {
name: item.data.creator.did,
rkey: new AtUri(item.data.uri).rkey,
})

View File

@ -21,8 +21,8 @@ import {Text} from 'view/com/util/text/Text'
import * as Toast from 'view/com/util/Toast'
import {isDesktopWeb} from 'platform/detection'
type Props = NativeStackScreenProps<CommonNavigatorParams, 'ProfileCustomFeed'>
export const ProfileCustomFeed = withAuthRequired(
type Props = NativeStackScreenProps<CommonNavigatorParams, 'CustomFeed'>
export const CustomFeedScreen = withAuthRequired(
observer(({route}: Props) => {
const store = useStores()
const pal = usePalette('default')
@ -146,10 +146,15 @@ export const ProfileCustomFeed = withAuthRequired(
{currentFeed.data.description}
</Text>
) : null}
<Text type="md-medium" style={pal.textLight}>
Liked by {currentFeed?.data.likeCount}{' '}
{pluralize(currentFeed?.data.likeCount || 0, 'user')}
</Text>
<TextLink
type="md-medium"
style={pal.textLight}
href={`/profile/${name}/feed/${rkey}/liked-by`}
text={`Liked by ${currentFeed?.data.likeCount} ${pluralize(
currentFeed?.data.likeCount || 0,
'user',
)}`}
/>
{isDesktopWeb && (
<View style={styles.headerBtns}>
<Button
@ -198,30 +203,6 @@ export const ProfileCustomFeed = withAuthRequired(
}),
)
/*
<View style={[styles.headerContainer]}>
<View style={[styles.header]}>
<View style={styles.avatarContainer}>
<UserAvatar
type="algo"
size={28}
avatar={currentFeed?.data.avatar}
/>
<Link href={`/profile/${currentFeed?.data.creator.handle}`}>
<Text style={[pal.textLight]}>
@{currentFeed?.data.creator.handle}
</Text>
</Link>
</View>
<Text style={[pal.text]}>{currentFeed?.data.description}</Text>
</View>
<View style={[styles.buttonsContainer]}>
</View>
</View>
*/
const styles = StyleSheet.create({
headerBtns: {
flexDirection: 'row',
@ -251,43 +232,4 @@ const styles = StyleSheet.create({
liked: {
color: colors.red3,
},
/* headerContainer: {
alignItems: 'center',
justifyContent: 'center',
gap: 8,
marginBottom: 12,
},
header: {
alignItems: 'center',
gap: 4,
},
avatarContainer: {
flexDirection: 'row',
alignItems: 'center',
gap: 8,
},
buttonsContainer: {
flexDirection: 'row',
gap: 8,
},
saveButton: {
minWidth: 100,
alignItems: 'center',
},
liked: {
color: colors.red3,
},
notLiked: {
color: colors.gray3,
},
likeButton: {
flexDirection: 'row',
alignItems: 'center',
justifyContent: 'center',
paddingVertical: 4,
paddingHorizontal: 8,
borderRadius: 24,
gap: 4,
},*/
})

View File

@ -0,0 +1,29 @@
import React from 'react'
import {View} from 'react-native'
import {useFocusEffect} from '@react-navigation/native'
import {NativeStackScreenProps, CommonNavigatorParams} from 'lib/routes/types'
import {withAuthRequired} from 'view/com/auth/withAuthRequired'
import {ViewHeader} from '../com/util/ViewHeader'
import {PostLikedBy as PostLikedByComponent} from '../com/post-thread/PostLikedBy'
import {useStores} from 'state/index'
import {makeRecordUri} from 'lib/strings/url-helpers'
type Props = NativeStackScreenProps<CommonNavigatorParams, 'CustomFeedLikedBy'>
export const CustomFeedLikedByScreen = withAuthRequired(({route}: Props) => {
const store = useStores()
const {name, rkey} = route.params
const uri = makeRecordUri(name, 'app.bsky.feed.generator', rkey)
useFocusEffect(
React.useCallback(() => {
store.shell.setMinimalShellMode(false)
}, [store]),
)
return (
<View>
<ViewHeader title="Liked by" />
<PostLikedByComponent uri={uri} />
</View>
)
})