Show Sticky in Content and Channel Page for incognito
https://odysee-workspace.slack.com/archives/C02G20Z2AEL/p1654171314724029?thread_ts=1654089384.715699&cid=C02G20Z2AEL Content: not showing ads for signed-in users because it interferes with commenting. Channel: same behavior as Categories (i.e. show is not Premium+).
This commit is contained in:
parent
9787940bc8
commit
70ddd08df6
3 changed files with 45 additions and 22 deletions
|
@ -560,7 +560,7 @@ function App(props: Props) {
|
||||||
{getStatusNag()}
|
{getStatusNag()}
|
||||||
</React.Suspense>
|
</React.Suspense>
|
||||||
|
|
||||||
<AdsSticky />
|
<AdsSticky uri={uri} />
|
||||||
</React.Fragment>
|
</React.Fragment>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,16 +1,25 @@
|
||||||
import { connect } from 'react-redux';
|
import { connect } from 'react-redux';
|
||||||
|
import AdsSticky from './view';
|
||||||
import { doSetAdBlockerFound } from 'redux/actions/app';
|
import { doSetAdBlockerFound } from 'redux/actions/app';
|
||||||
|
import { selectClaimForUri } from 'redux/selectors/claims';
|
||||||
import { selectAdBlockerFound } from 'redux/selectors/app';
|
import { selectAdBlockerFound } from 'redux/selectors/app';
|
||||||
import { selectHomepageData } from 'redux/selectors/settings';
|
import { selectHomepageData } from 'redux/selectors/settings';
|
||||||
import { selectOdyseeMembershipIsPremiumPlus, selectUserCountry } from 'redux/selectors/user';
|
import { selectOdyseeMembershipIsPremiumPlus, selectUserCountry, selectUserVerifiedEmail } from 'redux/selectors/user';
|
||||||
import AdsSticky from './view';
|
import { isChannelClaim, isStreamPlaceholderClaim } from 'util/claim';
|
||||||
|
|
||||||
const select = (state, props) => ({
|
const select = (state, props) => {
|
||||||
isAdBlockerFound: selectAdBlockerFound(state),
|
const claim = selectClaimForUri(state, props.uri);
|
||||||
userHasPremiumPlus: selectOdyseeMembershipIsPremiumPlus(state),
|
|
||||||
userCountry: selectUserCountry(state),
|
return {
|
||||||
homepageData: selectHomepageData(state),
|
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 = {
|
const perform = {
|
||||||
doSetAdBlockerFound,
|
doSetAdBlockerFound,
|
||||||
|
|
|
@ -12,6 +12,11 @@ const OUTBRAIN_CONTAINER_KEY = 'outbrainSizeDiv';
|
||||||
let gScript;
|
let gScript;
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
|
uri: ?string,
|
||||||
|
// --- redux ---
|
||||||
|
isContentClaim: boolean,
|
||||||
|
isChannelClaim: boolean,
|
||||||
|
authenticated: ?boolean,
|
||||||
isAdBlockerFound: ?boolean,
|
isAdBlockerFound: ?boolean,
|
||||||
userHasPremiumPlus: boolean,
|
userHasPremiumPlus: boolean,
|
||||||
userCountry: string,
|
userCountry: string,
|
||||||
|
@ -20,24 +25,35 @@ type Props = {
|
||||||
};
|
};
|
||||||
|
|
||||||
export default function AdsSticky(props: 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 { location } = useHistory();
|
||||||
const [refresh, setRefresh] = React.useState(0);
|
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 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) {
|
function shouldShowAdsForPath(pathname, isContentClaim, isChannelClaim, authenticated) {
|
||||||
const categoryValues = Object.values(homepageData);
|
|
||||||
// $FlowIssue: mixed type
|
// $FlowIssue: mixed type
|
||||||
const pathIsCategory = categoryValues.some((x) => pathname.startsWith(`/$/${x?.name}`));
|
const pathIsCategory = Object.values(homepageData).some((x) => pathname.startsWith(`/$/${x?.name}`));
|
||||||
return pathIsCategory;
|
return pathIsCategory || isChannelClaim || (isContentClaim && !authenticated);
|
||||||
}
|
}
|
||||||
|
|
||||||
// -- Mount script; 1 per session.
|
|
||||||
React.useEffect(() => {
|
React.useEffect(() => {
|
||||||
if (shouldShowAds && shouldLoadSticky) {
|
if (shouldLoadSticky) {
|
||||||
gScript = document.createElement('script');
|
gScript = document.createElement('script');
|
||||||
gScript.src = 'https://adncdnend.azureedge.net/adtags/odysee.adn.js';
|
gScript.src = 'https://adncdnend.azureedge.net/adtags/odysee.adn.js';
|
||||||
gScript.async = true;
|
gScript.async = true;
|
||||||
|
@ -45,9 +61,8 @@ export default function AdsSticky(props: Props) {
|
||||||
// $FlowFixMe
|
// $FlowFixMe
|
||||||
document.body.appendChild(gScript);
|
document.body.appendChild(gScript);
|
||||||
}
|
}
|
||||||
}, [shouldShowAds, shouldLoadSticky]);
|
}, [shouldLoadSticky]);
|
||||||
|
|
||||||
// -- Update visibility per pathname
|
|
||||||
React.useEffect(() => {
|
React.useEffect(() => {
|
||||||
const container = window[OUTBRAIN_CONTAINER_KEY];
|
const container = window[OUTBRAIN_CONTAINER_KEY];
|
||||||
if (container) {
|
if (container) {
|
||||||
|
@ -55,8 +70,7 @@ export default function AdsSticky(props: Props) {
|
||||||
}
|
}
|
||||||
}, [inAllowedPath, refresh]);
|
}, [inAllowedPath, refresh]);
|
||||||
|
|
||||||
// Nothing for us to mount; the ad script will handle everything.
|
return null; // Nothing for us to mount; the ad script will handle everything.
|
||||||
return null;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// ****************************************************************************
|
// ****************************************************************************
|
||||||
|
|
Loading…
Add table
Reference in a new issue