diff --git a/components/TrackSheet.tsx b/components/TrackSheet.tsx index 59ddf515..4dda0564 100644 --- a/components/TrackSheet.tsx +++ b/components/TrackSheet.tsx @@ -33,12 +33,27 @@ export const TrackSheet: React.FC = ({ () => streams?.find((x) => x.Index === selected), [streams, selected], ); + + const noneOption = useMemo( + () => ({ Index: -1, DisplayTitle: t("common.none") }), + [t], + ); + + // Creates a modified data array that includes a "None" option for subtitles + // We might want to possibly do this for other places, like audio? + const addNoneToSubtitles = useMemo(() => { + if (streamType === "Subtitle") { + const result = streams ? [noneOption, ...streams] : [noneOption]; + return result; + } + return streams; + }, [streams, streamType, noneOption]); const [open, setOpen] = useState(false); if (isTv || (streams && streams.length === 0)) return null; return ( - + {title} = ({ onPress={() => setOpen(true)} > - {selectedSteam?.DisplayTitle || t("common.select", "Select")} + {selected === -1 && streamType === "Subtitle" + ? t("common.none") + : selectedSteam?.DisplayTitle || t("common.select", "Select")} @@ -54,8 +71,14 @@ export const TrackSheet: React.FC = ({ open={open} setOpen={setOpen} title={title} - data={streams || []} - values={selectedSteam ? [selectedSteam] : []} + data={addNoneToSubtitles || []} + values={ + selected === -1 && streamType === "Subtitle" + ? [{ Index: -1, DisplayTitle: t("common.none") }] + : selectedSteam + ? [selectedSteam] + : [] + } multiple={false} searchFilter={(item, query) => { const label = (item as any).DisplayTitle || ""; diff --git a/components/filters/FilterSheet.tsx b/components/filters/FilterSheet.tsx index 30bbe948..27075f8b 100644 --- a/components/filters/FilterSheet.tsx +++ b/components/filters/FilterSheet.tsx @@ -109,11 +109,22 @@ export const FilterSheet = ({ // to implement efficient "load more" functionality useEffect(() => { if (!_data || _data.length === 0) return; - const tmp = new Set(data); + + const newData = [...data]; + for (let i = offset; i < Math.min(_data.length, offset + LIMIT); i++) { - tmp.add(_data[i]); + const item = _data[i]; + // Check if this item already exists in our data array + // some dups happened with re-renders during testing + const exists = newData.some((existingItem) => + isEqual(existingItem, item), + ); + if (!exists) { + newData.push(item); + } } - setData(Array.from(tmp)); + + setData(newData); }, [offset, _data]); useEffect(() => { @@ -233,7 +244,7 @@ export const FilterSheet = ({ {data.length < (_data?.length || 0) && (