Add share warning to big share button in post ctrl (#3367)

This commit is contained in:
Samuel Newman 2024-04-03 11:03:54 -07:00 committed by GitHub
parent 907c7c0586
commit 75c9da931c
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 87 additions and 58 deletions

View file

@ -12,29 +12,32 @@ import {
AtUri,
RichText as RichTextAPI,
} from '@atproto/api'
import {Text} from '../text/Text'
import {PostDropdownBtn} from '../forms/PostDropdownBtn'
import {HeartIcon, HeartIconSolid, CommentBottomArrow} from 'lib/icons'
import {s} from 'lib/styles'
import {pluralize} from 'lib/strings/helpers'
import {useTheme} from 'lib/ThemeContext'
import {RepostButton} from './RepostButton'
import {Haptics} from 'lib/haptics'
import {HITSLOP_10, HITSLOP_20} from 'lib/constants'
import {msg} from '@lingui/macro'
import {useLingui} from '@lingui/react'
import {HITSLOP_10, HITSLOP_20} from '#/lib/constants'
import {Haptics} from '#/lib/haptics'
import {CommentBottomArrow, HeartIcon, HeartIconSolid} from '#/lib/icons'
import {makeProfileLink} from '#/lib/routes/links'
import {shareUrl} from '#/lib/sharing'
import {pluralize} from '#/lib/strings/helpers'
import {toShareUrl} from '#/lib/strings/url-helpers'
import {s} from '#/lib/styles'
import {useTheme} from '#/lib/ThemeContext'
import {Shadow} from '#/state/cache/types'
import {useModalControls} from '#/state/modals'
import {
usePostLikeMutationQueue,
usePostRepostMutationQueue,
} from '#/state/queries/post'
import {useComposerControls} from '#/state/shell/composer'
import {Shadow} from '#/state/cache/types'
import {useRequireAuth} from '#/state/session'
import {msg} from '@lingui/macro'
import {useLingui} from '@lingui/react'
import {useComposerControls} from '#/state/shell/composer'
import {useDialogControl} from '#/components/Dialog'
import {ArrowOutOfBox_Stroke2_Corner0_Rounded as ArrowOutOfBox} from '#/components/icons/ArrowOutOfBox'
import {toShareUrl} from 'lib/strings/url-helpers'
import {shareUrl} from 'lib/sharing'
import {makeProfileLink} from 'lib/routes/links'
import * as Prompt from '#/components/Prompt'
import {PostDropdownBtn} from '../forms/PostDropdownBtn'
import {Text} from '../text/Text'
import {RepostButton} from './RepostButton'
let PostCtrls = ({
big,
@ -63,6 +66,13 @@ let PostCtrls = ({
logContext,
)
const requireAuth = useRequireAuth()
const loggedOutWarningPromptControl = useDialogControl()
const shouldShowLoggedOutWarning = React.useMemo(() => {
return !!post.author.labels?.find(
label => label.val === '!no-unauthenticated',
)
}, [post])
const defaultCtrlColor = React.useMemo(
() => ({
@ -209,18 +219,38 @@ let PostCtrls = ({
</TouchableOpacity>
</View>
{big && (
<View style={styles.ctrlBig}>
<TouchableOpacity
testID="shareBtn"
style={[styles.btn]}
onPress={onShare}
accessibilityRole="button"
accessibilityLabel={`${_(msg`Share`)}`}
accessibilityHint=""
hitSlop={big ? HITSLOP_20 : HITSLOP_10}>
<ArrowOutOfBox style={[defaultCtrlColor, styles.mt1]} width={22} />
</TouchableOpacity>
</View>
<>
<View style={styles.ctrlBig}>
<TouchableOpacity
testID="shareBtn"
style={[styles.btn]}
onPress={() => {
if (shouldShowLoggedOutWarning) {
loggedOutWarningPromptControl.open()
} else {
onShare()
}
}}
accessibilityRole="button"
accessibilityLabel={`${_(msg`Share`)}`}
accessibilityHint=""
hitSlop={big ? HITSLOP_20 : HITSLOP_10}>
<ArrowOutOfBox
style={[defaultCtrlColor, styles.mt1]}
width={22}
/>
</TouchableOpacity>
</View>
<Prompt.Basic
control={loggedOutWarningPromptControl}
title={_(msg`Note about sharing`)}
description={_(
msg`This post is only visible to logged-in users. It won't be visible to people who aren't logged in.`,
)}
onConfirm={onShare}
confirmButtonCta={_(msg`Share anyway`)}
/>
</>
)}
<View style={big ? styles.ctrlBig : styles.ctrl}>
<PostDropdownBtn