diff options
Diffstat (limited to 'src/components/live/GoLiveDialog.tsx')
| -rw-r--r-- | src/components/live/GoLiveDialog.tsx | 114 |
1 files changed, 4 insertions, 110 deletions
diff --git a/src/components/live/GoLiveDialog.tsx b/src/components/live/GoLiveDialog.tsx index 027447272..1c5fa27a7 100644 --- a/src/components/live/GoLiveDialog.tsx +++ b/src/components/live/GoLiveDialog.tsx @@ -1,33 +1,25 @@ import {useCallback, useState} from 'react' import {View} from 'react-native' -import {Image} from 'expo-image' import {msg, Trans} from '@lingui/macro' import {useLingui} from '@lingui/react' -import {useQuery} from '@tanstack/react-query' -import {getLinkMeta} from '#/lib/link-meta/link-meta' import {cleanError} from '#/lib/strings/errors' -import {toNiceDomain} from '#/lib/strings/url-helpers' import {definitelyUrl} from '#/lib/strings/url-helpers' import {useModerationOpts} from '#/state/preferences/moderation-opts' -import {useLiveNowConfig} from '#/state/service-config' -import {useAgent, useSession} from '#/state/session' import {useTickEveryMinute} from '#/state/shell' -import {LoadingPlaceholder} from '#/view/com/util/LoadingPlaceholder' import {atoms as a, ios, native, platform, useTheme, web} from '#/alf' import {Admonition} from '#/components/Admonition' import {Button, ButtonIcon, ButtonText} from '#/components/Button' import * as Dialog from '#/components/Dialog' import * as TextField from '#/components/forms/TextField' -import {CircleX_Stroke2_Corner0_Rounded as CircleXIcon} from '#/components/icons/CircleX' -import {Globe_Stroke2_Corner0_Rounded as GlobeIcon} from '#/components/icons/Globe' import {Warning_Stroke2_Corner0_Rounded as WarningIcon} from '#/components/icons/Warning' import {Loader} from '#/components/Loader' import * as ProfileCard from '#/components/ProfileCard' import * as Select from '#/components/Select' import {Text} from '#/components/Typography' import type * as bsky from '#/types/bsky' -import {useUpsertLiveStatusMutation} from './queries' +import {LinkPreview} from './LinkPreview' +import {useLiveLinkMetaQuery, useUpsertLiveStatusMutation} from './queries' import {displayDuration, useDebouncedValue} from './utils' export function GoLiveDialog({ @@ -52,17 +44,11 @@ function DialogInner({profile}: {profile: bsky.profile.AnyProfileView}) { const control = Dialog.useDialogContext() const {_, i18n} = useLingui() const t = useTheme() - const agent = useAgent() const [liveLink, setLiveLink] = useState('') const [liveLinkError, setLiveLinkError] = useState('') - const [imageLoadError, setImageLoadError] = useState(false) const [duration, setDuration] = useState(60) const moderationOpts = useModerationOpts() const tick = useTickEveryMinute() - const liveNowConfig = useLiveNowConfig() - const {currentAccount} = useSession() - - const config = liveNowConfig.find(cfg => cfg.did === currentAccount?.did) const time = useCallback( (offset: number) => { @@ -90,21 +76,7 @@ function DialogInner({profile}: {profile: bsky.profile.AnyProfileView}) { isSuccess: hasValidLinkMeta, isLoading: linkMetaLoading, error: linkMetaError, - } = useQuery({ - enabled: !!debouncedUrl, - queryKey: ['link-meta', debouncedUrl], - queryFn: async () => { - if (!debouncedUrl) return null - if (!config) throw new Error(_(msg`You are not allowed to go live`)) - - const urlp = new URL(debouncedUrl) - if (!config.domains.includes(urlp.hostname)) { - throw new Error(_(msg`${urlp.hostname} is not a valid URL`)) - } - - return getLinkMeta(agent, debouncedUrl) - }, - }) + } = useLiveLinkMetaQuery(debouncedUrl) const { mutate: goLive, @@ -193,85 +165,7 @@ function DialogInner({profile}: {profile: bsky.profile.AnyProfileView}) { </View> )} - {(linkMeta || linkMetaLoading) && ( - <View - style={[ - a.w_full, - a.border, - t.atoms.border_contrast_low, - t.atoms.bg, - a.flex_row, - a.rounded_sm, - a.overflow_hidden, - a.align_stretch, - ]}> - {(!linkMeta || linkMeta.image) && ( - <View - style={[ - t.atoms.bg_contrast_25, - {minHeight: 64, width: 114}, - a.justify_center, - a.align_center, - ]}> - {linkMeta?.image && ( - <Image - source={linkMeta.image} - accessibilityIgnoresInvertColors - transition={200} - style={[a.absolute, a.inset_0]} - contentFit="cover" - onLoad={() => setImageLoadError(false)} - onError={() => setImageLoadError(true)} - /> - )} - {linkMeta && imageLoadError && ( - <CircleXIcon - style={[t.atoms.text_contrast_low]} - size="xl" - /> - )} - </View> - )} - <View - style={[ - a.flex_1, - a.justify_center, - a.py_sm, - a.gap_xs, - a.px_md, - ]}> - {linkMeta ? ( - <> - <Text - numberOfLines={2} - style={[a.leading_snug, a.font_bold, a.text_md]}> - {linkMeta.title || linkMeta.url} - </Text> - <View style={[a.flex_row, a.align_center, a.gap_2xs]}> - <GlobeIcon - size="xs" - style={[t.atoms.text_contrast_low]} - /> - <Text - numberOfLines={1} - style={[ - a.text_xs, - a.leading_snug, - t.atoms.text_contrast_medium, - ]}> - {toNiceDomain(linkMeta.url)} - </Text> - </View> - </> - ) : ( - <> - <LoadingPlaceholder height={16} width={128} /> - <LoadingPlaceholder height={12} width={72} /> - </> - )} - </View> - </View> - )} + <LinkPreview linkMeta={linkMeta} loading={linkMetaLoading} /> </View> {hasLink && ( |