From 15dd68ad73e02a8dbf9d56e9cbbd5439fe035aba Mon Sep 17 00:00:00 2001 From: Foysal Ahamed Date: Fri, 10 Jan 2025 14:24:59 +0000 Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20Add=20video=20fallback=20url=20(#27?= =?UTF-8?q?7)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * :sparkles: Add video fallback url for deactivated accounts * :sparkles: Add fallback for takendown accounts too * :sparkles: Add fallback url in author feed --- app/actions/ModActionPanel/QuickAction.tsx | 4 ++ components/common/PreviewCard.tsx | 10 ++++- components/common/RecordCard.tsx | 37 +++++++++++++++-- components/common/feeds/AuthorFeed.tsx | 6 +++ components/common/posts/Posts.tsx | 6 +++ components/common/posts/PostsFeed.tsx | 47 +++++++++++++++++++--- components/common/video/helpers.ts | 17 ++++++++ components/repositories/AccountView.tsx | 24 +++++++++-- lib/constants.ts | 4 ++ 9 files changed, 142 insertions(+), 13 deletions(-) create mode 100644 components/common/video/helpers.ts diff --git a/app/actions/ModActionPanel/QuickAction.tsx b/app/actions/ModActionPanel/QuickAction.tsx index ca3a5a30..fdf5e69d 100644 --- a/app/actions/ModActionPanel/QuickAction.tsx +++ b/app/actions/ModActionPanel/QuickAction.tsx @@ -596,6 +596,10 @@ function Form(
{!isSubjectDid && record?.repo && ( diff --git a/components/common/PreviewCard.tsx b/components/common/PreviewCard.tsx index ca77ad79..04cf6c88 100644 --- a/components/common/PreviewCard.tsx +++ b/components/common/PreviewCard.tsx @@ -28,8 +28,12 @@ export function PreviewCard({ title, children, className, + isAuthorDeactivated, + isAuthorTakendown, }: { subject: string + isAuthorDeactivated?: boolean + isAuthorTakendown?: boolean title?: string | ReactNode children?: ReactNode className?: string @@ -41,7 +45,11 @@ export function PreviewCard({

{displayTitle}

- + {children}
) diff --git a/components/common/RecordCard.tsx b/components/common/RecordCard.tsx index 5c324033..fdb7d97d 100644 --- a/components/common/RecordCard.tsx +++ b/components/common/RecordCard.tsx @@ -17,14 +17,31 @@ import { ShieldCheckIcon } from '@heroicons/react/24/solid' import { StarterPackRecordCard } from './starterpacks/RecordCard' import { useLabelerAgent } from '@/shell/ConfigurationContext' -export function RecordCard(props: { uri: string; showLabels?: boolean }) { - const { uri, showLabels = false } = props +export function RecordCard(props: { + uri: string + showLabels?: boolean + isAuthorDeactivated?: boolean + isAuthorTakendown?: boolean +}) { + const { + uri, + showLabels = false, + isAuthorDeactivated, + isAuthorTakendown, + } = props const parsed = parseAtUri(uri) if (!parsed) { return null } if (parsed.collection === CollectionId.Post) { - return + return ( + + ) } if (parsed.collection === CollectionId.FeedGenerator) { return @@ -53,7 +70,17 @@ export function RecordCard(props: { uri: string; showLabels?: boolean }) { ) } -function PostCard({ uri, showLabels }: { uri: string; showLabels?: boolean }) { +function PostCard({ + uri, + showLabels, + isAuthorTakendown, + isAuthorDeactivated, +}: { + uri: string + showLabels?: boolean + isAuthorTakendown?: boolean + isAuthorDeactivated?: boolean +}) { const labelerAgent = useLabelerAgent() const { error, data } = useQuery({ @@ -118,6 +145,8 @@ function PostCard({ uri, showLabels }: { uri: string; showLabels?: boolean }) { dense showLabels={showLabels} item={{ post: data.thread.post }} + isAuthorTakendown={isAuthorTakendown} + isAuthorDeactivated={isAuthorDeactivated} controls={['like', 'repost', 'workspace']} /> ) diff --git a/components/common/feeds/AuthorFeed.tsx b/components/common/feeds/AuthorFeed.tsx index 422f64dd..669dfc41 100644 --- a/components/common/feeds/AuthorFeed.tsx +++ b/components/common/feeds/AuthorFeed.tsx @@ -128,8 +128,12 @@ export const useAuthorFeedQuery = ({ export function AuthorFeed({ id, onReport, + isAuthorDeactivated, + isAuthorTakendown, }: { id: string + isAuthorDeactivated: boolean + isAuthorTakendown: boolean onReport: (uri: string) => void }) { const [query, setQuery] = useState('') @@ -154,6 +158,8 @@ export function AuthorFeed({ onLoadMore={hasNextPage ? () => fetchNextPage() : undefined} typeFilter={typeFilter} setTypeFilter={setTypeFilter} + isAuthorDeactivated={isAuthorDeactivated} + isAuthorTakendown={isAuthorTakendown} /> ) } diff --git a/components/common/posts/Posts.tsx b/components/common/posts/Posts.tsx index 0bd563f9..9c7c47aa 100644 --- a/components/common/posts/Posts.tsx +++ b/components/common/posts/Posts.tsx @@ -26,6 +26,8 @@ export function Posts({ setSearchQuery, typeFilter, setTypeFilter, + isAuthorDeactivated, + isAuthorTakendown, }: { isFromAppview?: boolean items: AppBskyFeedDefs.FeedViewPost[] @@ -36,6 +38,8 @@ export function Posts({ setSearchQuery: (query: string) => void typeFilter: TypeFilterKey setTypeFilter: (type: TypeFilterKey) => void + isAuthorDeactivated: boolean + isAuthorTakendown: boolean }) { const [mode, setMode] = useState(Mode.Feed) @@ -103,6 +107,8 @@ export function Posts({ {mode === Mode.Feed ? (
import('@/common/video/player'), { ssr: false, }) @@ -51,10 +52,14 @@ export function PostsFeed({ items, onReport, onLoadMore, + isAuthorDeactivated, + isAuthorTakendown, }: { items: AppBskyFeedDefs.FeedViewPost[] onReport: (uri: string) => void onLoadMore?: () => void + isAuthorDeactivated?: boolean + isAuthorTakendown?: boolean }) { return (
@@ -63,7 +68,13 @@ export function PostsFeed({ key={`post-${i}`} className="bg-white dark:bg-slate-800 border-b border-gray-200 dark:border-slate-700 pt-6 pb-4 px-4" > - +
))} {onLoadMore && } @@ -87,10 +98,14 @@ export function PostAsCard({ onReport, className = '', showLabels = true, + isAuthorDeactivated, + isAuthorTakendown, controls = [...PostControlOptions], }: { item: AppBskyFeedDefs.FeedViewPost dense?: boolean + isAuthorDeactivated?: boolean + isAuthorTakendown?: boolean controls?: PostControl[] onReport?: (uri: string) => void className?: string @@ -100,7 +115,11 @@ export function PostAsCard({
- + {showLabels && } {!!controls?.length && ( @@ -237,7 +256,15 @@ function PostContent({ const getImageSizeClass = (imageCount: number) => imageCount < 3 ? 'w-32 h-32' : 'w-20 h-20' -export function PostEmbeds({ item }: { item: AppBskyFeedDefs.FeedViewPost }) { +export function PostEmbeds({ + item, + isAuthorTakendown, + isAuthorDeactivated, +}: { + isAuthorTakendown?: boolean + isAuthorDeactivated?: boolean + item: AppBskyFeedDefs.FeedViewPost +}) { const { getMediaFiltersForLabels } = useGraphicMediaPreferences() const embed = AppBskyEmbedRecordWithMedia.isView(item.post.embed) ? item.post.embed.media @@ -254,11 +281,21 @@ export function PostEmbeds({ item }: { item: AppBskyFeedDefs.FeedViewPost }) { if (AppBskyEmbedVideo.isView(embed)) { const captions = item.post.record?.['embed']?.['captions'] + const sourceUrl = getVideoUrlWithFallback(embed.playlist, { + isAuthorDeactivated, + isAuthorTakendown, + }) + const thumbnailUrl = embed.thumbnail + ? getVideoUrlWithFallback(embed.thumbnail, { + isAuthorDeactivated, + isAuthorTakendown, + }) + : undefined return (
{ + const [find, replace] = FALLBACK_VIDEO_URL + if (!find || !replace) { + return originalUri + } + + if (!opts?.isAuthorDeactivated && !opts?.isAuthorTakendown) { + return originalUri + } + + return originalUri.replace(find, replace) +} diff --git a/components/repositories/AccountView.tsx b/components/repositories/AccountView.tsx index eec6c9ba..8befa06e 100644 --- a/components/repositories/AccountView.tsx +++ b/components/repositories/AccountView.tsx @@ -233,7 +233,14 @@ export function AccountView({
)} {currentView === Views.Posts && ( - + )} {currentView === Views.Follows && ( @@ -640,7 +647,7 @@ function Details({ - + {!tags.length && } {tags.map((tag) => ( @@ -692,11 +699,22 @@ function Details({ function Posts({ id, onReport, + isAuthorDeactivated, + isAuthorTakendown, }: { id: string onReport: (uri: string) => void + isAuthorDeactivated: boolean + isAuthorTakendown: boolean }) { - return + return ( + + ) } function Invites({ repo }: { repo: GetRepo.OutputSchema }) { diff --git a/lib/constants.ts b/lib/constants.ts index a0faaf2c..f1253aed 100644 --- a/lib/constants.ts +++ b/lib/constants.ts @@ -51,3 +51,7 @@ export const HIGH_PROFILE_FOLLOWER_THRESHOLD = process.env .NEXT_PUBLIC_HIGH_PROFILE_FOLLOWER_THRESHOLD ? parseInt(process.env.NEXT_PUBLIC_HIGH_PROFILE_FOLLOWER_THRESHOLD) : Infinity + +export const FALLBACK_VIDEO_URL = ( + process.env.NEXT_PUBLIC_FALLBACK_VIDEO_URL || '' +).split(':')