diff --git a/src/routes/MetaDetails/MetaDetails.js b/src/routes/MetaDetails/MetaDetails.js
index a61a82ee0..a30800835 100644
--- a/src/routes/MetaDetails/MetaDetails.js
+++ b/src/routes/MetaDetails/MetaDetails.js
@@ -61,6 +61,17 @@ const MetaDetails = ({ urlParams, queryParams }) => {
}
});
}, [metaDetails]);
+ const toggleNotifications = React.useCallback(() => {
+ if (metaDetails.libraryItem) {
+ core.transport.dispatch({
+ action: 'Ctx',
+ args: {
+ action: 'ToggleLibraryItemNotifications',
+ args: [metaDetails.libraryItem._id, !metaDetails.libraryItem.state.noNotif],
+ }
+ });
+ }
+ }, [metaDetails.libraryItem]);
const seasonOnSelect = React.useCallback((event) => {
setSeason(event.value);
}, [setSeason]);
@@ -156,8 +167,10 @@ const MetaDetails = ({ urlParams, queryParams }) => {
:
null
diff --git a/src/routes/MetaDetails/VideosList/SeasonsBar/styles.less b/src/routes/MetaDetails/VideosList/SeasonsBar/styles.less
index 4c044ea15..42326acfc 100644
--- a/src/routes/MetaDetails/VideosList/SeasonsBar/styles.less
+++ b/src/routes/MetaDetails/VideosList/SeasonsBar/styles.less
@@ -13,7 +13,6 @@
display: flex;
flex-direction: row;
justify-content: space-between;
- padding: 1rem;
overflow: visible;
.prev-season-button, .next-season-button {
diff --git a/src/routes/MetaDetails/VideosList/VideosList.js b/src/routes/MetaDetails/VideosList/VideosList.js
index b1928eba8..e344c6480 100644
--- a/src/routes/MetaDetails/VideosList/VideosList.js
+++ b/src/routes/MetaDetails/VideosList/VideosList.js
@@ -4,13 +4,15 @@ const React = require('react');
const PropTypes = require('prop-types');
const classnames = require('classnames');
const { t } = require('i18next');
-const Image = require('stremio/common/Image');
-const SearchBar = require('stremio/common/SearchBar');
+const { Image, SearchBar, Checkbox } = require('stremio/common');
const SeasonsBar = require('./SeasonsBar');
const Video = require('./Video');
const styles = require('./styles');
-const VideosList = ({ className, metaItem, season, seasonOnSelect }) => {
+const VideosList = ({ className, metaItem, libraryItem, season, seasonOnSelect, toggleNotifications }) => {
+ const showNotificationsToggle = React.useMemo(() => {
+ return metaItem?.content?.content?.inLibrary && metaItem?.content?.content?.videos?.length;
+ }, [metaItem]);
const videos = React.useMemo(() => {
return metaItem && metaItem.content.type === 'Ready' ?
metaItem.content.content.videos
@@ -80,6 +82,14 @@ const VideosList = ({ className, metaItem, season, seasonOnSelect }) => {
:
+ {
+ showNotificationsToggle && libraryItem ?
+
+ {t('DETAIL_RECEIVE_NOTIF_SERIES')}
+
+ :
+ null
+ }
{
seasons.length > 0 ?
{
VideosList.propTypes = {
className: PropTypes.string,
metaItem: PropTypes.object,
+ libraryItem: PropTypes.object,
season: PropTypes.number,
- seasonOnSelect: PropTypes.func
+ seasonOnSelect: PropTypes.func,
+ toggleNotifications: PropTypes.func,
};
module.exports = VideosList;
diff --git a/src/routes/MetaDetails/VideosList/styles.less b/src/routes/MetaDetails/VideosList/styles.less
index 4a1cc37ef..103d8c139 100644
--- a/src/routes/MetaDetails/VideosList/styles.less
+++ b/src/routes/MetaDetails/VideosList/styles.less
@@ -6,6 +6,7 @@
.videos-list-container {
display: flex;
flex-direction: column;
+ padding-top: 0.5rem;
.message-container {
flex: 1;
@@ -35,9 +36,22 @@
}
}
+ .notifications-checkbox {
+ flex: none;
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ justify-content: flex-start;
+ gap: 1rem;
+ height: 3rem;
+ padding: 0 1.5rem;
+ color: @color-surface-light5-90;
+ }
+
.seasons-bar {
flex: none;
align-self: stretch;
+ margin: 0.5rem 1rem 1rem 1rem;
}
.search-bar {
diff --git a/src/types/models/Ctx.d.ts b/src/types/models/Ctx.d.ts
index d8a2828c7..fd3cb2766 100644
--- a/src/types/models/Ctx.d.ts
+++ b/src/types/models/Ctx.d.ts
@@ -45,9 +45,15 @@ type Profile = {
type Notifications = {
uid: string,
created: string,
- items: Record,
+ items: Record,
};
+type NotificationItem = {
+ metaId: string,
+ videoId: string,
+ videoReleased: string,
+}
+
type Ctx = {
profile: Profile,
notifications: Notifications,
diff --git a/src/types/models/MetaDetails.d.ts b/src/types/models/MetaDetails.d.ts
index 4b18a3612..efa7efc33 100644
--- a/src/types/models/MetaDetails.d.ts
+++ b/src/types/models/MetaDetails.d.ts
@@ -14,6 +14,7 @@ type MetaDetails = {
addon: Addon,
content: Loadable,
} | null,
+ libraryItem: LibraryItem | null,
selected: {
metaPath: ResourceRequestPath,
streamPath: ResourceRequestPath,