ansxor.ca
forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 馃挮
xan.lol
Merge remote-tracking branch 'upstream/main' these messages.po got my ass (until I used AI to get proper GIT COMMANDS running!)
1import {useCallback, useEffect, useState} from 'react'
2import {type ModerationOpts} from '@atproto/api'
3import {msg, Trans} from '@lingui/macro'
4import {useLingui} from '@lingui/react'
5
6import {useRequireEmailVerification} from '#/lib/hooks/useRequireEmailVerification'
7import {createSanitizedDisplayName} from '#/lib/moderation/create-sanitized-display-name'
8import {useEnableSquareButtons} from '#/state/preferences/enable-square-buttons'
9import {Button, ButtonIcon} from '#/components/Button'
10import {useDialogControl} from '#/components/Dialog'
11import {BellPlus_Stroke2_Corner0_Rounded as BellPlusIcon} from '#/components/icons/BellPlus'
12import {BellRinging_Filled_Corner0_Rounded as BellRingingIcon} from '#/components/icons/BellRinging'
13import * as Tooltip from '#/components/Tooltip'
14import {Text} from '#/components/Typography'
15import {useActivitySubscriptionsNudged} from '#/storage/hooks/activity-subscriptions-nudged'
16import type * as bsky from '#/types/bsky'
17import {SubscribeProfileDialog} from './SubscribeProfileDialog'
18
19export function SubscribeProfileButton({
20 profile,
21 moderationOpts,
22 disableHint,
23}: {
24 profile: bsky.profile.AnyProfileView
25 moderationOpts: ModerationOpts
26 disableHint?: boolean
27}) {
28 const {_} = useLingui()
29 const requireEmailVerification = useRequireEmailVerification()
30 const subscribeDialogControl = useDialogControl()
31 const [activitySubscriptionsNudged, setActivitySubscriptionsNudged] =
32 useActivitySubscriptionsNudged()
33 const [showTooltip, setShowTooltip] = useState(false)
34
35 useEffect(() => {
36 if (!activitySubscriptionsNudged) {
37 const timeout = setTimeout(() => {
38 setShowTooltip(true)
39 }, 500)
40 return () => clearTimeout(timeout)
41 }
42 }, [activitySubscriptionsNudged])
43
44 const onDismissTooltip = (visible: boolean) => {
45 if (visible) return
46
47 setShowTooltip(false)
48 setActivitySubscriptionsNudged(true)
49 }
50
51 const onPress = useCallback(() => {
52 subscribeDialogControl.open()
53 }, [subscribeDialogControl])
54
55 const name = createSanitizedDisplayName(profile, true)
56
57 const wrappedOnPress = requireEmailVerification(onPress, {
58 instructions: [
59 <Trans key="message">
60 Before you can get notifications for {name}'s skeets, you must first
61 verify your email.
62 </Trans>,
63 ],
64 })
65
66 const isSubscribed =
67 profile.viewer?.activitySubscription?.post ||
68 profile.viewer?.activitySubscription?.reply
69
70 const Icon = isSubscribed ? BellRingingIcon : BellPlusIcon
71
72 const enableSquareButtons = useEnableSquareButtons()
73
74 return (
75 <>
76 <Tooltip.Outer
77 visible={showTooltip && !disableHint}
78 onVisibleChange={onDismissTooltip}
79 position="bottom">
80 <Tooltip.Target>
81 <Button
82 accessibilityRole="button"
83 testID="dmBtn"
84 size="small"
85 color="secondary"
86 shape={enableSquareButtons ? 'square' : 'round'}
87 label={_(msg`Get notified when ${name} skeets`)}
88 onPress={wrappedOnPress}>
89 <ButtonIcon icon={Icon} size="md" />
90 </Button>
91 </Tooltip.Target>
92 <Tooltip.TextBubble>
93 <Text>
94 <Trans>Get notified about new skeets</Trans>
95 </Text>
96 </Tooltip.TextBubble>
97 </Tooltip.Outer>
98
99 <SubscribeProfileDialog
100 control={subscribeDialogControl}
101 profile={profile}
102 moderationOpts={moderationOpts}
103 />
104 </>
105 )
106}