diff --git a/ui/component/app/view.jsx b/ui/component/app/view.jsx
index a67a6f02c..8ae3919bb 100644
--- a/ui/component/app/view.jsx
+++ b/ui/component/app/view.jsx
@@ -560,7 +560,7 @@ function App(props: Props) {
{getStatusNag()}
-
+
)}
diff --git a/web/component/adsSticky/index.js b/web/component/adsSticky/index.js
index e5afb4835..bd1a7d399 100644
--- a/web/component/adsSticky/index.js
+++ b/web/component/adsSticky/index.js
@@ -1,16 +1,25 @@
import { connect } from 'react-redux';
+import AdsSticky from './view';
import { doSetAdBlockerFound } from 'redux/actions/app';
+import { selectClaimForUri } from 'redux/selectors/claims';
import { selectAdBlockerFound } from 'redux/selectors/app';
import { selectHomepageData } from 'redux/selectors/settings';
-import { selectOdyseeMembershipIsPremiumPlus, selectUserCountry } from 'redux/selectors/user';
-import AdsSticky from './view';
+import { selectOdyseeMembershipIsPremiumPlus, selectUserCountry, selectUserVerifiedEmail } from 'redux/selectors/user';
+import { isChannelClaim, isStreamPlaceholderClaim } from 'util/claim';
-const select = (state, props) => ({
- isAdBlockerFound: selectAdBlockerFound(state),
- userHasPremiumPlus: selectOdyseeMembershipIsPremiumPlus(state),
- userCountry: selectUserCountry(state),
- homepageData: selectHomepageData(state),
-});
+const select = (state, props) => {
+ const claim = selectClaimForUri(state, props.uri);
+
+ return {
+ isContentClaim: isStreamPlaceholderClaim(claim) || Boolean(claim?.value?.source?.media_type),
+ isChannelClaim: isChannelClaim(claim),
+ authenticated: selectUserVerifiedEmail(state),
+ isAdBlockerFound: selectAdBlockerFound(state),
+ userHasPremiumPlus: selectOdyseeMembershipIsPremiumPlus(state),
+ userCountry: selectUserCountry(state),
+ homepageData: selectHomepageData(state),
+ };
+};
const perform = {
doSetAdBlockerFound,
diff --git a/web/component/adsSticky/view.jsx b/web/component/adsSticky/view.jsx
index b86be993f..7a9a5050a 100644
--- a/web/component/adsSticky/view.jsx
+++ b/web/component/adsSticky/view.jsx
@@ -12,6 +12,11 @@ const OUTBRAIN_CONTAINER_KEY = 'outbrainSizeDiv';
let gScript;
type Props = {
+ uri: ?string,
+ // --- redux ---
+ isContentClaim: boolean,
+ isChannelClaim: boolean,
+ authenticated: ?boolean,
isAdBlockerFound: ?boolean,
userHasPremiumPlus: boolean,
userCountry: string,
@@ -20,24 +25,35 @@ type Props = {
};
export default function AdsSticky(props: Props) {
- const { isAdBlockerFound, userHasPremiumPlus, userCountry, homepageData, doSetAdBlockerFound } = props;
+ const {
+ isContentClaim,
+ isChannelClaim,
+ authenticated,
+ isAdBlockerFound,
+ userHasPremiumPlus,
+ userCountry,
+ homepageData,
+ doSetAdBlockerFound,
+ } = props;
+
const { location } = useHistory();
const [refresh, setRefresh] = React.useState(0);
- const inAllowedPath = isPathAllowed(location.pathname);
+ // Global condition on whether ads should be activated:
const shouldShowAds = useShouldShowAds(userHasPremiumPlus, userCountry, isAdBlockerFound, doSetAdBlockerFound);
- const shouldLoadSticky = inAllowedPath && !gScript && !inIFrame() && !platform.isMobile();
+ // Global conditions aside, should the Sticky be shown for this path:
+ const inAllowedPath = shouldShowAdsForPath(location.pathname, isContentClaim, isChannelClaim, authenticated);
+ // Final answer:
+ const shouldLoadSticky = shouldShowAds && inAllowedPath && !gScript && !inIFrame() && !platform.isMobile();
- function isPathAllowed(pathname) {
- const categoryValues = Object.values(homepageData);
+ function shouldShowAdsForPath(pathname, isContentClaim, isChannelClaim, authenticated) {
// $FlowIssue: mixed type
- const pathIsCategory = categoryValues.some((x) => pathname.startsWith(`/$/${x?.name}`));
- return pathIsCategory;
+ const pathIsCategory = Object.values(homepageData).some((x) => pathname.startsWith(`/$/${x?.name}`));
+ return pathIsCategory || isChannelClaim || (isContentClaim && !authenticated);
}
- // -- Mount script; 1 per session.
React.useEffect(() => {
- if (shouldShowAds && shouldLoadSticky) {
+ if (shouldLoadSticky) {
gScript = document.createElement('script');
gScript.src = 'https://adncdnend.azureedge.net/adtags/odysee.adn.js';
gScript.async = true;
@@ -45,9 +61,8 @@ export default function AdsSticky(props: Props) {
// $FlowFixMe
document.body.appendChild(gScript);
}
- }, [shouldShowAds, shouldLoadSticky]);
+ }, [shouldLoadSticky]);
- // -- Update visibility per pathname
React.useEffect(() => {
const container = window[OUTBRAIN_CONTAINER_KEY];
if (container) {
@@ -55,8 +70,7 @@ export default function AdsSticky(props: Props) {
}
}, [inAllowedPath, refresh]);
- // Nothing for us to mount; the ad script will handle everything.
- return null;
+ return null; // Nothing for us to mount; the ad script will handle everything.
}
// ****************************************************************************