mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
apply suggestion
Co-authored-by: Bill Thornton <thornbill@users.noreply.github.com>
This commit is contained in:
parent
b9b963cca8
commit
d2aa788579
2 changed files with 32 additions and 37 deletions
|
@ -1,11 +1,39 @@
|
||||||
import React, { type FC } from 'react';
|
import React, { type FC, type PropsWithChildren } from 'react';
|
||||||
|
import classNames from 'classnames';
|
||||||
|
import Typography from '@mui/material/Typography';
|
||||||
import Box from '@mui/material/Box';
|
import Box from '@mui/material/Box';
|
||||||
import useTextLines from './useTextLines';
|
import useTextLines from './useTextLines';
|
||||||
import TextWrapper from './TextWrapper';
|
|
||||||
|
|
||||||
import type { ItemDto } from 'types/base/models/item-dto';
|
import type { ItemDto } from 'types/base/models/item-dto';
|
||||||
import type { TextLine, TextLineOpts } from './types';
|
import type { TextLine, TextLineOpts } from './types';
|
||||||
|
|
||||||
|
interface TextWrapperProps {
|
||||||
|
isHeading?: boolean;
|
||||||
|
isLargeStyle?: boolean;
|
||||||
|
className?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
const TextWrapper: FC<PropsWithChildren<TextWrapperProps>> = ({
|
||||||
|
isHeading,
|
||||||
|
isLargeStyle,
|
||||||
|
className,
|
||||||
|
children
|
||||||
|
}) => {
|
||||||
|
if (isHeading) {
|
||||||
|
return (
|
||||||
|
<Typography className={classNames('primary', className)} variant={isLargeStyle ? 'h1' : 'h3'}>
|
||||||
|
{children}
|
||||||
|
</Typography>
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
return (
|
||||||
|
<Box className={classNames('secondary', className )}>
|
||||||
|
{children}
|
||||||
|
</Box>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
interface TextLinesProps {
|
interface TextLinesProps {
|
||||||
item: ItemDto;
|
item: ItemDto;
|
||||||
textLineOpts?: TextLineOpts;
|
textLineOpts?: TextLineOpts;
|
||||||
|
@ -27,11 +55,11 @@ const TextLines: FC<TextLinesProps> = ({
|
||||||
return (
|
return (
|
||||||
<TextWrapper
|
<TextWrapper
|
||||||
key={index}
|
key={index}
|
||||||
index={index}
|
isHeading={index === 0}
|
||||||
isLargeStyle={isLargeStyle}
|
isLargeStyle={isLargeStyle}
|
||||||
className={textClassName}
|
className={textClassName}
|
||||||
>
|
>
|
||||||
{text.title}
|
<bdi>{text.title}</bdi>
|
||||||
</TextWrapper>
|
</TextWrapper>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
|
@ -1,33 +0,0 @@
|
||||||
import React, { type FC, type PropsWithChildren } from 'react';
|
|
||||||
import classNames from 'classnames';
|
|
||||||
import Typography from '@mui/material/Typography';
|
|
||||||
import Box from '@mui/material/Box';
|
|
||||||
|
|
||||||
interface TextWrapperProps {
|
|
||||||
index?: number;
|
|
||||||
isLargeStyle?: boolean;
|
|
||||||
className?: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
const TextWrapper: FC<PropsWithChildren<TextWrapperProps>> = ({
|
|
||||||
index,
|
|
||||||
isLargeStyle,
|
|
||||||
className,
|
|
||||||
children
|
|
||||||
}) => {
|
|
||||||
if (index === 0) {
|
|
||||||
return (
|
|
||||||
<Typography className={classNames('primary', className)} variant={isLargeStyle ? 'h1' : 'h3'}>
|
|
||||||
{children}
|
|
||||||
</Typography>
|
|
||||||
);
|
|
||||||
} else {
|
|
||||||
return (
|
|
||||||
<Box className={classNames('secondary', className )}>
|
|
||||||
{children}
|
|
||||||
</Box>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
export default TextWrapper;
|
|
Loading…
Add table
Add a link
Reference in a new issue