mirror of
https://github.com/streamyfin/streamyfin.git
synced 2026-07-05 03:52:51 +01:00
addressing PR comments
Signed-off-by: Lance Chant <13349722+lancechant@users.noreply.github.com>
This commit is contained in:
@@ -2,8 +2,8 @@ import { Ionicons } from "@expo/vector-icons";
|
|||||||
import type { BaseItemDto } from "@jellyfin/sdk/lib/generated-client/models";
|
import type { BaseItemDto } from "@jellyfin/sdk/lib/generated-client/models";
|
||||||
import type React from "react";
|
import type React from "react";
|
||||||
import { Platform, View, type ViewStyle } from "react-native";
|
import { Platform, View, type ViewStyle } from "react-native";
|
||||||
|
import { Text } from "@/components/common/Text";
|
||||||
import { scaleSize } from "@/utils/scaleSize";
|
import { scaleSize } from "@/utils/scaleSize";
|
||||||
import { Text } from "./common/Text";
|
|
||||||
|
|
||||||
const isAggregateType = (item: BaseItemDto) =>
|
const isAggregateType = (item: BaseItemDto) =>
|
||||||
item.Type === "Series" || item.Type === "BoxSet";
|
item.Type === "Series" || item.Type === "BoxSet";
|
||||||
@@ -39,39 +39,43 @@ const mobileBadgeBase: ViewStyle = {
|
|||||||
* unconditionally as an overlay (e.g. on top of the tvOS glass poster, where
|
* unconditionally as an overlay (e.g. on top of the tvOS glass poster, where
|
||||||
* the watched checkmark is drawn natively and only the count needs RN).
|
* the watched checkmark is drawn natively and only the count needs RN).
|
||||||
*/
|
*/
|
||||||
export const UnplayedCountBadge: React.FC<{ item: BaseItemDto }> = ({
|
export const UnplayedCountBadge: React.FC<{ item: BaseItemDto }> = React.memo(
|
||||||
item,
|
({ item }) => {
|
||||||
}) => {
|
if (!isAggregateType(item)) return null;
|
||||||
if (!isAggregateType(item)) return null;
|
if (item.UserData?.Played) return null;
|
||||||
if (item.UserData?.Played) return null;
|
const unplayed = item.UserData?.UnplayedItemCount ?? 0;
|
||||||
const unplayed = item.UserData?.UnplayedItemCount ?? 0;
|
if (unplayed <= 0) return null;
|
||||||
if (unplayed <= 0) return null;
|
|
||||||
|
|
||||||
if (Platform.isTV) {
|
if (Platform.isTV) {
|
||||||
return (
|
return (
|
||||||
<View
|
<View
|
||||||
style={[
|
style={[
|
||||||
tvBadgeBase,
|
tvBadgeBase,
|
||||||
{ minWidth: scaleSize(28), paddingHorizontal: scaleSize(7) },
|
{ minWidth: scaleSize(28), paddingHorizontal: scaleSize(7) },
|
||||||
]}
|
]}
|
||||||
>
|
|
||||||
<Text
|
|
||||||
style={{ fontSize: scaleSize(15), fontWeight: "700", color: "black" }}
|
|
||||||
>
|
>
|
||||||
|
<Text
|
||||||
|
style={{
|
||||||
|
fontSize: scaleSize(15),
|
||||||
|
fontWeight: "700",
|
||||||
|
color: "black",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{unplayed}
|
||||||
|
</Text>
|
||||||
|
</View>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<View style={[mobileBadgeBase, { minWidth: 20, paddingHorizontal: 5 }]}>
|
||||||
|
<Text style={{ fontSize: 12, fontWeight: "700", color: "white" }}>
|
||||||
{unplayed}
|
{unplayed}
|
||||||
</Text>
|
</Text>
|
||||||
</View>
|
</View>
|
||||||
);
|
);
|
||||||
}
|
},
|
||||||
|
);
|
||||||
return (
|
|
||||||
<View style={[mobileBadgeBase, { minWidth: 20, paddingHorizontal: 5 }]}>
|
|
||||||
<Text style={{ fontSize: 12, fontWeight: "700", color: "white" }}>
|
|
||||||
{unplayed}
|
|
||||||
</Text>
|
|
||||||
</View>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
export const WatchedIndicator: React.FC<{ item: BaseItemDto }> = ({ item }) => {
|
export const WatchedIndicator: React.FC<{ item: BaseItemDto }> = ({ item }) => {
|
||||||
const isMovieOrEpisode = item.Type === "Movie" || item.Type === "Episode";
|
const isMovieOrEpisode = item.Type === "Movie" || item.Type === "Episode";
|
||||||
|
|||||||
@@ -1,8 +1,8 @@
|
|||||||
import { type BaseItemDto } from "@jellyfin/sdk/lib/generated-client/models";
|
import { type BaseItemDto } from "@jellyfin/sdk/lib/generated-client/models";
|
||||||
import { useState } from "react";
|
import { useState } from "react";
|
||||||
import { View, type ViewProps } from "react-native";
|
import { View, type ViewProps } from "react-native";
|
||||||
|
import { WatchedIndicator } from "@/components/WatchedIndicator";
|
||||||
import { ItemImage } from "../common/ItemImage";
|
import { ItemImage } from "../common/ItemImage";
|
||||||
import { WatchedIndicator } from "../WatchedIndicator";
|
|
||||||
|
|
||||||
interface Props extends ViewProps {
|
interface Props extends ViewProps {
|
||||||
item: BaseItemDto;
|
item: BaseItemDto;
|
||||||
|
|||||||
@@ -3,9 +3,9 @@ import { Image } from "expo-image";
|
|||||||
import { useAtom } from "jotai";
|
import { useAtom } from "jotai";
|
||||||
import { useMemo } from "react";
|
import { useMemo } from "react";
|
||||||
import { View } from "react-native";
|
import { View } from "react-native";
|
||||||
|
import { WatchedIndicator } from "@/components/WatchedIndicator";
|
||||||
import { apiAtom } from "@/providers/JellyfinProvider";
|
import { apiAtom } from "@/providers/JellyfinProvider";
|
||||||
import { getPrimaryImageUrl } from "@/utils/jellyfin/image/getPrimaryImageUrl";
|
import { getPrimaryImageUrl } from "@/utils/jellyfin/image/getPrimaryImageUrl";
|
||||||
import { WatchedIndicator } from "../WatchedIndicator";
|
|
||||||
|
|
||||||
type MoviePosterProps = {
|
type MoviePosterProps = {
|
||||||
item: BaseItemDto;
|
item: BaseItemDto;
|
||||||
|
|||||||
Reference in New Issue
Block a user