Bluesky app fork with some witchin' additions 馃挮
witchsky.app
bluesky
fork
client
1import {View} from 'react-native'
2import {msg} from '@lingui/core/macro'
3import {useLingui} from '@lingui/react'
4import {Trans} from '@lingui/react/macro'
5
6import {atoms as a} from '#/alf'
7import {Button} from '#/components/Button'
8import {TimesLarge_Stroke2_Corner0_Rounded as CloseIcon} from '#/components/icons/Times'
9import * as Toast from '#/components/Toast'
10import {LiveEventFeedCardCompact} from '#/features/liveEvents/components/LiveEventFeedCardCompact'
11import {useUserPreferencedLiveEvents} from '#/features/liveEvents/context'
12import {useUpdateLiveEventPreferences} from '#/features/liveEvents/preferences'
13import {type LiveEventFeed} from '#/features/liveEvents/types'
14
15export function SidebarLiveEventFeedsBanner() {
16 const events = useUserPreferencedLiveEvents()
17 return events.feeds.map(feed => <Inner key={feed.id} feed={feed} />)
18}
19
20function Inner({feed}: {feed: LiveEventFeed}) {
21 const {_} = useLingui()
22 const layout = feed.layouts.wide
23
24 const {mutate: update, variables} = useUpdateLiveEventPreferences({
25 feed,
26 metricContext: 'sidebar',
27 onUpdateSuccess({undoAction}) {
28 Toast.show(
29 <Toast.Outer>
30 <Toast.Icon />
31 <Toast.Text>
32 {undoAction ? (
33 <Trans>Live event hidden</Trans>
34 ) : (
35 <Trans>Live event unhidden</Trans>
36 )}
37 </Toast.Text>
38 {undoAction && (
39 <Toast.Action
40 label={_(msg`Undo`)}
41 onPress={() => {
42 if (undoAction) {
43 update(undoAction)
44 }
45 }}>
46 <Trans>Undo</Trans>
47 </Toast.Action>
48 )}
49 </Toast.Outer>,
50 {type: 'success'},
51 )
52 },
53 })
54
55 if (variables) return null
56
57 return (
58 <View style={[a.relative]}>
59 <LiveEventFeedCardCompact feed={feed} metricContext="sidebar" />
60
61 <View
62 style={[a.justify_center, a.absolute, {top: 0, right: 6, bottom: 0}]}>
63 <Button
64 label={_(msg`Dismiss live event banner`)}
65 size="tiny"
66 shape="round"
67 style={[a.z_10]}
68 onPress={() => {
69 update({type: 'hideFeed', id: feed.id})
70 }}>
71 {({hovered, pressed}) => (
72 <>
73 <View
74 style={[
75 a.absolute,
76 a.inset_0,
77 a.rounded_full,
78 {
79 backgroundColor: layout.overlayColor,
80 opacity: hovered || pressed ? 0.8 : 0.6,
81 },
82 ]}
83 />
84 <CloseIcon size="xs" fill={layout.textColor} style={[a.z_20]} />
85 </>
86 )}
87 </Button>
88 </View>
89 </View>
90 )
91}