diff --git a/src/common/ContinueWatchingItem/ContinueWatchingItem.js b/src/common/ContinueWatchingItem/ContinueWatchingItem.js index 721a1b731..7d1ab824d 100644 --- a/src/common/ContinueWatchingItem/ContinueWatchingItem.js +++ b/src/common/ContinueWatchingItem/ContinueWatchingItem.js @@ -3,17 +3,10 @@ const React = require('react'); const PropTypes = require('prop-types'); const { useServices } = require('stremio/services'); -const useNotifications = require('stremio/common/useNotifications'); const LibItem = require('stremio/common/LibItem'); -const ContinueWatchingItem = ({ _id, deepLinks, ...props }) => { +const ContinueWatchingItem = ({ _id, notifications, deepLinks, ...props }) => { const { core } = useServices(); - const notifications = useNotifications(); - - const newVideos = React.useMemo(() => { - const count = notifications.items?.[_id]?.length ?? 0; - return Math.min(Math.max(count, 0), 99); - }, [_id, notifications.items]); const onClick = React.useCallback(() => { if (deepLinks?.metaDetailsVideos ?? deepLinks?.metaDetailsStreams) { @@ -51,8 +44,9 @@ const ContinueWatchingItem = ({ _id, deepLinks, ...props }) => { return ( { ContinueWatchingItem.propTypes = { _id: PropTypes.string, + notifications: PropTypes.object, deepLinks: PropTypes.shape({ metaDetailsVideos: PropTypes.string, metaDetailsStreams: PropTypes.string, diff --git a/src/common/LibItem/LibItem.js b/src/common/LibItem/LibItem.js index a1c59200a..d2858790d 100644 --- a/src/common/LibItem/LibItem.js +++ b/src/common/LibItem/LibItem.js @@ -13,8 +13,12 @@ const OPTIONS = [ { label: 'LIBRARY_REMOVE', value: 'remove' }, ]; -const LibItem = ({ _id, removable, ...props }) => { +const LibItem = ({ _id, removable, notifications, ...props }) => { const { core } = useServices(); + const newVideos = React.useMemo(() => { + const count = notifications.items?.[_id]?.length ?? 0; + return Math.min(Math.max(count, 0), 99); + }, [_id, notifications]); const options = React.useMemo(() => { return OPTIONS .filter(({ value }) => { @@ -98,6 +102,7 @@ const LibItem = ({ _id, removable, ...props }) => { return ( @@ -108,6 +113,7 @@ LibItem.propTypes = { _id: PropTypes.string, removable: PropTypes.bool, progress: PropTypes.number, + notifications: PropTypes.object, deepLinks: PropTypes.shape({ metaDetailsVideos: PropTypes.string, metaDetailsStreams: PropTypes.string, diff --git a/src/common/MetaItem/MetaItem.js b/src/common/MetaItem/MetaItem.js index a967fde9d..e9fc46dc8 100644 --- a/src/common/MetaItem/MetaItem.js +++ b/src/common/MetaItem/MetaItem.js @@ -76,7 +76,7 @@ const MetaItem = React.memo(({ className, type, name, poster, posterShape, poste null } { - watched ? + !newVideos && watched ?
diff --git a/src/common/MetaRow/MetaRow.js b/src/common/MetaRow/MetaRow.js index 5a99c585a..7d023202a 100644 --- a/src/common/MetaRow/MetaRow.js +++ b/src/common/MetaRow/MetaRow.js @@ -11,7 +11,7 @@ const useTranslate = require('stremio/common/useTranslate'); const MetaRowPlaceholder = require('./MetaRowPlaceholder'); const styles = require('./styles'); -const MetaRow = ({ className, title, catalog, message, itemComponent }) => { +const MetaRow = ({ className, title, catalog, message, itemComponent, notifications }) => { const t = useTranslate(); const catalogTitle = React.useMemo(() => { @@ -56,7 +56,8 @@ const MetaRow = ({ className, title, catalog, message, itemComponent }) => { return React.createElement(itemComponent, { ...item, key: index, - className: classnames(styles['meta-item'], styles['poster-shape-poster'], styles[`poster-shape-${item.posterShape}`]) + className: classnames(styles['meta-item'], styles['poster-shape-poster'], styles[`poster-shape-${item.posterShape}`]), + notifications, }); }) : @@ -104,6 +105,7 @@ MetaRow.propTypes = { }), }), itemComponent: PropTypes.elementType, + notifications: PropTypes.object, }; module.exports = MetaRow; diff --git a/src/routes/Board/Board.js b/src/routes/Board/Board.js index 510406381..a494a02ee 100644 --- a/src/routes/Board/Board.js +++ b/src/routes/Board/Board.js @@ -4,7 +4,7 @@ const React = require('react'); const classnames = require('classnames'); const debounce = require('lodash.debounce'); const { useTranslation } = require('react-i18next'); -const { MainNavBars, MetaRow, ContinueWatchingItem, MetaItem, StreamingServerWarning, useStreamingServer, withCoreSuspender, getVisibleChildrenRange, EventModal } = require('stremio/common'); +const { MainNavBars, MetaRow, ContinueWatchingItem, MetaItem, StreamingServerWarning, useStreamingServer, useNotifications, withCoreSuspender, getVisibleChildrenRange, EventModal } = require('stremio/common'); const useBoard = require('./useBoard'); const useContinueWatchingPreview = require('./useContinueWatchingPreview'); const styles = require('./styles'); @@ -16,6 +16,7 @@ const Board = () => { const streamingServer = useStreamingServer(); const continueWatchingPreview = useContinueWatchingPreview(); const [board, loadBoardRows] = useBoard(); + const notifications = useNotifications(); const boardCatalogsOffset = continueWatchingPreview.items.length > 0 ? 1 : 0; const scrollContainerRef = React.useRef(); const onVisibleRangeChange = React.useCallback(() => { @@ -48,6 +49,7 @@ const Board = () => { title={t('BOARD_CONTINUE_WATCHING')} catalog={continueWatchingPreview} itemComponent={ContinueWatchingItem} + notifications={notifications} /> : null diff --git a/src/routes/Library/Library.js b/src/routes/Library/Library.js index 1479c9c5d..e45dd585a 100644 --- a/src/routes/Library/Library.js +++ b/src/routes/Library/Library.js @@ -5,7 +5,7 @@ const PropTypes = require('prop-types'); const classnames = require('classnames'); const { default: Icon } = require('@stremio/stremio-icons/react'); const NotFound = require('stremio/routes/NotFound'); -const { Button, DelayedRenderer, Multiselect, MainNavBars, LibItem, Image, ModalDialog, PaginationInput, useProfile, routesRegexp, useBinaryState, withCoreSuspender } = require('stremio/common'); +const { Button, DelayedRenderer, Multiselect, MainNavBars, LibItem, Image, ModalDialog, PaginationInput, useProfile, useNotifications, routesRegexp, useBinaryState, withCoreSuspender } = require('stremio/common'); const useLibrary = require('./useLibrary'); const useSelectableInputs = require('./useSelectableInputs'); const styles = require('./styles'); @@ -45,6 +45,7 @@ function withModel(Library) { const Library = ({ model, urlParams, queryParams }) => { const profile = useProfile(); + const notifications = useNotifications(); const library = useLibrary(model, urlParams, queryParams); const [typeSelect, sortSelect, paginationInput] = useSelectableInputs(library); const [inputsModalOpen, openInputsModal, closeInputsModal] = useBinaryState(false); @@ -108,7 +109,7 @@ const Library = ({ model, urlParams, queryParams }) => { :
{library.catalog.map((libItem, index) => ( - + ))}
}