fix: small design fixes

app.json

@@ -2,7 +2,7 @@
   "expo": {
     "name": "Streamyfin",
     "slug": "streamyfin",
-    "version": "0.10.1",
+    "version": "0.10.2",
     "orientation": "default",
     "icon": "./assets/images/icon.png",
     "scheme": "streamyfin",
@@ -33,7 +33,7 @@
     },
     "android": {
       "jsEngine": "hermes",
-      "versionCode": 30,
+      "versionCode": 31,
       "adaptiveIcon": {
         "foregroundImage": "./assets/images/icon.png"
       },

app/(auth)/(tabs)/(home)/downloads.tsx

@@ -65,15 +65,14 @@ const downloads: React.FC = () => {
   }
 
   return (
-    <ScrollView>
-      <View
-        className="px-4 py-4"
-        style={{
-          paddingLeft: insets.left,
-          paddingRight: insets.right,
-          paddingBottom: 100,
-        }}
-      >
+    <ScrollView
+      contentContainerStyle={{
+        paddingLeft: insets.left,
+        paddingRight: insets.right,
+        paddingBottom: 100,
+      }}
+    >
+      <View className="px-4 py-4">
         <View className="mb-4 flex flex-col space-y-4">
           <View>
             <Text className="text-2xl font-bold mb-2">Queue</Text>

app/(auth)/(tabs)/(home)/settings.tsx

@@ -27,15 +27,14 @@ export default function settings() {
   const insets = useSafeAreaInsets();
 
   return (
-    <ScrollView>
-      <View
-        className="p-4 flex flex-col gap-y-4 pb-12"
-        style={{
-          paddingLeft: insets.left,
-          paddingRight: insets.right,
-          paddingBottom: 100,
-        }}
-      >
+    <ScrollView
+      contentContainerStyle={{
+        paddingLeft: insets.left,
+        paddingRight: insets.right,
+        paddingBottom: 100,
+      }}
+    >
+      <View className="p-4 flex flex-col gap-y-4">
         <Text className="font-bold text-2xl">Information</Text>
 
         <View className="flex flex-col rounded-xl mb-4 overflow-hidden border-neutral-800 divide-y-2 divide-solid divide-neutral-800 ">

components/Chromecast.tsx

@@ -1,6 +1,6 @@
 import { BlurView } from "expo-blur";
 import React, { useEffect } from "react";
-import { View, ViewProps } from "react-native";
+import { Platform, View, ViewProps } from "react-native";
 import GoogleCast, {
   CastButton,
   useCastDevice,
@@ -37,6 +37,16 @@ export const Chromecast: React.FC<Props> = ({
   }, [client, devices, castDevice, sessionManager, discoveryManager]);
 
   if (background === "transparent")
+    return (
+      <View
+        className="rounded-full h-10 w-10 flex items-center justify-center b"
+        {...props}
+      >
+        <CastButton style={{ tintColor: "white", height, width }} />
+      </View>
+    );
+
+  if (Platform.OS === "android")
     return (
       <View
         className="rounded-full h-10 w-10 flex items-center justify-center bg-neutral-800/80"

components/DownloadItem.tsx

@@ -145,15 +145,13 @@ export const DownloadItem: React.FC<DownloadProps> = ({ item, ...props }) => {
           item.Id
         }/universal?${searchParams.toString()}`;
       }
-    }
-
-    if (mediaSource.TranscodingUrl) {
+    } else if (mediaSource.TranscodingUrl) {
       console.log("Using transcoded stream!");
       url = `${api.basePath}${mediaSource.TranscodingUrl}`;
-    } else {
-      throw new Error("No transcoding url");
     }
 
+    if (!url) throw new Error("No url");
+
     return await startRemuxing(url);
   }, [
     api,

components/MediaSourceSelector.tsx

@@ -36,6 +36,14 @@ export const MediaSourceSelector: React.FC<Props> = ({
     if (mediaSources?.length) onChange(mediaSources[0]);
   }, [mediaSources]);
 
+  const name = (name?: string | null) => {
+    if (name && name.length > 40)
+      return (
+        name.substring(0, 20) + " [...] " + name.substring(name.length - 20)
+      );
+    return name;
+  };
+
   return (
     <View
       className="flex shrink"
@@ -69,7 +77,9 @@ export const MediaSourceSelector: React.FC<Props> = ({
                 onChange(source);
               }}
             >
-              <DropdownMenu.ItemTitle>{source.Name}</DropdownMenu.ItemTitle>
+              <DropdownMenu.ItemTitle>
+                {name(source.Name)}
+              </DropdownMenu.ItemTitle>
             </DropdownMenu.Item>
           ))}
         </DropdownMenu.Content>

components/common/ItemImage.tsx

@@ -1,11 +1,9 @@
 import { useImageColors } from "@/hooks/useImageColors";
 import { apiAtom } from "@/providers/JellyfinProvider";
-import { itemThemeColorAtom } from "@/utils/atoms/primaryColor";
 import { BaseItemDto } from "@jellyfin/sdk/lib/generated-client/models";
 import { Image, ImageProps, ImageSource } from "expo-image";
 import { useAtom } from "jotai";
-import { useEffect, useMemo } from "react";
-import { getColors } from "react-native-image-colors";
+import { useMemo } from "react";
 
 interface Props extends ImageProps {
   item: BaseItemDto;

components/downloads/SeriesCard.tsx

@@ -25,7 +25,7 @@ export const SeriesCard: React.FC<{ items: BaseItemDto[] }> = ({ items }) => {
   return (
     <View>
       <View className="flex flex-row items-center justify-between">
-        <Text className="text-2xl font-bold">{items[0].SeriesName}</Text>
+        <Text className="text-2xl font-bold shrink">{items[0].SeriesName}</Text>
         <View className="bg-purple-600 rounded-full h-6 w-6 flex items-center justify-center">
           <Text className="text-xs font-bold">{items.length}</Text>
         </View>

eas.json

@@ -21,13 +21,13 @@
       }
     },
     "production": {
-      "channel": "0.10.1",
+      "channel": "0.10.2",
       "android": {
         "image": "latest"
       }
     },
     "production-apk": {
-      "channel": "0.10.1",
+      "channel": "0.10.2",
       "android": {
         "buildType": "apk",
         "image": "latest"

providers/JellyfinProvider.tsx

@@ -62,7 +62,7 @@ export const JellyfinProvider: React.FC<{ children: ReactNode }> = ({
       setJellyfin(
         () =>
           new Jellyfin({
-            clientInfo: { name: "Streamyfin", version: "0.10.1" },
+            clientInfo: { name: "Streamyfin", version: "0.10.2" },
             deviceInfo: { name: Platform.OS === "ios" ? "iOS" : "Android", id },
           })
       );
@@ -80,7 +80,7 @@ export const JellyfinProvider: React.FC<{ children: ReactNode }> = ({
     return {
       authorization: `MediaBrowser Client="Streamyfin", Device=${
         Platform.OS === "android" ? "Android" : "iOS"
-      }, DeviceId="${deviceId}", Version="0.10.1"`,
+      }, DeviceId="${deviceId}", Version="0.10.2"`,
     };
   }, [deviceId]);
 

utils/jellyfin/media/getStreamUrl.ts

@@ -76,10 +76,12 @@ export const getStreamUrl = async ({
     throw new Error("no PlaySessionId");
   }
 
+  let url: string | null | undefined;
+
   if (mediaSource.SupportsDirectPlay || forceDirectPlay === true) {
     if (item.MediaType === "Video") {
       console.log("Using direct stream for video!");
-      return `${api.basePath}/Videos/${itemId}/stream.mp4?playSessionId=${sessionData.PlaySessionId}&mediaSourceId=${mediaSource.Id}&static=true&subtitleStreamIndex=${subtitleStreamIndex}&audioStreamIndex=${audioStreamIndex}&deviceId=${api.deviceInfo.id}&api_key=${api.accessToken}`;
+      url = `${api.basePath}/Videos/${itemId}/stream.mp4?playSessionId=${sessionData.PlaySessionId}&mediaSourceId=${mediaSource.Id}&static=true&subtitleStreamIndex=${subtitleStreamIndex}&audioStreamIndex=${audioStreamIndex}&deviceId=${api.deviceInfo.id}&api_key=${api.accessToken}`;
     } else if (item.MediaType === "Audio") {
       console.log("Using direct stream for audio!");
       const searchParams = new URLSearchParams({
@@ -97,16 +99,16 @@ export const getStreamUrl = async ({
         EnableRedirection: "true",
         EnableRemoteMedia: "false",
       });
-      return `${
+      url = `${
         api.basePath
       }/Audio/${itemId}/universal?${searchParams.toString()}`;
     }
+  } else if (mediaSource.TranscodingUrl) {
+    console.log("Using transcoded stream!");
+    url = `${api.basePath}${mediaSource.TranscodingUrl}`;
   }
 
-  if (mediaSource.TranscodingUrl) {
-    console.log("Using transcoded stream!");
-    return `${api.basePath}${mediaSource.TranscodingUrl}`;
-  } else {
-    throw new Error("No transcoding url");
-  }
+  if (!url) throw new Error("No url");
+
+  return url;
 };