51:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 52:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 53:T208a,import ReactPlayer from "react-player"; import { MediaAudio } from "@lens-protocol/react"; import { getAudioExtension, parseUri } from "@/registry/new-york/lib/lens-utils"; import { SyntheticEvent, useRef, useState } from "react"; import { Button } from "@/registry/new-york/ui/button"; import { PauseIcon, PlayIcon, Volume2Icon, VolumeOffIcon } from "lucide-react"; import { MediaSeekSlider } from "@/registry/new-york/ui/media-seek-slider"; import { Duration } from "@/registry/new-york/ui/duration"; import { Skeleton } from "@/registry/new-york/ui/skeleton"; type Props = { audio: MediaAudio; postTitle?: string | null; preload?: "none" | "metadata" | "auto" | ""; onError?: (e: any) => void; onCoverClick?: (imageUri: string) => void; }; export const LensAudioPlayer = (props: Props) => { const { audio, postTitle, preload = "metadata", onError } = props; // ReactPlayer looks at the file extension in the source URI to determine how to play the file, // so we need to append the extension to the url for instances where the audio url does not have an extension // e.g., when using Grove urls like https://api.grove.storage/ // or when using a proxy server that does not preserve the original file name const audioUri = audio ? parseUri(audio.item) + "?extension=." + getAudioExtension(audio.type) : null; const playerRef = useRef(null); const initialState = { playing: false, volume: 1, muted: false, played: 0, loaded: 0, duration: 0, seeking: false, loadedSeconds: 0, playedSeconds: 0, }; type PlayerState = typeof initialState; const [state, setState] = useState(initialState); const [showTimeRemaining, setShowTimeRemaining] = useState(true); const [hasPlayed, setHasPlayed] = useState(false); if (!audio || !audioUri) { return null; } if (!ReactPlayer.canPlay?.(audioUri)) { return