1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00

Use enums CardShape & BaseItemKind,

Use type import for react FC,
Remove escapeHTML

Co-authored-by: Bill Thornton <thornbill@users.noreply.github.com>
This commit is contained in:
grafixeyehero 2024-02-28 22:47:36 +03:00
parent 11d013b07e
commit 8cbddba8fd
18 changed files with 102 additions and 82 deletions

View file

@ -5,7 +5,7 @@ import CardOverlayButtons from './CardOverlayButtons';
import CardHoverMenu from './CardHoverMenu';
import CardOuterFooter from './CardOuterFooter';
import CardContent from './CardContent';
import { CardShape } from 'utils/card';
import type { ItemDto } from 'types/itemDto';
import type { CardOptions } from 'types/cardOptions';
@ -13,7 +13,7 @@ interface CardBoxProps {
item: ItemDto;
cardOptions: CardOptions;
className: string;
shape: string | null | undefined;
shape: CardShape | undefined;
imgUrl: string | undefined;
blurhash: string | undefined;
forceName: boolean;

View file

@ -1,3 +1,4 @@
import { BaseItemKind } from '@jellyfin/sdk/lib/generated-client/models/base-item-kind';
import React, { type FC } from 'react';
import Box from '@mui/material/Box';
import classNames from 'classnames';
@ -32,7 +33,7 @@ const CardImageContainer: FC<CardImageContainerProps> = ({
const cardImageClass = classNames(
'cardImageContainer',
{ coveredImage: coveredImage },
{ 'coveredImage-contain': coveredImage && item.Type === 'TvChannel' }
{ 'coveredImage-contain': coveredImage && item.Type === BaseItemKind.TvChannel }
);
return (
@ -52,7 +53,7 @@ const CardImageContainer: FC<CardImageContainerProps> = ({
indicator.getChildCountIndicator() :
indicator.getPlayedIndicator()}
{(item.Type === 'CollectionFolder'
{(item.Type === BaseItemKind.CollectionFolder
|| item.CollectionType)
&& item.RefreshProgress && (
<RefreshIndicator item={item} />

View file

@ -1,3 +1,5 @@
import { BaseItemKind } from '@jellyfin/sdk/lib/generated-client/models/base-item-kind';
import { LocationType } from '@jellyfin/sdk/lib/generated-client/models/location-type';
import React, { type FC } from 'react';
import ButtonGroup from '@mui/material/ButtonGroup';
import classNames from 'classnames';
@ -15,10 +17,10 @@ const sholudShowOverlayPlayButton = (
return (
overlayPlayButton
&& !item.IsPlaceHolder
&& (item.LocationType !== 'Virtual'
&& (item.LocationType !== LocationType.Virtual
|| !item.MediaType
|| item.Type === 'Program')
&& item.Type !== 'Person'
|| item.Type === BaseItemKind.Program)
&& item.Type !== BaseItemKind.Person
);
};

View file

@ -1,3 +1,4 @@
import { BaseItemKind } from '@jellyfin/sdk/lib/generated-client/models/base-item-kind';
import classNames from 'classnames';
import useCardImageUrl from './useCardImageUrl';
import {
@ -5,6 +6,7 @@ import {
resolveMixedShapeByAspectRatio
} from '../cardBuilderUtils';
import { getDataAttributes } from 'utils/items';
import { CardShape } from 'utils/card';
import layoutManager from 'components/layoutManager';
import type { ItemDto } from 'types/itemDto';
@ -24,7 +26,7 @@ function useCard({ item, cardOptions }: UseCardProps) {
let shape = cardOptions.shape;
if (shape === 'mixed') {
if (shape === CardShape.Mixed) {
shape = resolveMixedShapeByAspectRatio(item.PrimaryImageAspectRatio);
}
@ -82,9 +84,9 @@ function useCard({ item, cardOptions }: UseCardProps) {
{ groupedCard: cardOptions.showChildCountIndicator && item.ChildCount },
{
'card-withuserdata':
item.Type !== 'MusicAlbum'
&& item.Type !== 'MusicArtist'
&& item.Type !== 'Audio'
item.Type !== BaseItemKind.MusicAlbum
&& item.Type !== BaseItemKind.MusicArtist
&& item.Type !== BaseItemKind.Audio
},
{ itemAction: layoutManager.tv }
);

View file

@ -1,8 +1,9 @@
import { BaseItemKind, ImageType } from '@jellyfin/sdk/lib/generated-client';
import { BaseItemKind } from '@jellyfin/sdk/lib/generated-client/models/base-item-kind';
import { ImageType } from '@jellyfin/sdk/lib/generated-client/models/image-type';
import { getImageApi } from '@jellyfin/sdk/lib/utils/api/image-api';
import { useApi } from 'hooks/useApi';
import { getDesiredAspect } from '../cardBuilderUtils';
import { CardShape } from 'utils/card';
import type { ItemDto, NullableNumber, NullableString } from 'types/itemDto';
import type { CardOptions } from 'types/cardOptions';
@ -98,10 +99,10 @@ function isCoverImage(
function shouldShowPreferBanner(
imageTagsBanner: NullableString,
cardOptions: CardOptions,
shape: NullableString
shape: CardShape | undefined
): boolean {
return (
(cardOptions.preferBanner || shape === 'banner')
(cardOptions.preferBanner || shape === CardShape.Banner)
&& Boolean(imageTagsBanner)
);
}
@ -152,7 +153,7 @@ function shouldShowPreferThumb(itemType: NullableString, cardOptions: CardOption
function getCardImageInfo(
item: ItemDto,
cardOptions: CardOptions,
shape: NullableString
shape: CardShape | undefined
) {
const width = cardOptions.width;
let height;
@ -251,7 +252,7 @@ function getCardImageInfo(
interface UseCardImageUrlProps {
item: ItemDto;
cardOptions: CardOptions;
shape: NullableString;
shape: CardShape | undefined;
}
function useCardImageUrl({ item, cardOptions, shape }: UseCardImageUrlProps) {

View file

@ -1,3 +1,4 @@
import { CardShape } from 'utils/card';
import { randomInt } from '../../utils/number';
import classNames from 'classnames';
@ -54,15 +55,15 @@ export const isResizable = (windowWidth: number): boolean => {
*/
export const resolveMixedShapeByAspectRatio = (primaryImageAspectRatio: number | null | undefined) => {
if (primaryImageAspectRatio === undefined || primaryImageAspectRatio === null) {
return 'mixedSquare';
return CardShape.MixedSquare;
}
if (primaryImageAspectRatio >= 1.33) {
return 'mixedBackdrop';
return CardShape.MixedBackdrop;
} else if (primaryImageAspectRatio > 0.71) {
return 'mixedSquare';
return CardShape.MixedSquare;
} else {
return 'mixedPortrait';
return CardShape.MixedPortrait;
}
};

View file

@ -193,7 +193,7 @@ const useIndicator = (item: ItemDto) => {
const getProgressBar = (progressOptions?: ProgressOptions) => {
if (
enableProgressIndicator(item.Type, item.MediaType)
&& item.Type !== 'Recording'
&& item.Type !== BaseItemKind.Recording
) {
const playedPercentage = progressOptions?.userData?.PlayedPercentage ?
progressOptions.userData.PlayedPercentage :

View file

@ -30,7 +30,7 @@ const ListWrapper: FC<ListWrapperProps> = ({
'itemAction listItem-button listItem-focusscale'
)}
data-action={action}
aria-label={title}
aria-label={title || ''}
{...dataAttributes}
>
{children}