Creepso/stremio-web
1
0
Fork 0
mirror of https://github.com/Stremio/stremio-web.git synced 2026-04-21 03:22:11 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

use useCallback for render props

Browse source
This commit is contained in:
nklhrstv 2021-01-06 18:56:19 +02:00
parent 3b2540c403
commit 6335edcb13
10 changed files with 23 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
src/common/AddonDetailsModal/AddonDetails/AddonDetails.js
View file

@ -8,11 +8,9 @@ const Image = require('stremio/common/Image');
const styles = require('./styles');
const AddonDetails = ({ className, id, name, version, logo, description, types, transportUrl, official }) => {
const renderLogoFallback = React.useMemo(() => () => {
return (
<Icon className={styles['icon']} icon={'ic_addons'} />
);
}, []);
const renderLogoFallback = React.useCallback(() => (
<Icon className={styles['icon']} icon={'ic_addons'} />
), []);
return (
<div className={classnames(className, styles['addon-details-container'])}>
<div className={styles['title-container']}>

4
src/common/MetaItem/MetaItem.js
View file

@ -65,13 +65,13 @@ const MetaItem = React.memo(({ className, type, name, poster, posterShape, playI
});
}
}, [dataset, optionOnSelect]);
const renderPosterFallback = React.useMemo(() => () => (
const renderPosterFallback = React.useCallback(() => (
<Icon
className={styles['placeholder-icon']}
icon={ICON_FOR_TYPE.has(type) ? ICON_FOR_TYPE.get(type) : ICON_FOR_TYPE.get('other')}
/>
), [type]);
const renderMenuLabelContent = React.useMemo(() => () => (
const renderMenuLabelContent = React.useCallback(() => (
<Icon className={styles['icon']} icon={'ic_more'} />
), []);
return (

2
src/common/MetaPreview/MetaPreview.js
View file

@ -77,7 +77,7 @@ const MetaPreview = ({ className, compact, name, logo, background, runtime, rele
return trailerStreams[0].deepLinks.player;
}, [trailerStreams]);
const renderLogoFallback = React.useMemo(() => () => (
const renderLogoFallback = React.useCallback(() => (
<Icon className={styles['logo-placeholder-icon']} icon={'ic_broken_link'} />
), []);
return (

4
src/common/Multiselect/Multiselect.js
View file

@ -80,7 +80,7 @@ const Multiselect = ({ className, mode, direction, title, disabled, dataset, ren
mountedRef.current = true;
}, [menuOpen]);
const renderLabel = React.useMemo(() => ({ children, className, ...props }) => (
const renderLabel = React.useCallback(({ children, className, ...props }) => (
<Button {...props} className={classnames(className, styles['label-container'], { 'active': menuOpen })} title={title} disabled={disabled} onClick={labelOnClick}>
{
typeof renderLabelContent === 'function' ?
@ -110,7 +110,7 @@ const Multiselect = ({ className, mode, direction, title, disabled, dataset, ren
{children}
</Button>
), [menuOpen, title, disabled, options, selected, labelOnClick, renderLabelContent, renderLabelText]);
const renderMenu = React.useMemo(() => () => (
const renderMenu = React.useCallback(() => (
<div className={styles['menu-container']} onKeyDown={menuOnKeyDown} onClick={menuOnClick}>
{
options.length > 0 ?

2
src/common/NavBar/HorizontalNavBar/HorizontalNavBar.js
View file

@ -16,7 +16,7 @@ const HorizontalNavBar = React.memo(({ className, route, query, title, backButto
window.history.back();
}, []);
const [fullscreen, requestFullscreen, exitFullscreen] = useFullscreen();
const renderNavMenuLabel = React.useMemo(() => ({ ref, className, onClick, children, }) => (
const renderNavMenuLabel = React.useCallback(({ ref, className, onClick, children, }) => (
<Button ref={ref} className={classnames(className, styles['button-container'])} tabIndex={-1} onClick={onClick}>
<Icon className={styles['icon']} icon={'ic_more'} />
{children}

2
src/common/NavBar/HorizontalNavBar/NavMenu/NavMenu.js
View file

@ -43,7 +43,7 @@ const NavMenu = (props) => {
children,
})
), [menuOpen, popupLabelOnClick, props.renderLabel]);
const renderMenu = React.useMemo(() => () => (
const renderMenu = React.useCallback(() => (
<div className={styles['nav-menu-container']} onClick={popupMenuOnClick}>
<div className={styles['user-info-container']}>
<div

13
src/common/NavBar/VerticalNavBar/NavTabButton/NavTabButton.js
View file

@ -9,13 +9,12 @@ const Image = require('stremio/common/Image');
const styles = require('./styles');
const NavTabButton = ({ className, logo, icon, label, href, selected, onClick }) => {
const renderLogoFallback = React.useMemo(() => () => {
return (
typeof icon === 'string' && icon.length > 0 ?
<Icon className={styles['icon']} icon={icon} />
:
null);
}, [icon]);
const renderLogoFallback = React.useCallback(() => (
typeof icon === 'string' && icon.length > 0 ?
<Icon className={styles['icon']} icon={icon} />
:
null
), [icon]);
return (
<Button className={classnames(className, styles['nav-tab-button-container'], { 'selected': selected })} title={label} tabIndex={-1} href={href} onClick={onClick}>
{

8
src/routes/Addons/Addon/Addon.js
View file

@ -38,11 +38,9 @@ const Addon = ({ className, id, name, version, logo, description, types, install
});
}
}, [onToggle, dataset]);
const renderLogoFallback = React.useMemo(() => () => {
return (
<Icon className={styles['icon']} icon={'ic_addons'} />
);
}, []);
const renderLogoFallback = React.useCallback(() => (
<Icon className={styles['icon']} icon={'ic_addons'} />
), []);
return (
<Button className={classnames(className, styles['addon-container'])} onKeyDown={onKeyDown}>
<div className={styles['logo-container']}>

8
src/routes/Addons/Addons.js
View file

@ -64,11 +64,9 @@ const Addons = ({ urlParams, queryParams }) => {
(typeof addon.manifest.description === 'string' && addon.manifest.description.toLowerCase().includes(search.toLowerCase()))
);
}, [search]);
const renderLogoFallback = React.useMemo(() => () => {
return (
<Icon className={styles['icon']} icon={'ic_addons'} />
);
}, []);
const renderLogoFallback = React.useCallback(() => (
<Icon className={styles['icon']} icon={'ic_addons'} />
), []);
React.useLayoutEffect(() => {
closeAddAddonModal();
setSearch('');

2
src/routes/MetaDetails/StreamsList/Stream/Stream.js
View file

@ -18,7 +18,7 @@ const Stream = ({ className, addonName, title, thumbnail, progress, deepLinks, .
:
null;
}, [deepLinks]);
const renderThumbnailFallback = React.useMemo(() => () => (
const renderThumbnailFallback = React.useCallback(() => (
<Icon className={styles['placeholder-icon']} icon={'ic_broken_link'} />
), []);
return (