diff --git a/src/routes/MetaDetails/StreamsList/StreamsList.js b/src/routes/MetaDetails/StreamsList/StreamsList.js index a9f0d6ee6..bcb5cb015 100644 --- a/src/routes/MetaDetails/StreamsList/StreamsList.js +++ b/src/routes/MetaDetails/StreamsList/StreamsList.js @@ -9,7 +9,7 @@ const { Button, Image, Multiselect } = require('stremio/components'); const { useServices } = require('stremio/services'); const Stream = require('./Stream'); const styles = require('./styles'); -const { usePlatform } = require('stremio/common'); +const { usePlatform, useProfile } = require('stremio/common'); const ALL_ADDONS_KEY = 'ALL'; @@ -17,17 +17,21 @@ const StreamsList = ({ className, video, ...props }) => { const { t } = useTranslation(); const { core } = useServices(); const platform = usePlatform(); + const profile = useProfile(); const streamsContainerRef = React.useRef(null); const [selectedAddon, setSelectedAddon] = React.useState(ALL_ADDONS_KEY); const onAddonSelected = React.useCallback((event) => { streamsContainerRef.current.scrollTo({ top: 0, left: 0, behavior: platform.name === 'ios' ? 'smooth' : 'instant' }); setSelectedAddon(event.value); }, [platform]); + const showInstallAddonsButton = React.useMemo(() => { + return !profile || profile.auth === null || profile.auth?.user?.isNewUser === true; + }, [profile]); const backButtonOnClick = React.useCallback(() => { if (video.deepLinks && typeof video.deepLinks.metaDetailsVideos === 'string') { window.location.replace(video.deepLinks.metaDetailsVideos + ( typeof video.season === 'number' ? - `?${new URLSearchParams({'season': video.season})}` + `?${new URLSearchParams({ 'season': video.season })}` : null )); @@ -126,6 +130,15 @@ const StreamsList = ({ className, video, ...props }) => {
{'
{t('NO_STREAM')}
+ { + showInstallAddonsButton ? + + : + null + }
: filteredStreams.length === 0 ? @@ -162,8 +175,8 @@ const StreamsList = ({ className, video, ...props }) => { /> ))} { - Object.keys(streamsByAddon).length > 1 ? - @@ -173,15 +186,6 @@ const StreamsList = ({ className, video, ...props }) => { } - { - Object.keys(streamsByAddon).length < 2 && countLoadingAddons === 0 ? - - : - null - } ); }; diff --git a/src/routes/MetaDetails/StreamsList/styles.less b/src/routes/MetaDetails/StreamsList/styles.less index 7e80858b8..97235fd0d 100644 --- a/src/routes/MetaDetails/StreamsList/styles.less +++ b/src/routes/MetaDetails/StreamsList/styles.less @@ -19,7 +19,7 @@ display: flex; flex-direction: column; align-items: center; - padding: 1rem 1rem 0; + padding: 1rem; overflow-y: auto; .image { @@ -144,22 +144,11 @@ flex-direction: row; align-items: center; justify-content: center; - margin: 1rem; - padding: 1.5rem 1rem; - border-radius: var(--border-radius); background-color: var(--secondary-accent-color); - border-radius: 3rem; - - &.streams { - padding: 1rem; - margin: 1rem auto; - max-width: 50%; - border-radius: 2rem; - - .label { - font-size: 1rem; - } - } + padding: 1rem; + margin: 1rem auto; + max-width: 50%; + border-radius: 2rem; &:hover { outline: var(--focus-outline-size) solid var(--secondary-accent-color); @@ -176,7 +165,7 @@ .label { flex: 0 1 auto; - font-size: 1.5rem; + font-size: 1rem; font-weight: 700; max-height: 3.6em; text-align: center; diff --git a/src/types/models/Ctx.d.ts b/src/types/models/Ctx.d.ts index ffb5d7f0a..a86fd60fa 100644 --- a/src/types/models/Ctx.d.ts +++ b/src/types/models/Ctx.d.ts @@ -9,6 +9,7 @@ type Auth = { created_at: number, expires_in: number, }, + isNewUser: boolean, }, };