import { Platform, Pressable, View, type StyleProp, type ViewStyle } from "react-native"; import { cn } from "../lib/cn";import type { DraftComposerFileAttachment } from "../lib/composerImages";import { SymbolView } from "./AppSymbol";import { AppText } from "./AppText";import { VideoAttachmentMenu } from "./VideoAttachmentMenu";import { VideoThumbnailImage } from "./VideoThumbnailImage"; export function VideoAttachmentTile(props: {  readonly name: string;  readonly sourceIdentifier: string;  readonly thumbnailSource: string | DraftComposerFileAttachment | null;  readonly compact?: boolean;  readonly onPress: (sourceIdentifier: string) => void;  readonly onShare?: () => void;  readonly disabled?: boolean;  readonly className?: string;  readonly style?: StyleProp<ViewStyle>;}) {  return (    <VideoAttachmentMenu      sourceIdentifier={props.sourceIdentifier}      onOpen={() => props.onPress(props.sourceIdentifier)}      onShare={props.onShare}      disabled={props.disabled}    >      <Pressable        accessibilityRole="button"        accessibilityLabel={`Play ${props.name}`}        accessibilityHint={          Platform.OS === "ios" && props.onShare            ? "Touch and hold for save and share options"            : undefined        }        accessibilityState={{ disabled: props.disabled ?? false }}        disabled={props.disabled}        onPress={() => props.onPress(props.sourceIdentifier)}        className={cn("items-center justify-center overflow-hidden bg-black/80", props.className)}        style={props.style}      >        <VideoThumbnailImage cacheKey={props.sourceIdentifier} source={props.thumbnailSource} />        <View          className={cn(            "items-center justify-center rounded-full bg-black/45",            props.compact ? "size-6" : "size-12",          )}        >          <SymbolView            name="play"            size={props.compact ? 15 : 24}            tintColor="#ffffff"            type="monochrome"          />        </View>        {!props.compact ? (          <View className="absolute inset-x-0 bottom-0 bg-black/55 px-2 py-1.5">            <AppText className="text-center text-xs text-white" numberOfLines={1}>              {props.name}            </AppText>          </View>        ) : null}      </Pressable>    </VideoAttachmentMenu>  );}