f18b9b32b0
* Base work for public view * Make default moderation settings more restrictive * Fix type * Handle showing sign-in on authed actions * Fix hoc logic * Simplify prefs logic * Remove duplicate method * Add todo * Clean up RepostButton.web * Fix x button color * Add todo * Retain existing label prefs for now, use separate logged out settings * Clean up useAuthedMethod, rename to useRequireAuth * Add todos * Move dismiss logic to withAuthRequired * Ooops add web * Block public view in prod * Add todo * Fix bad import
128 lines
2.8 KiB
TypeScript
128 lines
2.8 KiB
TypeScript
import React from 'react'
|
|
import {StyleProp, StyleSheet, View, ViewStyle, Pressable} from 'react-native'
|
|
import {RepostIcon} from 'lib/icons'
|
|
import {colors} from 'lib/styles'
|
|
import {useTheme} from 'lib/ThemeContext'
|
|
import {Text} from '../text/Text'
|
|
|
|
import {
|
|
NativeDropdown,
|
|
DropdownItem as NativeDropdownItem,
|
|
} from '../forms/NativeDropdown'
|
|
import {EventStopper} from '../EventStopper'
|
|
import {useLingui} from '@lingui/react'
|
|
import {msg} from '@lingui/macro'
|
|
import {useRequireAuth} from '#/state/session'
|
|
import {useSession} from '#/state/session'
|
|
|
|
interface Props {
|
|
isReposted: boolean
|
|
repostCount?: number
|
|
big?: boolean
|
|
onRepost: () => void
|
|
onQuote: () => void
|
|
style?: StyleProp<ViewStyle>
|
|
}
|
|
|
|
export const RepostButton = ({
|
|
isReposted,
|
|
repostCount,
|
|
big,
|
|
onRepost,
|
|
onQuote,
|
|
}: Props) => {
|
|
const theme = useTheme()
|
|
const {_} = useLingui()
|
|
const {hasSession} = useSession()
|
|
const requireAuth = useRequireAuth()
|
|
|
|
const defaultControlColor = React.useMemo(
|
|
() => ({
|
|
color: theme.palette.default.postCtrl,
|
|
}),
|
|
[theme],
|
|
)
|
|
|
|
const dropdownItems: NativeDropdownItem[] = [
|
|
{
|
|
label: isReposted ? _(msg`Undo repost`) : _(msg`Repost`),
|
|
testID: 'repostDropdownRepostBtn',
|
|
icon: {
|
|
ios: {name: 'repeat'},
|
|
android: '',
|
|
web: 'retweet',
|
|
},
|
|
onPress: onRepost,
|
|
},
|
|
{
|
|
label: _(msg`Quote post`),
|
|
testID: 'repostDropdownQuoteBtn',
|
|
icon: {
|
|
ios: {name: 'quote.bubble'},
|
|
android: '',
|
|
web: 'quote-left',
|
|
},
|
|
onPress: onQuote,
|
|
},
|
|
]
|
|
|
|
const inner = (
|
|
<View
|
|
style={[
|
|
styles.control,
|
|
!big && styles.controlPad,
|
|
(isReposted
|
|
? styles.reposted
|
|
: defaultControlColor) as StyleProp<ViewStyle>,
|
|
]}>
|
|
<RepostIcon strokeWidth={2.2} size={big ? 24 : 20} />
|
|
{typeof repostCount !== 'undefined' ? (
|
|
<Text
|
|
testID="repostCount"
|
|
type={isReposted ? 'md-bold' : 'md'}
|
|
style={styles.repostCount}>
|
|
{repostCount ?? 0}
|
|
</Text>
|
|
) : undefined}
|
|
</View>
|
|
)
|
|
|
|
return hasSession ? (
|
|
<EventStopper>
|
|
<NativeDropdown
|
|
items={dropdownItems}
|
|
accessibilityLabel={_(msg`Repost or quote post`)}
|
|
accessibilityHint="">
|
|
{inner}
|
|
</NativeDropdown>
|
|
</EventStopper>
|
|
) : (
|
|
<Pressable
|
|
accessibilityRole="button"
|
|
onPress={() => {
|
|
requireAuth(() => {})
|
|
}}
|
|
accessibilityLabel={_(msg`Repost or quote post`)}
|
|
accessibilityHint="">
|
|
{inner}
|
|
</Pressable>
|
|
)
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
control: {
|
|
display: 'flex',
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
gap: 4,
|
|
},
|
|
controlPad: {
|
|
padding: 5,
|
|
},
|
|
reposted: {
|
|
color: colors.green3,
|
|
},
|
|
repostCount: {
|
|
color: 'currentColor',
|
|
},
|
|
})
|