diff --git a/app/(auth)/items/[id]/page.tsx b/app/(auth)/items/[id]/page.tsx index 0abc1e4d..d2118d5e 100644 --- a/app/(auth)/items/[id]/page.tsx +++ b/app/(auth)/items/[id]/page.tsx @@ -46,6 +46,8 @@ const page: React.FC = () => { value: undefined, }); + const [selectedAudioStream, setSelectedAudioStream] = useState(0); + const { data: item, isLoading: l1 } = useQuery({ queryKey: ["item", id], queryFn: async () => @@ -224,7 +226,11 @@ const page: React.FC = () => { onChange={(val) => setMaxBitrate(val)} selected={maxBitrate} /> - {}} selected={null} /> + diff --git a/components/AudioTrackSelector.tsx b/components/AudioTrackSelector.tsx index 5b702d9b..84c777f4 100644 --- a/components/AudioTrackSelector.tsx +++ b/components/AudioTrackSelector.tsx @@ -5,6 +5,7 @@ import { atom, useAtom } from "jotai"; import { BaseItemDto } from "@jellyfin/sdk/lib/generated-client/models"; import { useEffect, useMemo } from "react"; import { MediaStream } from "@jellyfin/sdk/lib/generated-client/models"; +import { tc } from "@/utils/textTools"; interface Props extends React.ComponentProps { item: BaseItemDto; @@ -18,10 +19,6 @@ export const AudioTrackSelector: React.FC = ({ selected, ...props }) => { - console.log( - item.MediaSources?.[0].MediaStreams?.filter((x) => x.Type === "Audio"), - ); - const audioStreams = useMemo( () => item.MediaSources?.[0].MediaStreams?.filter((x) => x.Type === "Audio"), @@ -33,15 +30,20 @@ export const AudioTrackSelector: React.FC = ({ [audioStreams, selected], ); + useEffect(() => { + console.log(audioStreams, selected); + }, [audioStreams, selected]); return ( - Bitrate + Audio streams - - {selectedAudioSteam?.DisplayTitle} + + + {tc(selectedAudioSteam?.DisplayTitle, 13)} + @@ -55,7 +57,7 @@ export const AudioTrackSelector: React.FC = ({ collisionPadding={8} sideOffset={8} > - Bitrates + Audio streams {audioStreams?.map((audio, index: number) => ( = ({ Bitrate - + {BITRATES.find((b) => b.value === selected.value)?.key} diff --git a/utils/textTools.ts b/utils/textTools.ts new file mode 100644 index 00000000..ce12b61b --- /dev/null +++ b/utils/textTools.ts @@ -0,0 +1,7 @@ +/* + * Truncate a text longer than a certain length + */ +export const tc = (text: string | null | undefined, length: number = 20) => { + if (!text) return ""; + return text.length > length ? text.substr(0, length) + "..." : text; +};