remove more web folder stuff
This commit is contained in:
parent
c66cfb28b5
commit
d20e4ad0e7
17 changed files with 1 additions and 563 deletions
|
@ -2,7 +2,6 @@ import { connect } from 'react-redux';
|
|||
import { makeSelectClaimForUri } from 'redux/selectors/claims';
|
||||
import { doFetchRecommendedContent } from 'redux/actions/search';
|
||||
import { makeSelectRecommendedContentForUri, selectIsSearching } from 'redux/selectors/search';
|
||||
import { selectUserVerifiedEmail } from 'redux/selectors/user';
|
||||
import RecommendedContent from './view';
|
||||
|
||||
const select = (state, props) => {
|
||||
|
@ -17,7 +16,6 @@ const select = (state, props) => {
|
|||
recommendedContentUris,
|
||||
nextRecommendedUri,
|
||||
isSearching: selectIsSearching(state),
|
||||
isAuthenticated: selectUserVerifiedEmail(state),
|
||||
};
|
||||
};
|
||||
|
||||
|
|
|
@ -1,9 +1,7 @@
|
|||
// @flow
|
||||
import { SHOW_ADS } from 'config';
|
||||
import React from 'react';
|
||||
import ClaimList from 'component/claimList';
|
||||
import ClaimListDiscover from 'component/claimListDiscover';
|
||||
import Ads from 'web/component/ads';
|
||||
import Card from 'component/common/card';
|
||||
import { useIsMobile, useIsMediumScreen } from 'effects/use-screensize';
|
||||
import Button from 'component/button';
|
||||
|
@ -19,7 +17,6 @@ type Props = {
|
|||
nextRecommendedUri: string,
|
||||
isSearching: boolean,
|
||||
doFetchRecommendedContent: (string) => void,
|
||||
isAuthenticated: boolean,
|
||||
claim: ?StreamClaim,
|
||||
claimId: string,
|
||||
};
|
||||
|
@ -31,7 +28,6 @@ export default React.memo<Props>(function RecommendedContent(props: Props) {
|
|||
recommendedContentUris,
|
||||
nextRecommendedUri,
|
||||
isSearching,
|
||||
isAuthenticated,
|
||||
claim,
|
||||
claimId,
|
||||
} = props;
|
||||
|
@ -99,7 +95,6 @@ export default React.memo<Props>(function RecommendedContent(props: Props) {
|
|||
loading={isSearching}
|
||||
uris={recommendedContentUris}
|
||||
hideMenu={isMobile}
|
||||
injectedItem={SHOW_ADS && IS_WEB && !isAuthenticated && <Ads small type={'video'} />}
|
||||
empty={__('No related content found')}
|
||||
onClick={handleRecommendationClicked}
|
||||
/>
|
||||
|
@ -118,7 +113,6 @@ export default React.memo<Props>(function RecommendedContent(props: Props) {
|
|||
channelIds={[signingChannel.claim_id]}
|
||||
loading={isSearching}
|
||||
hideMenu={isMobile}
|
||||
injectedItem={SHOW_ADS && IS_WEB && !isAuthenticated && <Ads small type={'video'} />}
|
||||
empty={__('No related content found')}
|
||||
/>
|
||||
)}
|
||||
|
@ -135,7 +129,6 @@ function areEqual(prevProps: Props, nextProps: Props) {
|
|||
if (
|
||||
a.uri !== b.uri ||
|
||||
a.nextRecommendedUri !== b.nextRecommendedUri ||
|
||||
a.isAuthenticated !== b.isAuthenticated ||
|
||||
a.isSearching !== b.isSearching ||
|
||||
(a.recommendedContentUris && !b.recommendedContentUris) ||
|
||||
(!a.recommendedContentUris && b.recommendedContentUris) ||
|
||||
|
|
|
@ -4,25 +4,12 @@ import React from 'react';
|
|||
import Button from 'component/button';
|
||||
import Yrbl from 'component/yrbl';
|
||||
import { SITE_HELP_EMAIL } from 'config';
|
||||
// @if TARGET='web'
|
||||
import { STATUS_DEGRADED, STATUS_FAILING, STATUS_DOWN } from 'web/effects/use-degraded-performance';
|
||||
// @endif
|
||||
|
||||
type Props = {
|
||||
lbryTvApiStatus: string,
|
||||
};
|
||||
type Props = {};
|
||||
|
||||
export default function SyncFatalError(props: Props) {
|
||||
const { lbryTvApiStatus } = props;
|
||||
|
||||
let downTime = false;
|
||||
|
||||
// @if TARGET='web'
|
||||
downTime =
|
||||
IS_WEB &&
|
||||
(lbryTvApiStatus === STATUS_DEGRADED || lbryTvApiStatus === STATUS_FAILING || lbryTvApiStatus === STATUS_DOWN);
|
||||
// @endif
|
||||
|
||||
return (
|
||||
<div className="main--empty">
|
||||
<Yrbl
|
||||
|
|
|
@ -1,11 +0,0 @@
|
|||
import { connect } from 'react-redux';
|
||||
import { selectTheme } from 'redux/selectors/settings';
|
||||
import { makeSelectClaimForUri, makeSelectClaimIsNsfw } from 'redux/selectors/claims';
|
||||
import Ads from './view';
|
||||
const select = (state, props) => ({
|
||||
theme: selectTheme(state),
|
||||
claim: makeSelectClaimForUri(props.uri)(state),
|
||||
isMature: makeSelectClaimIsNsfw(props.uri)(state),
|
||||
});
|
||||
|
||||
export default connect(select)(Ads);
|
|
@ -1,123 +0,0 @@
|
|||
// @flow
|
||||
import { DOMAIN, SHOW_ADS } from 'config';
|
||||
import * as PAGES from 'constants/pages';
|
||||
import React, { useEffect } from 'react';
|
||||
import { withRouter } from 'react-router';
|
||||
import I18nMessage from 'component/i18nMessage';
|
||||
import Button from 'component/button';
|
||||
import classnames from 'classnames';
|
||||
// $FlowFixMe
|
||||
|
||||
const ADS_URL = '//assets.revcontent.com/master/delivery.js';
|
||||
const IS_MOBILE = typeof window.orientation !== 'undefined';
|
||||
|
||||
type Props = {
|
||||
location: { pathname: string },
|
||||
type: string,
|
||||
small: boolean,
|
||||
claim: Claim,
|
||||
isMature: boolean,
|
||||
};
|
||||
|
||||
function Ads(props: Props) {
|
||||
const {
|
||||
location: { pathname },
|
||||
type = 'sidebar',
|
||||
small,
|
||||
} = props;
|
||||
|
||||
useEffect(() => {
|
||||
if (SHOW_ADS && type === 'video') {
|
||||
let script;
|
||||
try {
|
||||
const d = document;
|
||||
const s = 'script';
|
||||
const n = 'playbuzz-stream';
|
||||
let fjs = d.getElementsByTagName(s)[0];
|
||||
script = d.createElement(s);
|
||||
script.className = n;
|
||||
script.src = 'https://stream.playbuzz.com/player/62d1eb10-e362-4873-99ed-c64a4052b43b';
|
||||
// $FlowFixMe
|
||||
fjs.parentNode.insertBefore(script, fjs);
|
||||
} catch (e) {}
|
||||
}
|
||||
}, [type]);
|
||||
|
||||
useEffect(() => {
|
||||
if (SHOW_ADS && !IS_MOBILE && type === 'sidebar') {
|
||||
const script = document.createElement('script');
|
||||
script.src = ADS_URL;
|
||||
script.async = true;
|
||||
// $FlowFixMe
|
||||
document.body.appendChild(script);
|
||||
return () => {
|
||||
// $FlowFixMe
|
||||
document.body.removeChild(script);
|
||||
// if user navigates too rapidly, <style> tags can build up
|
||||
// $FlowFixMe
|
||||
if (document.body.getElementsByTagName('style').length) {
|
||||
// $FlowFixMe
|
||||
document.body.getElementsByTagName('style')[0].remove();
|
||||
}
|
||||
};
|
||||
}
|
||||
}, [type]);
|
||||
|
||||
const adsSignInDriver = (
|
||||
<I18nMessage
|
||||
tokens={{
|
||||
log_in_to_domain: (
|
||||
<Button
|
||||
button="link"
|
||||
label={__('Log in to %domain%', { domain: DOMAIN })}
|
||||
navigate={`/$/${PAGES.AUTH}?redirect=${pathname}`}
|
||||
/>
|
||||
),
|
||||
download_the_app: <Button button="link" label={__('download the app')} href="https://lbry.com/get" />,
|
||||
}}
|
||||
>
|
||||
Hate these? %log_in_to_domain% or %download_the_app% for an ad free experience.
|
||||
</I18nMessage>
|
||||
);
|
||||
|
||||
const videoAd = (
|
||||
<div className="ads__claim-item">
|
||||
<div id="62d1eb10-e362-4873-99ed-c64a4052b43b" className="ads__injected-video" />
|
||||
<div
|
||||
className={classnames('ads__claim-text', {
|
||||
'ads__claim-text--small': small,
|
||||
})}
|
||||
>
|
||||
<div>Ad</div>
|
||||
<p>{adsSignInDriver}</p>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
const sidebarAd = (
|
||||
<div className="ads-wrapper">
|
||||
<p>Ads</p>
|
||||
<p>{adsSignInDriver}</p>
|
||||
<div
|
||||
id="rc-widget-0a74cf"
|
||||
data-rc-widget
|
||||
data-widget-host="habitat"
|
||||
data-endpoint="//trends.revcontent.com"
|
||||
data-widget-id="117427"
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
|
||||
if (!SHOW_ADS) {
|
||||
return false;
|
||||
}
|
||||
if (type === 'video') {
|
||||
return videoAd;
|
||||
}
|
||||
|
||||
if (type === 'sidebar') {
|
||||
return sidebarAd;
|
||||
}
|
||||
}
|
||||
|
||||
export default withRouter(Ads);
|
|
@ -1,39 +0,0 @@
|
|||
import React from 'react';
|
||||
import Button from 'component/button';
|
||||
import I18nMessage from 'component/i18nMessage';
|
||||
import { SIMPLE_SITE } from 'config';
|
||||
|
||||
export default function Footer() {
|
||||
if (!SIMPLE_SITE) {
|
||||
return null;
|
||||
}
|
||||
return (
|
||||
<footer className="footer">
|
||||
<span className="footer__section-title">
|
||||
<I18nMessage tokens={{ lbry_link: <Button button="link" label={'LBRY'} href="https://lbry.com" /> }}>
|
||||
POWERED BY %lbry_link%
|
||||
</I18nMessage>
|
||||
</span>
|
||||
<ul className="navigation__tertiary footer__links">
|
||||
<li className="footer__link">
|
||||
<Button label={__('About --[link title in Sidebar or Footer]--')} href="https://lbry.com/about" />
|
||||
</li>
|
||||
<li className="footer__link">
|
||||
<Button label={__('Community Guidelines')} href="https://odysee.com/@OdyseeHelp:b/Community-Guidelines:c" />
|
||||
</li>
|
||||
<li className="footer__link">
|
||||
<Button label={__('FAQ')} href="https://odysee.com/@OdyseeHelp:b" />
|
||||
</li>
|
||||
<li className="footer__link">
|
||||
<Button label={__('Support --[used in footer; general help/support]--')} href="https://lbry.com/support" />
|
||||
</li>
|
||||
<li className="footer__link">
|
||||
<Button label={__('Terms')} href="https://lbry.com/termsofservice" />
|
||||
</li>
|
||||
<li className="footer__link">
|
||||
<Button label={__('Privacy Policy')} href="https://lbry.com/privacy" />
|
||||
</li>
|
||||
</ul>
|
||||
</footer>
|
||||
);
|
||||
}
|
|
@ -1,13 +0,0 @@
|
|||
import React from 'react';
|
||||
import Button from 'component/button';
|
||||
const memes = require('memes');
|
||||
|
||||
export default function Meme() {
|
||||
return (
|
||||
<h1 className="home__meme">
|
||||
<Button button="link" href={memes.url}>
|
||||
{memes.text}
|
||||
</Button>
|
||||
</h1>
|
||||
);
|
||||
}
|
|
@ -1,62 +0,0 @@
|
|||
// @flow
|
||||
import React from 'react';
|
||||
import Nag from 'component/common/nag';
|
||||
import I18nMessage from 'component/i18nMessage';
|
||||
import Button from 'component/button';
|
||||
import { useIsMobile } from 'effects/use-screensize';
|
||||
|
||||
type Props = {
|
||||
onClose: () => void,
|
||||
};
|
||||
|
||||
export default function NagDegradedPerformance(props: Props) {
|
||||
const { onClose } = props;
|
||||
const isMobile = useIsMobile();
|
||||
|
||||
return (
|
||||
<React.Fragment>
|
||||
{isMobile ? (
|
||||
<Nag
|
||||
message={
|
||||
<I18nMessage
|
||||
tokens={{
|
||||
more_information: (
|
||||
<Button
|
||||
button="link"
|
||||
label={__('more --[value for "more_information"]--')}
|
||||
href="https://lbry.com/faq/privacy-and-data"
|
||||
/>
|
||||
),
|
||||
}}
|
||||
>
|
||||
lbry.tv collects usage information for itself only (%more_information%).
|
||||
</I18nMessage>
|
||||
}
|
||||
actionText={__('OK')}
|
||||
onClick={onClose}
|
||||
/>
|
||||
) : (
|
||||
<Nag
|
||||
message={
|
||||
<I18nMessage
|
||||
tokens={{
|
||||
more_information: (
|
||||
<Button
|
||||
button="link"
|
||||
label={__('more --[value for "more_information"]--')}
|
||||
href="https://lbry.com/faq/privacy-and-data"
|
||||
/>
|
||||
),
|
||||
}}
|
||||
>
|
||||
lbry.tv collects usage information for itself only (%more_information%). Want control over this and more?
|
||||
</I18nMessage>
|
||||
}
|
||||
actionText={__('Get The App')}
|
||||
href="https://lbry.com/get"
|
||||
onClose={onClose}
|
||||
/>
|
||||
)}
|
||||
</React.Fragment>
|
||||
);
|
||||
}
|
|
@ -1,34 +0,0 @@
|
|||
// @flow
|
||||
import { DOMAIN } from 'config';
|
||||
import React from 'react';
|
||||
import Nag from 'component/common/nag';
|
||||
import I18nMessage from 'component/i18nMessage';
|
||||
import Button from 'component/button';
|
||||
|
||||
type Props = {
|
||||
onClose: () => void,
|
||||
};
|
||||
|
||||
export default function NagDegradedPerformance(props: Props) {
|
||||
const { onClose } = props;
|
||||
|
||||
return (
|
||||
<Nag
|
||||
type="error"
|
||||
message={
|
||||
<I18nMessage
|
||||
tokens={{
|
||||
DOMAIN,
|
||||
more_information: <Button button="link" label={__('more')} href="https://status.lbry.com/" />,
|
||||
}}
|
||||
>
|
||||
%DOMAIN% performance may be degraded. You can try to use it, or wait 5 minutes and refresh. Please no crush
|
||||
us.
|
||||
</I18nMessage>
|
||||
}
|
||||
actionText={__('Refresh')}
|
||||
onClick={() => window.location.reload()}
|
||||
onClose={onClose}
|
||||
/>
|
||||
);
|
||||
}
|
|
@ -1,24 +0,0 @@
|
|||
// @flow
|
||||
import { SITE_NAME } from 'config';
|
||||
import React from 'react';
|
||||
import Nag from 'component/common/nag';
|
||||
import I18nMessage from 'component/i18nMessage';
|
||||
|
||||
export default function NagNoUser() {
|
||||
return (
|
||||
<Nag
|
||||
type="error"
|
||||
message={
|
||||
<I18nMessage
|
||||
tokens={{
|
||||
SITE_NAME,
|
||||
}}
|
||||
>
|
||||
Could not get a user ID. Account functions will be unavailable. Try again in a bit.
|
||||
</I18nMessage>
|
||||
}
|
||||
actionText={__('Refresh')}
|
||||
onClick={() => window.location.reload()}
|
||||
/>
|
||||
);
|
||||
}
|
|
@ -1,38 +0,0 @@
|
|||
// @flow
|
||||
import React from 'react';
|
||||
import Nag from 'component/common/nag';
|
||||
import I18nMessage from 'component/i18nMessage';
|
||||
import * as PAGES from 'constants/pages';
|
||||
import { useHistory } from 'react-router';
|
||||
import Button from '../../ui/component/button';
|
||||
|
||||
type Props = {
|
||||
email?: User,
|
||||
onClose: () => void,
|
||||
};
|
||||
export default function NagSunset(props: Props) {
|
||||
const { email, onClose } = props;
|
||||
const { push } = useHistory();
|
||||
|
||||
const handleOnClick = () => {
|
||||
onClose();
|
||||
push(`/$/${PAGES.AUTH_SIGNIN}`);
|
||||
};
|
||||
return (
|
||||
<Nag
|
||||
type="helpful"
|
||||
message={
|
||||
<I18nMessage
|
||||
tokens={{
|
||||
more: <Button button={'link'} label={__('Learn more')} href="https://odysee.com/@lbry:3f/retirement" />,
|
||||
}}
|
||||
>
|
||||
lbry.tv has been retired. You have been magically transported to Odysee.com. %more%
|
||||
</I18nMessage>
|
||||
}
|
||||
actionText={__('Sign In')}
|
||||
onClick={!email ? handleOnClick : undefined}
|
||||
onClose={onClose}
|
||||
/>
|
||||
);
|
||||
}
|
|
@ -1,9 +0,0 @@
|
|||
import { connect } from 'react-redux';
|
||||
import { selectUser } from 'redux/selectors/user';
|
||||
import OpenInAppLink from './view';
|
||||
|
||||
const select = state => ({
|
||||
user: selectUser(state),
|
||||
});
|
||||
|
||||
export default connect(select)(OpenInAppLink);
|
|
@ -1,100 +0,0 @@
|
|||
// @flow
|
||||
import React from 'react';
|
||||
import { withRouter } from 'react-router';
|
||||
import { formatWebUrlIntoLbryUrl } from 'util/url';
|
||||
import Nag from 'component/common/nag';
|
||||
import usePersistedState from 'effects/use-persisted-state';
|
||||
|
||||
const userAgent = navigator.userAgent.toLowerCase();
|
||||
const isAndroidDevice = userAgent.includes('android');
|
||||
const isDesktopDevice = typeof window.orientation === 'undefined';
|
||||
const addDaysToMs = (initialNumberInMs: number, daysToAdd: number) => {
|
||||
return initialNumberInMs + daysToAdd * 1000 * 60 * 60 * 24;
|
||||
};
|
||||
|
||||
type Props = {
|
||||
history: { replace: string => void, push: string => void },
|
||||
location: { search: string, pathname: string },
|
||||
uri: string,
|
||||
user: ?User,
|
||||
};
|
||||
|
||||
function OpenInAppLink(props: Props) {
|
||||
const {
|
||||
history: { replace },
|
||||
location,
|
||||
uri,
|
||||
user,
|
||||
} = props;
|
||||
const [showNag, setShowNag] = React.useState(false);
|
||||
const [closeNagClicksCount, setCloseNagClicksCount] = usePersistedState('open-in-app-close-count', 0);
|
||||
const [closeNagLastDate, setCloseNagLastDate] = usePersistedState('open-in-app-close-date', 0);
|
||||
const { pathname, search } = location;
|
||||
let params = new URLSearchParams(search);
|
||||
const hasSrcParam = params.get('src');
|
||||
let isAndroidUser = false;
|
||||
let isDesktopUser = false;
|
||||
user &&
|
||||
user.device_types &&
|
||||
user.device_types.forEach(usedDevice => {
|
||||
if (usedDevice === 'mobile') {
|
||||
isAndroidUser = true;
|
||||
} else if (usedDevice === 'desktop') {
|
||||
isDesktopUser = true;
|
||||
}
|
||||
});
|
||||
|
||||
const isWebUserOnly = !isAndroidUser && !isDesktopUser;
|
||||
|
||||
let appLink = uri;
|
||||
if (!appLink) {
|
||||
appLink = formatWebUrlIntoLbryUrl(pathname, search);
|
||||
}
|
||||
|
||||
function handleClose() {
|
||||
setShowNag(false);
|
||||
setCloseNagClicksCount(closeNagClicksCount + 1);
|
||||
setCloseNagLastDate(Date.now());
|
||||
}
|
||||
|
||||
React.useEffect(() => {
|
||||
if (hasSrcParam) {
|
||||
params.delete('src');
|
||||
const newParams = params.toString();
|
||||
const newUrl = `${pathname}?${newParams}`;
|
||||
replace(newUrl);
|
||||
}
|
||||
}, [hasSrcParam, search, pathname, replace]);
|
||||
|
||||
React.useEffect(() => {
|
||||
const isOnDeviceToPrompt = (isAndroidUser && isAndroidDevice) || (isDesktopUser && isDesktopDevice);
|
||||
const dateRightNow = Date.now();
|
||||
const daysToAddToDate = Math.min(30, Math.pow(2, closeNagClicksCount));
|
||||
const startDateForAnotherOpenNag = closeNagLastDate + addDaysToMs(closeNagLastDate, daysToAddToDate);
|
||||
const hasWaitedEnoughTime = dateRightNow > startDateForAnotherOpenNag;
|
||||
|
||||
if (isOnDeviceToPrompt && hasWaitedEnoughTime) {
|
||||
setShowNag(true);
|
||||
}
|
||||
// Don't pass showNag into this effect because we only want the initial value
|
||||
// If the param is removed from the url, the nag should still be shown
|
||||
}, [setShowNag, isAndroidUser, isDesktopUser, closeNagLastDate, closeNagClicksCount]);
|
||||
|
||||
if (!showNag || isWebUserOnly) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<Nag
|
||||
type="helpful"
|
||||
message={__('It looks like you may have LBRY %platform% installed.', {
|
||||
platform: isDesktopDevice ? __('Desktop') : __('Android'),
|
||||
})}
|
||||
actionText={__('Use the App')}
|
||||
href={appLink}
|
||||
onClose={handleClose}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
export default withRouter(OpenInAppLink);
|
|
@ -1,9 +0,0 @@
|
|||
import { connect } from 'react-redux';
|
||||
import { selectUserVerifiedEmail } from 'redux/selectors/user';
|
||||
import Pixel from './view';
|
||||
|
||||
const select = (state) => ({
|
||||
isAuthenticated: Boolean(selectUserVerifiedEmail(state)),
|
||||
});
|
||||
|
||||
export default connect(select)(Pixel);
|
|
@ -1,42 +0,0 @@
|
|||
// @flow
|
||||
import React from 'react';
|
||||
import { SIMPLE_SITE } from 'config';
|
||||
import { useIsMobile } from 'effects/use-screensize';
|
||||
|
||||
type Props = {
|
||||
type: string,
|
||||
isAuthenticated: boolean,
|
||||
};
|
||||
|
||||
const Pixel = (props: Props) => {
|
||||
const { type, isAuthenticated } = props;
|
||||
const isMobile = useIsMobile();
|
||||
|
||||
// TODO: restrict to country
|
||||
if (!SIMPLE_SITE || isMobile || isAuthenticated) {
|
||||
return null;
|
||||
}
|
||||
if (type === 'retargeting') {
|
||||
return (
|
||||
<>
|
||||
<img
|
||||
src="https://ctrack.trafficjunky.net/ctrack?action=list&type=add&id=0&context=Odysee&cookiename=RetargetingPixel&age=44000&maxcookiecount=10"
|
||||
alt=""
|
||||
/>
|
||||
</>
|
||||
);
|
||||
} else if (type === 'kill') {
|
||||
return (
|
||||
<>
|
||||
<img
|
||||
src="https://ctrack.trafficjunky.net/ctrack?action=list&type=add&id=0&context=Odysee&cookiename=KillPixel&age=0&maxcookiecount=10"
|
||||
alt=""
|
||||
/>
|
||||
</>
|
||||
);
|
||||
} else {
|
||||
return null;
|
||||
}
|
||||
};
|
||||
|
||||
export default Pixel;
|
|
@ -1,12 +0,0 @@
|
|||
import { connect } from 'react-redux';
|
||||
import { doOpenModal } from 'redux/actions/app';
|
||||
import { selectUser } from 'redux/selectors/user';
|
||||
import YoutubeWelcome from './view';
|
||||
|
||||
const select = state => ({
|
||||
user: selectUser(state),
|
||||
});
|
||||
|
||||
export default connect(select, {
|
||||
doOpenModal,
|
||||
})(YoutubeWelcome);
|
|
@ -1,24 +0,0 @@
|
|||
// @flow
|
||||
import * as MODALS from 'constants/modal_types';
|
||||
import React from 'react';
|
||||
import usePersistedState from 'effects/use-persisted-state';
|
||||
|
||||
type Props = { doOpenModal: string => void, user: ?User };
|
||||
|
||||
const YoutubeWelcome = (props: Props) => {
|
||||
const { doOpenModal, user } = props;
|
||||
const [hasBeenShownIntro, setHasBeenShownIntro] = usePersistedState('youtube-welcome', false);
|
||||
const isYouTubeReferrer = document.referrer.includes('youtube.com');
|
||||
const shouldShowWelcome = !hasBeenShownIntro && isYouTubeReferrer && user && !user.has_verified_email;
|
||||
|
||||
React.useEffect(() => {
|
||||
if (shouldShowWelcome) {
|
||||
doOpenModal(MODALS.YOUTUBE_WELCOME);
|
||||
setHasBeenShownIntro(true);
|
||||
}
|
||||
}, [shouldShowWelcome, setHasBeenShownIntro, doOpenModal]);
|
||||
|
||||
return null;
|
||||
};
|
||||
|
||||
export default YoutubeWelcome;
|
Loading…
Reference in a new issue