diff --git a/static/app-strings.json b/static/app-strings.json index c496eda64..3730d8065 100644 --- a/static/app-strings.json +++ b/static/app-strings.json @@ -1476,5 +1476,6 @@ "Currently winning": "Currently winning", "URL can not include a space": "URL can not include a space", "Creator analytics are down for maintenance. Please check back later.": "Creator analytics are down for maintenance. Please check back later.", + "Sign up to earn %lbc% for you and your favorite creators.": "Sign up to earn %lbc% for you and your favorite creators.", "--end--": "--end--" } diff --git a/ui/component/claimSupportButton/index.js b/ui/component/claimSupportButton/index.js index 592d0d060..e4209e596 100644 --- a/ui/component/claimSupportButton/index.js +++ b/ui/component/claimSupportButton/index.js @@ -1,11 +1,13 @@ import { connect } from 'react-redux'; import { doOpenModal } from 'redux/actions/app'; -import ClaimSupportButton from './view'; +import { selectUser } from 'redux/selectors/user'; import { makeSelectTagInClaimOrChannelForUri } from 'lbry-redux'; +import ClaimSupportButton from './view'; const DISABLE_SUPPORT_TAG = 'disable-support'; const select = (state, props) => ({ disableSupport: makeSelectTagInClaimOrChannelForUri(props.uri, DISABLE_SUPPORT_TAG)(state), + user: selectUser(state), }); export default connect(select, { diff --git a/ui/component/claimSupportButton/view.jsx b/ui/component/claimSupportButton/view.jsx index bebc3b4af..75405e88f 100644 --- a/ui/component/claimSupportButton/view.jsx +++ b/ui/component/claimSupportButton/view.jsx @@ -4,29 +4,60 @@ import * as ICONS from 'constants/icons'; import React from 'react'; import classnames from 'classnames'; import Button from 'component/button'; +import usePersistedState from 'effects/use-persisted-state'; type Props = { uri: string, doOpenModal: (string, {}) => void, fileAction?: boolean, disableSupport: boolean, + user: ?User, }; export default function ClaimSupportButton(props: Props) { - const { doOpenModal, uri, fileAction, disableSupport } = props; + const { doOpenModal, uri, fileAction, disableSupport, user } = props; + const [showNudge, setShowNudge] = React.useState(false); + const [nudgeAcknowledged, setNudgeAcknowledged] = usePersistedState('nudge:support-acknowledge', false); + const emailVerified = user && user.has_verified_email; + + React.useEffect(() => { + if (!emailVerified && !nudgeAcknowledged && fileAction) { + setShowNudge(true); + } + }, [emailVerified, nudgeAcknowledged, fileAction]); + if (disableSupport) { return null; } + return ( -