1
0
mirror of https://github.com/tooot-app/app synced 2025-04-12 17:41:56 +02:00

Refine component account

This commit is contained in:
xmflsct 2022-12-04 12:57:03 +01:00
parent 6146ecf712
commit e1e700543f
2 changed files with 54 additions and 47 deletions

View File

@ -5,22 +5,17 @@ import { TabLocalStackParamList } from '@utils/navigation/navigators'
import { StyleConstants } from '@utils/styles/constants' import { StyleConstants } from '@utils/styles/constants'
import { useTheme } from '@utils/styles/ThemeManager' import { useTheme } from '@utils/styles/ThemeManager'
import React, { PropsWithChildren } from 'react' import React, { PropsWithChildren } from 'react'
import { Pressable, View } from 'react-native' import { Pressable, PressableProps, View } from 'react-native'
import GracefullyImage from './GracefullyImage' import GracefullyImage from './GracefullyImage'
import Icon from './Icon'
import CustomText from './Text' import CustomText from './Text'
export interface Props { export interface Props {
account: Mastodon.Account account: Mastodon.Account
Component?: typeof View | typeof Pressable props?: PressableProps
props?: {}
} }
const ComponentAccount: React.FC<PropsWithChildren & Props> = ({ const ComponentAccount: React.FC<PropsWithChildren & Props> = ({ account, props, children }) => {
account,
Component,
props,
children
}) => {
const { colors } = useTheme() const { colors } = useTheme()
const navigation = useNavigation<StackNavigationProp<TabLocalStackParamList>>() const navigation = useNavigation<StackNavigationProp<TabLocalStackParamList>>()
@ -28,19 +23,19 @@ const ComponentAccount: React.FC<PropsWithChildren & Props> = ({
props = { onPress: () => navigation.push('Tab-Shared-Account', { account }) } props = { onPress: () => navigation.push('Tab-Shared-Account', { account }) }
} }
return React.createElement( return (
Component || Pressable, <Pressable
{ {...props}
...props, style={{
style: {
flex: 1, flex: 1,
paddingHorizontal: StyleConstants.Spacing.Global.PagePadding, paddingHorizontal: StyleConstants.Spacing.Global.PagePadding,
paddingVertical: StyleConstants.Spacing.M, paddingVertical: StyleConstants.Spacing.M,
flexDirection: 'row', flexDirection: 'row',
justifyContent: 'space-between', justifyContent: 'space-between',
alignItems: 'center' alignItems: 'center'
} }}
}, children={
<>
<View style={{ flex: 1, flexDirection: 'row', alignItems: 'center' }}> <View style={{ flex: 1, flexDirection: 'row', alignItems: 'center' }}>
<GracefullyImage <GracefullyImage
uri={{ original: account.avatar, static: account.avatar_static }} uri={{ original: account.avatar, static: account.avatar_static }}
@ -70,8 +65,20 @@ const ComponentAccount: React.FC<PropsWithChildren & Props> = ({
@{account.acct} @{account.acct}
</CustomText> </CustomText>
</View> </View>
</View>, </View>
children {props.onPress && !props.disabled ? (
<Icon
name='ChevronRight'
size={StyleConstants.Font.Size.L}
color={colors.secondary}
style={{ marginLeft: 8 }}
/>
) : (
children || null
)}
</>
}
/>
) )
} }

View File

@ -57,7 +57,6 @@ const TabMeListAccounts: React.FC<TabMeStackScreenProps<'Tab-Me-List-Accounts'>>
<ComponentAccount <ComponentAccount
key={index} key={index}
account={item} account={item}
Component={View}
children={ children={
<Button <Button
type='icon' type='icon'
@ -68,6 +67,7 @@ const TabMeListAccounts: React.FC<TabMeStackScreenProps<'Tab-Me-List-Accounts'>>
} }
/> />
} }
props={{ disabled: true }}
/> />
)} )}
ListEmptyComponent={ ListEmptyComponent={