mirror of
https://github.com/Stremio/stremio-web.git
synced 2026-04-19 18:02:13 +00:00
refactor: translate more strings
This commit is contained in:
Tim
parent
fc0dff4ec2
commit
f06f21ce75
13 changed files with 80 additions and 53 deletions
|
|
@ -10,8 +10,8 @@ const TABS = [
|
|||
{ id: 'board', label: 'Board', icon: 'ic_board', href: '#/' },
|
||||
{ id: 'discover', label: 'Discover', icon: 'ic_discover', href: '#/discover' },
|
||||
{ id: 'library', label: 'Library', icon: 'ic_library', href: '#/library' },
|
||||
{ id: 'settings', label: 'Settings', icon: 'ic_settings', href: '#/settings' },
|
||||
{ id: 'addons', label: 'Addons', icon: 'ic_addons', href: '#/addons' }
|
||||
{ id: 'settings', label: 'SETTINGS', icon: 'ic_settings', href: '#/settings' },
|
||||
{ id: 'addons', label: 'ADDONS', icon: 'ic_addons', href: '#/addons' }
|
||||
];
|
||||
|
||||
const MainNavBars = React.memo(({ className, route, query, children }) => {
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@ const React = require('react');
|
|||
const PropTypes = require('prop-types');
|
||||
const classnames = require('classnames');
|
||||
const UrlUtils = require('url');
|
||||
const { useTranslation } = require('react-i18next');
|
||||
const Icon = require('@stremio/stremio-icons/dom');
|
||||
const Button = require('stremio/common/Button');
|
||||
const Image = require('stremio/common/Image');
|
||||
|
|
@ -24,6 +25,7 @@ const ALLOWED_LINK_REDIRECTS = [
|
|||
];
|
||||
|
||||
const MetaPreview = ({ className, compact, name, logo, background, runtime, releaseInfo, released, description, deepLinks, links, trailerStreams, inLibrary, toggleInLibrary }) => {
|
||||
const { t } = useTranslation();
|
||||
const [shareModalOpen, openShareModal, closeShareModal] = useBinaryState(false);
|
||||
const linksGroups = React.useMemo(() => {
|
||||
return Array.isArray(links) ?
|
||||
|
|
@ -192,7 +194,7 @@ const MetaPreview = ({ className, compact, name, logo, background, runtime, rele
|
|||
<ActionButton
|
||||
className={styles['action-button']}
|
||||
icon={inLibrary ? 'ic_removelib' : 'ic_addlib'}
|
||||
label={inLibrary ? 'Remove from Library' : 'Add to library'}
|
||||
label={inLibrary ? t('REMOVE_FROM_LIB') : t('ADD_TO_LIB')}
|
||||
tabIndex={compact ? -1 : 0}
|
||||
onClick={toggleInLibrary}
|
||||
/>
|
||||
|
|
@ -204,7 +206,7 @@ const MetaPreview = ({ className, compact, name, logo, background, runtime, rele
|
|||
<ActionButton
|
||||
className={styles['action-button']}
|
||||
icon={'ic_movies'}
|
||||
label={'Trailer'}
|
||||
label={t('TRAILER')}
|
||||
tabIndex={compact ? -1 : 0}
|
||||
href={trailerHref}
|
||||
/>
|
||||
|
|
@ -216,7 +218,7 @@ const MetaPreview = ({ className, compact, name, logo, background, runtime, rele
|
|||
<ActionButton
|
||||
className={styles['action-button']}
|
||||
icon={'ic_play'}
|
||||
label={'Show'}
|
||||
label={t('SHOW')}
|
||||
tabIndex={compact ? -1 : 0}
|
||||
href={showHref}
|
||||
/>
|
||||
|
|
@ -229,13 +231,13 @@ const MetaPreview = ({ className, compact, name, logo, background, runtime, rele
|
|||
<ActionButton
|
||||
className={styles['action-button']}
|
||||
icon={'ic_share'}
|
||||
label={'Share'}
|
||||
label={t('CTX_SHARE')}
|
||||
tabIndex={compact ? -1 : 0}
|
||||
onClick={openShareModal}
|
||||
/>
|
||||
{
|
||||
shareModalOpen ?
|
||||
<ModalDialog title={'Share'} onCloseRequest={closeShareModal}>
|
||||
<ModalDialog title={t('CTX_SHARE')} onCloseRequest={closeShareModal}>
|
||||
<SharePrompt
|
||||
className={styles['share-prompt']}
|
||||
url={linksGroups.get(CONSTANTS.SHARE_LINK_CATEGORY).href}
|
||||
|
|
|
|||
|
|
@ -3,6 +3,7 @@
|
|||
const React = require('react');
|
||||
const PropTypes = require('prop-types');
|
||||
const classnames = require('classnames');
|
||||
const { useTranslation } = require('react-i18next');
|
||||
const Icon = require('@stremio/stremio-icons/dom');
|
||||
const { useServices } = require('stremio/services');
|
||||
const Button = require('stremio/common/Button');
|
||||
|
|
@ -13,6 +14,7 @@ const { withCoreSuspender } = require('stremio/common/CoreSuspender');
|
|||
const styles = require('./styles');
|
||||
|
||||
const NavMenuContent = ({ onClick }) => {
|
||||
const { t } = useTranslation();
|
||||
const { core } = useServices();
|
||||
const profile = useProfile();
|
||||
const { createTorrentFromMagnet } = useTorrent();
|
||||
|
|
@ -48,43 +50,43 @@ const NavMenuContent = ({ onClick }) => {
|
|||
<div className={styles['email-container']}>
|
||||
<div className={styles['email-label']}>{profile.auth === null ? 'Anonymous user' : profile.auth.user.email}</div>
|
||||
</div>
|
||||
<Button className={styles['logout-button-container']} title={profile.auth === null ? 'Log in / Sign up' : 'Log out'} href={'#/intro'} onClick={logoutButtonOnClick}>
|
||||
<div className={styles['logout-label']}>{profile.auth === null ? 'Log in / Sign up' : 'Log out'}</div>
|
||||
<Button className={styles['logout-button-container']} title={profile.auth === null ? `${t('LOG_IN')} / ${t('SIGN_UP')}` : t('LOG_OUT')} href={'#/intro'} onClick={logoutButtonOnClick}>
|
||||
<div className={styles['logout-label']}>{profile.auth === null ? `${t('LOG_IN')} / ${t('SIGN_UP')}` : t('LOG_OUT')}</div>
|
||||
</Button>
|
||||
</div>
|
||||
<div className={styles['nav-menu-section']}>
|
||||
<Button className={styles['nav-menu-option-container']} title={fullscreen ? 'Exit Fullscreen' : 'Enter Fullscreen'} onClick={fullscreen ? exitFullscreen : requestFullscreen}>
|
||||
<Button className={styles['nav-menu-option-container']} title={fullscreen ? t('EXIT_FULLSCREEN') : t('ENTER_FULLSCREEN')} onClick={fullscreen ? exitFullscreen : requestFullscreen}>
|
||||
<Icon className={styles['icon']} icon={fullscreen ? 'ic_exit_fullscreen' : 'ic_fullscreen'} />
|
||||
<div className={styles['nav-menu-option-label']}>{fullscreen ? 'Exit Fullscreen' : 'Enter Fullscreen'}</div>
|
||||
<div className={styles['nav-menu-option-label']}>{fullscreen ? t('EXIT_FULLSCREEN') : t('ENTER_FULLSCREEN')}</div>
|
||||
</Button>
|
||||
</div>
|
||||
<div className={styles['nav-menu-section']}>
|
||||
<Button className={styles['nav-menu-option-container']} title={'Settings'} href={'#/settings'}>
|
||||
<Button className={styles['nav-menu-option-container']} title={ t('SETTINGS') } href={'#/settings'}>
|
||||
<Icon className={styles['icon']} icon={'ic_settings'} />
|
||||
<div className={styles['nav-menu-option-label']}>Settings</div>
|
||||
<div className={styles['nav-menu-option-label']}>{ t('SETTINGS') }</div>
|
||||
</Button>
|
||||
<Button className={styles['nav-menu-option-container']} title={'Addons'} href={'#/addons'}>
|
||||
<Button className={styles['nav-menu-option-container']} title={ t('ADDONS') } href={'#/addons'}>
|
||||
<Icon className={styles['icon']} icon={'ic_addons'} />
|
||||
<div className={styles['nav-menu-option-label']}>Addons</div>
|
||||
<div className={styles['nav-menu-option-label']}>{ t('ADDONS') }</div>
|
||||
</Button>
|
||||
<Button className={styles['nav-menu-option-container']} title={'Play Magnet Link'} onClick={onPlayMagnetLinkClick}>
|
||||
<Button className={styles['nav-menu-option-container']} title={ t('PLAY_URL_MAGNET_LINK') } onClick={onPlayMagnetLinkClick}>
|
||||
<Icon className={styles['icon']} icon={'ic_magnet'} />
|
||||
<div className={styles['nav-menu-option-label']}>Play Magnet Link</div>
|
||||
<div className={styles['nav-menu-option-label']}>{ t('PLAY_URL_MAGNET_LINK') }</div>
|
||||
</Button>
|
||||
<Button className={styles['nav-menu-option-container']} title={'Help & Feedback'} href={'https://stremio.zendesk.com/'} target={'_blank'}>
|
||||
<Button className={styles['nav-menu-option-container']} title={ t('HELP_FEEDBACK') } href={'https://stremio.zendesk.com/'} target={'_blank'}>
|
||||
<Icon className={styles['icon']} icon={'ic_help'} />
|
||||
<div className={styles['nav-menu-option-label']}>Help & Feedback</div>
|
||||
<div className={styles['nav-menu-option-label']}>{ t('HELP_FEEDBACK') }</div>
|
||||
</Button>
|
||||
</div>
|
||||
<div className={styles['nav-menu-section']}>
|
||||
<Button className={styles['nav-menu-option-container']} title={'Terms of Service'} href={'https://www.stremio.com/tos'} target={'_blank'}>
|
||||
<div className={styles['nav-menu-option-label']}>Terms of Service</div>
|
||||
<Button className={styles['nav-menu-option-container']} title={ t('TERMS_OF_SERVICE') } href={'https://www.stremio.com/tos'} target={'_blank'}>
|
||||
<div className={styles['nav-menu-option-label']}>{ t('TERMS_OF_SERVICE') }</div>
|
||||
</Button>
|
||||
<Button className={styles['nav-menu-option-container']} title={'Privacy Policy'} href={'https://www.stremio.com/privacy'} target={'_blank'}>
|
||||
<div className={styles['nav-menu-option-label']}>Privacy Policy</div>
|
||||
<Button className={styles['nav-menu-option-container']} title={ t('PRIVACY_POLICY') } href={'https://www.stremio.com/privacy'} target={'_blank'}>
|
||||
<div className={styles['nav-menu-option-label']}>{ t('PRIVACY_POLICY') }</div>
|
||||
</Button>
|
||||
<Button className={styles['nav-menu-option-container']} title={'About Stremio'} href={'https://www.stremio.com/'} target={'_blank'}>
|
||||
<div className={styles['nav-menu-option-label']}>About Stremio</div>
|
||||
<Button className={styles['nav-menu-option-container']} title={ t('ABOUT_STREMIO') } href={'https://www.stremio.com/'} target={'_blank'}>
|
||||
<div className={styles['nav-menu-option-label']}>{ t('ABOUT_STREMIO') }</div>
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -3,6 +3,7 @@
|
|||
const React = require('react');
|
||||
const PropTypes = require('prop-types');
|
||||
const classnames = require('classnames');
|
||||
const { useTranslation } = require('react-i18next');
|
||||
const Icon = require('@stremio/stremio-icons/dom');
|
||||
const { useRouteFocused } = require('stremio-router');
|
||||
const Button = require('stremio/common/Button');
|
||||
|
|
@ -12,6 +13,7 @@ const { withCoreSuspender } = require('stremio/common/CoreSuspender');
|
|||
const styles = require('./styles');
|
||||
|
||||
const SearchBar = ({ className, query, active }) => {
|
||||
const { t } = useTranslation();
|
||||
const routeFocused = useRouteFocused();
|
||||
const { createTorrentFromMagnet } = useTorrent();
|
||||
const searchInputRef = React.useRef(null);
|
||||
|
|
@ -46,7 +48,7 @@ const SearchBar = ({ className, query, active }) => {
|
|||
ref={searchInputRef}
|
||||
className={styles['search-input']}
|
||||
type={'text'}
|
||||
placeholder={'Search or paste link'}
|
||||
placeholder={t('SEARCH_PLACEHOLDER')}
|
||||
defaultValue={query}
|
||||
tabIndex={-1}
|
||||
onChange={queryInputOnChange}
|
||||
|
|
@ -54,7 +56,7 @@ const SearchBar = ({ className, query, active }) => {
|
|||
/>
|
||||
:
|
||||
<div className={styles['search-input']}>
|
||||
<div className={styles['placeholder-label']}>Search or paste link</div>
|
||||
<div className={styles['placeholder-label']}>{ t('SEARCH_PLACEHOLDER') }</div>
|
||||
</div>
|
||||
}
|
||||
<Button className={styles['submit-button-container']} tabIndex={-1} onClick={queryInputOnSubmit}>
|
||||
|
|
@ -70,16 +72,19 @@ SearchBar.propTypes = {
|
|||
active: PropTypes.bool
|
||||
};
|
||||
|
||||
const SearchBarFallback = ({ className }) => (
|
||||
<label className={classnames(className, styles['search-bar-container'])}>
|
||||
<div className={styles['search-input']}>
|
||||
<div className={styles['placeholder-label']}>Search or paste link</div>
|
||||
</div>
|
||||
<Button className={styles['submit-button-container']} tabIndex={-1}>
|
||||
<Icon className={styles['icon']} icon={'ic_search_link'} />
|
||||
</Button>
|
||||
</label>
|
||||
);
|
||||
const SearchBarFallback = ({ className }) => {
|
||||
const { t } = useTranslation();
|
||||
return (
|
||||
<label className={classnames(className, styles['search-bar-container'])}>
|
||||
<div className={styles['search-input']}>
|
||||
<div className={styles['placeholder-label']}>{ t('SEARCH_PLACEHOLDER') }</div>
|
||||
</div>
|
||||
<Button className={styles['submit-button-container']} tabIndex={-1}>
|
||||
<Icon className={styles['icon']} icon={'ic_search_link'} />
|
||||
</Button>
|
||||
</label>
|
||||
);
|
||||
};
|
||||
|
||||
SearchBarFallback.propTypes = SearchBar.propTypes;
|
||||
|
||||
|
|
|
|||
|
|
@ -3,10 +3,12 @@
|
|||
const React = require('react');
|
||||
const PropTypes = require('prop-types');
|
||||
const classnames = require('classnames');
|
||||
const { useTranslation } = require('react-i18next');
|
||||
const NavTabButton = require('./NavTabButton');
|
||||
const styles = require('./styles');
|
||||
|
||||
const VerticalNavBar = React.memo(({ className, selected, tabs }) => {
|
||||
const { t } = useTranslation();
|
||||
return (
|
||||
<nav className={classnames(className, styles['vertical-nav-bar-container'])}>
|
||||
{
|
||||
|
|
@ -19,7 +21,7 @@ const VerticalNavBar = React.memo(({ className, selected, tabs }) => {
|
|||
href={tab.href}
|
||||
logo={tab.logo}
|
||||
icon={tab.icon}
|
||||
label={tab.label}
|
||||
label={t(tab.label)}
|
||||
onClick={tab.onClick}
|
||||
/>
|
||||
))
|
||||
|
|
|
|||
|
|
@ -3,6 +3,7 @@
|
|||
const React = require('react');
|
||||
const PropTypes = require('prop-types');
|
||||
const classnames = require('classnames');
|
||||
const { useTranslation } = require('react-i18next');
|
||||
const Icon = require('@stremio/stremio-icons/dom');
|
||||
const { useRouteFocused } = require('stremio-router');
|
||||
const { useServices } = require('stremio/services');
|
||||
|
|
@ -11,6 +12,7 @@ const TextInput = require('stremio/common/TextInput');
|
|||
const styles = require('./styles');
|
||||
|
||||
const SharePrompt = ({ className, url }) => {
|
||||
const { t } = useTranslation();
|
||||
const { core } = useServices();
|
||||
const inputRef = React.useRef(null);
|
||||
const routeFocused = useRouteFocused();
|
||||
|
|
@ -62,7 +64,7 @@ const SharePrompt = ({ className, url }) => {
|
|||
/>
|
||||
<Button className={styles['copy-button']} title={'Copy to clipboard'} onClick={copyToClipboard}>
|
||||
<Icon className={styles['icon']} icon={'ic_link'} />
|
||||
<div className={styles['label']}>Copy</div>
|
||||
<div className={styles['label']}>{ t('COPY') }</div>
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -4,12 +4,14 @@ const React = require('react');
|
|||
const { useServices } = require('stremio/services');
|
||||
const PropTypes = require('prop-types');
|
||||
const classnames = require('classnames');
|
||||
const { useTranslation } = require('react-i18next');
|
||||
const Button = require('stremio/common/Button');
|
||||
const useProfile = require('stremio/common/useProfile');
|
||||
const { withCoreSuspender } = require('stremio/common/CoreSuspender');
|
||||
const styles = require('./styles');
|
||||
|
||||
const StreamingServerWarning = ({ className }) => {
|
||||
const { t } = useTranslation();
|
||||
const { core } = useServices();
|
||||
const profile = useProfile();
|
||||
const onLaterClick = React.useCallback(() => {
|
||||
|
|
@ -48,7 +50,7 @@ const StreamingServerWarning = ({ className }) => {
|
|||
|
||||
return (
|
||||
<div className={classnames(className, styles['warning-container'])}>
|
||||
<div className={styles['warning-statement']}>Streaming server is not available.</div>
|
||||
<div className={styles['warning-statement']}>{ t('SETTINGS_SERVER_UNAVAILABLE') }</div>
|
||||
<Button className={styles['warning-button']} title={'Later'} onClick={onLaterClick} tabIndex={-1}>
|
||||
<div className={styles['warning-label']}>Later</div>
|
||||
</Button>
|
||||
|
|
|
|||
|
|
@ -3,11 +3,13 @@
|
|||
const React = require('react');
|
||||
const PropTypes = require('prop-types');
|
||||
const classnames = require('classnames');
|
||||
const { useTranslation } = require('react-i18next');
|
||||
const Icon = require('@stremio/stremio-icons/dom');
|
||||
const { Button, Image } = require('stremio/common');
|
||||
const styles = require('./styles');
|
||||
|
||||
const Addon = ({ className, id, name, version, logo, description, types, installed, onToggle, onShare, dataset }) => {
|
||||
const { t } = useTranslation();
|
||||
const toggleButtonOnClick = React.useCallback((event) => {
|
||||
if (typeof onToggle === 'function') {
|
||||
onToggle({
|
||||
|
|
@ -82,12 +84,12 @@ const Addon = ({ className, id, name, version, logo, description, types, install
|
|||
}
|
||||
</div>
|
||||
<div className={styles['buttons-container']}>
|
||||
<Button className={installed ? styles['uninstall-button-container'] : styles['install-button-container']} title={installed ? 'Uninstall' : 'Install'} tabIndex={-1} onClick={toggleButtonOnClick}>
|
||||
<div className={styles['label']}>{installed ? 'Uninstall' : 'Install'}</div>
|
||||
<Button className={installed ? styles['uninstall-button-container'] : styles['install-button-container']} title={installed ? t('ADDON_UNINSTALL') : t('ADDON_INSTALL')} tabIndex={-1} onClick={toggleButtonOnClick}>
|
||||
<div className={styles['label']}>{installed ? t('ADDON_UNINSTALL') : t('ADDON_INSTALL')}</div>
|
||||
</Button>
|
||||
<Button className={styles['share-button-container']} title={'SHARE ADDON'} tabIndex={-1} onClick={shareButtonOnClick}>
|
||||
<Button className={styles['share-button-container']} title={t('SHARE_ADDON')} tabIndex={-1} onClick={shareButtonOnClick}>
|
||||
<Icon className={styles['icon']} icon={'ic_share'} />
|
||||
<div className={styles['label']}>SHARE ADDON</div>
|
||||
<div className={styles['label']}>{ t('SHARE_ADDON') }</div>
|
||||
</Button>
|
||||
</div>
|
||||
</Button>
|
||||
|
|
|
|||
|
|
@ -3,6 +3,7 @@
|
|||
const React = require('react');
|
||||
const PropTypes = require('prop-types');
|
||||
const classnames = require('classnames');
|
||||
const { useTranslation } = require('react-i18next');
|
||||
const Icon = require('@stremio/stremio-icons/dom');
|
||||
const { AddonDetailsModal, Button, Image, Multiselect, MainNavBars, TextInput, SearchBar, SharePrompt, ModalDialog, useBinaryState, withCoreSuspender } = require('stremio/common');
|
||||
const Addon = require('./Addon');
|
||||
|
|
@ -13,6 +14,7 @@ const useSelectableInputs = require('./useSelectableInputs');
|
|||
const styles = require('./styles');
|
||||
|
||||
const Addons = ({ urlParams, queryParams }) => {
|
||||
const { t } = useTranslation();
|
||||
const installedAddons = useInstalledAddons(urlParams);
|
||||
const remoteAddons = useRemoteAddons(urlParams);
|
||||
const [addonDetailsTransportUrl, setAddonDetailsTransportUrl] = useAddonDetailsTransportUrl(urlParams, queryParams);
|
||||
|
|
@ -92,7 +94,7 @@ const Addons = ({ urlParams, queryParams }) => {
|
|||
<div className={styles['spacing']} />
|
||||
<SearchBar
|
||||
className={styles['search-bar']}
|
||||
title={'Search addons'}
|
||||
title={t('ADDON_SEARCH')}
|
||||
value={search}
|
||||
onChange={searchInputOnChange}
|
||||
/>
|
||||
|
|
@ -212,7 +214,7 @@ const Addons = ({ urlParams, queryParams }) => {
|
|||
sharedAddon !== null ?
|
||||
<ModalDialog
|
||||
className={styles['share-modal-container']}
|
||||
title={'Share Addon'}
|
||||
title={t('SHARE_ADDON')}
|
||||
onCloseRequest={clearSharedAddon}>
|
||||
<div className={styles['title-container']}>
|
||||
<Image
|
||||
|
|
|
|||
|
|
@ -3,6 +3,7 @@
|
|||
const React = require('react');
|
||||
const classnames = require('classnames');
|
||||
const debounce = require('lodash.debounce');
|
||||
const { useTranslation } = require('react-i18next');
|
||||
const { MainNavBars, MetaRow, LibItem, MetaItem, StreamingServerWarning, useStreamingServer, withCoreSuspender, getVisibleChildrenRange } = require('stremio/common');
|
||||
const useBoard = require('./useBoard');
|
||||
const useContinueWatchingPreview = require('./useContinueWatchingPreview');
|
||||
|
|
@ -11,6 +12,7 @@ const styles = require('./styles');
|
|||
const THRESHOLD = 5;
|
||||
|
||||
const Board = () => {
|
||||
const { t } = useTranslation();
|
||||
const streamingServer = useStreamingServer();
|
||||
const continueWatchingPreview = useContinueWatchingPreview();
|
||||
const [board, loadBoardRows] = useBoard();
|
||||
|
|
@ -42,7 +44,7 @@ const Board = () => {
|
|||
continueWatchingPreview.libraryItems.length > 0 ?
|
||||
<MetaRow
|
||||
className={classnames(styles['board-row'], styles['continue-watching-row'], 'animation-fade-in')}
|
||||
title={'Continue Watching'}
|
||||
title={t('BOARD_CONTINUE_WATCHING')}
|
||||
items={continueWatchingPreview.libraryItems}
|
||||
itemComponent={LibItem}
|
||||
deepLinks={continueWatchingPreview.deepLinks}
|
||||
|
|
|
|||
|
|
@ -3,6 +3,7 @@
|
|||
const React = require('react');
|
||||
const PropTypes = require('prop-types');
|
||||
const classnames = require('classnames');
|
||||
const { useTranslation } = require('react-i18next');
|
||||
const Icon = require('@stremio/stremio-icons/dom');
|
||||
const { Button, Image, Multiselect } = require('stremio/common');
|
||||
const { useServices } = require('stremio/services');
|
||||
|
|
@ -12,6 +13,7 @@ const styles = require('./styles');
|
|||
const ALL_ADDONS_KEY = 'ALL';
|
||||
|
||||
const StreamsList = ({ className, ...props }) => {
|
||||
const { t } = useTranslation();
|
||||
const { core } = useServices();
|
||||
const [selectedAddon, setSelectedAddon] = React.useState(ALL_ADDONS_KEY);
|
||||
const onAddonSelected = React.useCallback((event) => {
|
||||
|
|
@ -115,9 +117,9 @@ const StreamsList = ({ className, ...props }) => {
|
|||
</div>
|
||||
</React.Fragment>
|
||||
}
|
||||
<Button className={styles['install-button-container']} title={'Install Addons'} href={'#/addons'}>
|
||||
<Button className={styles['install-button-container']} title={t('ADDON_CATALOGUE_MORE')} href={'#/addons'}>
|
||||
<Icon className={styles['icon']} icon={'ic_addons'} />
|
||||
<div className={styles['label']}>Install Addons</div>
|
||||
<div className={styles['label']}>{ t('ADDON_CATALOGUE_MORE') }</div>
|
||||
</Button>
|
||||
</div>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -3,12 +3,14 @@
|
|||
const React = require('react');
|
||||
const PropTypes = require('prop-types');
|
||||
const classnames = require('classnames');
|
||||
const { useTranslation } = require('react-i18next');
|
||||
const Option = require('./Option');
|
||||
const styles = require('./styles');
|
||||
|
||||
const RATES = Array.from(Array(8).keys(), (n) => n * 0.25 + 0.25).reverse();
|
||||
|
||||
const SpeedMenu = ({ className, playbackSpeed, onPlaybackSpeedChanged }) => {
|
||||
const { t } = useTranslation();
|
||||
const onMouseDown = React.useCallback((event) => {
|
||||
event.nativeEvent.speedMenuClosePrevented = true;
|
||||
}, []);
|
||||
|
|
@ -20,7 +22,7 @@ const SpeedMenu = ({ className, playbackSpeed, onPlaybackSpeedChanged }) => {
|
|||
return (
|
||||
<div className={classnames(className, styles['speed-menu-container'])} onMouseDown={onMouseDown}>
|
||||
<div className={styles['title']}>
|
||||
Playback Speed
|
||||
{ t('PLAYBACK_SPEED') }
|
||||
</div>
|
||||
<div className={styles['options-container']}>
|
||||
{
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@ const React = require('react');
|
|||
const PropTypes = require('prop-types');
|
||||
const classnames = require('classnames');
|
||||
const debounce = require('lodash.debounce');
|
||||
const { useTranslation } = require('react-i18next');
|
||||
const Icon = require('@stremio/stremio-icons/dom');
|
||||
const { Image, MainNavBars, MetaRow, MetaItem, withCoreSuspender, getVisibleChildrenRange } = require('stremio/common');
|
||||
const useSearch = require('./useSearch');
|
||||
|
|
@ -12,6 +13,7 @@ const styles = require('./styles');
|
|||
const THRESHOLD = 100;
|
||||
|
||||
const Search = ({ queryParams }) => {
|
||||
const { t } = useTranslation();
|
||||
const [search, loadSearchRows] = useSearch(queryParams);
|
||||
const query = React.useMemo(() => {
|
||||
return search.selected !== null ?
|
||||
|
|
@ -50,11 +52,11 @@ const Search = ({ queryParams }) => {
|
|||
<div className={classnames(styles['search-hints-container'], 'animation-fade-in')}>
|
||||
<div className={styles['search-hint-container']}>
|
||||
<Icon className={styles['icon']} icon={'ic_movies'} />
|
||||
<div className={styles['label']}>Search for movies, series, YouTube and TV channels</div>
|
||||
<div className={styles['label']}>{ t('SEARCH_EXPLANATION_CONTENT') }</div>
|
||||
</div>
|
||||
<div className={styles['search-hint-container']}>
|
||||
<Icon className={styles['icon']} icon={'ic_actor'} />
|
||||
<div className={styles['label']}>Search for actors, directors and writers</div>
|
||||
<div className={styles['label']}>{ t('SEARCH_EXPLANATION_PEOPLE') }</div>
|
||||
</div>
|
||||
</div>
|
||||
:
|
||||
|
|
@ -65,7 +67,7 @@ const Search = ({ queryParams }) => {
|
|||
src={require('/images/empty.png')}
|
||||
alt={' '}
|
||||
/>
|
||||
<div className={styles['message-label']}>No addons were requested for catalogs!</div>
|
||||
<div className={styles['message-label']}>{ t('STREMIO_TV_SEARCH_NO_ADDONS') }</div>
|
||||
</div>
|
||||
:
|
||||
search.catalogs.map((catalog, index) => {
|
||||
|
|
|
|||
Loading…
Reference in a new issue