feat: KSPlayer as an option for iOS + other improvements (#1266)

components/AddToWatchlist.tsx

@@ -0,0 +1,43 @@
+import type { BaseItemDto } from "@jellyfin/sdk/lib/generated-client";
+import type { FC } from "react";
+import { useCallback, useRef } from "react";
+import { View, type ViewProps } from "react-native";
+import { RoundButton } from "@/components/RoundButton";
+import {
+  WatchlistSheet,
+  type WatchlistSheetRef,
+} from "@/components/watchlists/WatchlistSheet";
+import {
+  useItemInWatchlists,
+  useStreamystatsEnabled,
+} from "@/hooks/useWatchlists";
+
+interface Props extends ViewProps {
+  item: BaseItemDto;
+}
+
+export const AddToWatchlist: FC<Props> = ({ item, ...props }) => {
+  const streamystatsEnabled = useStreamystatsEnabled();
+  const sheetRef = useRef<WatchlistSheetRef>(null);
+
+  const { data: watchlistsContainingItem } = useItemInWatchlists(item.Id);
+  const isInAnyWatchlist = (watchlistsContainingItem?.length ?? 0) > 0;
+
+  const handlePress = useCallback(() => {
+    sheetRef.current?.open(item);
+  }, [item]);
+
+  // Don't render if Streamystats is not enabled
+  if (!streamystatsEnabled) return null;
+
+  return (
+    <View {...props}>
+      <RoundButton
+        size='large'
+        icon={isInAnyWatchlist ? "list" : "list-outline"}
+        onPress={handlePress}
+      />
+      <WatchlistSheet ref={sheetRef} />
+    </View>
+  );
+};