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

apply suggestion

Browse source
This commit is contained in:
grafixeyehero 2022-12-15 22:54:58 +03:00
parent 62a9034f5b
commit 72cbd37182
5 changed files with 41 additions and 23 deletions
Download patch file Download diff file Expand all files Collapse all files

25
src/elements/emby-button/Button.tsx
View file

@ -3,6 +3,11 @@ import classNames from 'classnames';
import layoutManager from '../../components/layoutManager';
import './emby-button.scss';
enum IconPosition {
RIGHT = 'RIGHT',
LEFT = 'LEFT',
}
interface ButtonProps extends DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>,
HTMLButtonElement
> {
@ -20,21 +25,27 @@ const Button: React.FC<ButtonProps> = ({
onClick,
...rest
}) => {
let cssClass = classNames('emby-button', className);
const btnClass = classNames(
'emby-button',
className,
{ 'show-focus': layoutManager.tv }
);
if (layoutManager.tv) {
cssClass += ' show-focus';
}
const iconClass = classNames(
'material-icons',
iconClassName,
icon
);
return (
<button
className={cssClass}
className={btnClass}
onClick={onClick}
{...rest}
>
{icon && iconPos === 'LEFT' && <span className={classNames('material-icons', iconClassName, icon)} aria-hidden='true'></span>}
{icon && iconPos === IconPosition.LEFT && <span className={iconClass} aria-hidden='true' />}
<span>{title}</span>
{icon && iconPos === 'RIGHT' && <span className={classNames('material-icons', iconClassName, icon)} aria-hidden='true'></span>}
{icon && iconPos === IconPosition.RIGHT && <span className={iconClass} aria-hidden='true' />}
</button>
);
};

18
src/elements/emby-button/IconButton.tsx
View file

@ -19,21 +19,27 @@ const IconButton: React.FC<IconButtonProps> = ({
onClick,
...rest
}) => {
let cssClass = classNames('paper-icon-button-light', className);
const btnClass = classNames(
'paper-icon-button-light',
className,
{ 'show-focus': layoutManager.tv }
);
if (layoutManager.tv) {
cssClass += ' show-focus';
}
const iconClass = classNames(
'material-icons',
iconClassName,
icon
);
return (
<button
className={cssClass}
className={btnClass}
title={title}
disabled={disabled}
onClick={onClick}
{...rest}
>
<span className={classNames('material-icons', iconClassName, icon)} aria-hidden='true'></span>
<span className={iconClass} aria-hidden='true' />
</button>
);
};

9
src/elements/emby-button/LinkButton.tsx
View file

@ -43,11 +43,12 @@ const LinkButton: React.FC<LinkButtonProps> = ({
if (isAutoHideEnabled === true && !appHost.supports('externallinks')) {
return null;
}
let cssClass = classNames('emby-button', className);
if (layoutManager.tv) {
cssClass += ' show-focus';
}
const cssClass = classNames(
'emby-button',
className,
{ 'show-focus': layoutManager.tv }
);
return (
<a

4
src/elements/emby-scrollbuttons/ScrollButtons.tsx
View file

@ -20,7 +20,7 @@ interface ScrollButtonsProps {
}
const ScrollButtons: FC<ScrollButtonsProps> = ({ scrollerFactoryRef, scrollState }) => {
const [localeScrollPos, SetLocaleScrollPos] = useState<number>(0);
const [localeScrollPos, setLocaleScrollPos] = useState<number>(0);
const scrollButtonsRef = useRef<HTMLDivElement>(null);
const scrollToPosition = useCallback((pos: number, immediate: boolean) => {
@ -54,7 +54,7 @@ const ScrollButtons: FC<ScrollButtonsProps> = ({ scrollerFactoryRef, scrollState
if (globalize.getIsElementRTL(scrollButtonsRef.current)) {
localeAwarePos *= -1;
}
SetLocaleScrollPos(localeAwarePos);
setLocaleScrollPos(localeAwarePos);
}, [scrollState.scrollPos]);
return (

8
src/elements/emby-scroller/Scroller.tsx
View file

@ -32,7 +32,7 @@ const Scroller: FC<ScrollerProps> = ({
isAllowNativeSmoothScrollEnabled,
children
}) => {
const [showControls, SetShowControls] = useState(false);
const [showControls, setShowControls] = useState(false);
const [scrollState, setScrollState] = useState({
scrollSize: 0,
scrollPos: 0,
@ -196,7 +196,7 @@ const Scroller: FC<ScrollerProps> = ({
capture: false,
passive: true
});
SetShowControls(true);
setShowControls(true);
}
return () => {
@ -229,12 +229,12 @@ const Scroller: FC<ScrollerProps> = ({
return (
<>
{
showControls && scrollState.scrollWidth > scrollState.scrollSize + 20 ?
showControls && scrollState.scrollWidth > scrollState.scrollSize + 20 &&
<ScrollButtons
scrollRef={scrollRef}
scrollerFactoryRef={scrollerFactoryRef}
scrollState={scrollState}
/> : null
/>
}
<div