diff --git a/package-lock.json b/package-lock.json index be53e9ec7..cd094aa9c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -12,7 +12,7 @@ "@babel/runtime": "7.26.0", "@sentry/browser": "8.42.0", "@stremio/stremio-colors": "5.2.0", - "@stremio/stremio-core-web": "0.48.4", + "@stremio/stremio-core-web": "0.48.5", "@stremio/stremio-icons": "5.4.1", "@stremio/stremio-video": "0.0.48", "a-color-picker": "1.2.1", @@ -3371,9 +3371,9 @@ "integrity": "sha512-dYlPgu9W/H7c9s1zmW5tiDnRenaUa4Hg1QCyOg1lhOcgSfM/bVTi5nnqX+IfvGTTUNA0zgzh8hI3o3miwnZxTg==" }, "node_modules/@stremio/stremio-core-web": { - "version": "0.48.4", - "resolved": "https://registry.npmjs.org/@stremio/stremio-core-web/-/stremio-core-web-0.48.4.tgz", - "integrity": "sha512-848OLm0dtP75aAlYhUB0KoOqwosJIj+ubB8/abuaAzH/N3dtxs40vu2AezmMpGjwR4V60rlOUkUZeWFvrUOjrw==", + "version": "0.48.5", + "resolved": "https://registry.npmjs.org/@stremio/stremio-core-web/-/stremio-core-web-0.48.5.tgz", + "integrity": "sha512-oDTNBrv8zZi1VGbeV+1Bm6CliI2rF23ERdJpz+gv8EnbFjRIo78WIsoS0yO0EOg8HHXYsFytPq5+c0+YlxmBlA==", "license": "MIT", "dependencies": { "@babel/runtime": "7.24.1" diff --git a/package.json b/package.json index 79593f9d5..e777dd091 100644 --- a/package.json +++ b/package.json @@ -16,7 +16,7 @@ "@babel/runtime": "7.26.0", "@sentry/browser": "8.42.0", "@stremio/stremio-colors": "5.2.0", - "@stremio/stremio-core-web": "0.48.4", + "@stremio/stremio-core-web": "0.48.5", "@stremio/stremio-icons": "5.4.1", "@stremio/stremio-video": "0.0.48", "a-color-picker": "1.2.1", diff --git a/src/routes/MetaDetails/StreamsList/StreamsList.js b/src/routes/MetaDetails/StreamsList/StreamsList.js index e1d18bab6..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 ? @@ -161,13 +174,18 @@ const StreamsList = ({ className, video, ...props }) => { onClick={stream.onClick} /> ))} + { + showInstallAddonsButton ? + + : + null + } } - ); }; diff --git a/src/routes/MetaDetails/StreamsList/styles.less b/src/routes/MetaDetails/StreamsList/styles.less index c49cedf95..0f9ab2a0a 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,11 +144,12 @@ 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; + height: 4rem; + padding: 0 2rem; + margin: 1rem auto; + max-width: 50%; + border-radius: 2rem; &:hover { outline: var(--focus-outline-size) solid var(--secondary-accent-color); @@ -165,7 +166,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, }, };