add backout option for youtube sync and fix scroll reset

This commit is contained in:
Sean Yesmunt 2020-09-15 10:23:00 -04:00
parent 0b0e92d250
commit cc0b1aea65
3 changed files with 13 additions and 3 deletions

View file

@ -58,7 +58,7 @@ function UserChannelFollowIntro(props: Props) {
defaultOrderBy={CS.ORDER_BY_TOP} defaultOrderBy={CS.ORDER_BY_TOP}
defaultFreshness={CS.FRESH_ALL} defaultFreshness={CS.FRESH_ALL}
claimType="channel" claimType="channel"
defaultTags={CS.TAGS_FOLLOWED} defaultTags={followingCount > 3 ? CS.TAGS_FOLLOWED : undefined}
/> />
{followingCount > 0 && ( {followingCount > 0 && (
<Nag <Nag

View file

@ -176,7 +176,7 @@ function UserSignUp(props: Props) {
), ),
showChannelCreation && showChannelCreation &&
(interestedInYoutubeSync ? ( (interestedInYoutubeSync ? (
<YoutubeSync inSignUpFlow /> <YoutubeSync inSignUpFlow doToggleInterestedInYoutubeSync={doToggleInterestedInYoutubeSync} />
) : ( ) : (
<UserFirstChannel doToggleInterestedInYoutubeSync={doToggleInterestedInYoutubeSync} /> <UserFirstChannel doToggleInterestedInYoutubeSync={doToggleInterestedInYoutubeSync} />
)), )),

View file

@ -22,13 +22,15 @@ type Props = {
youtubeChannels: ?Array<{ transfer_state: string, sync_status: string }>, youtubeChannels: ?Array<{ transfer_state: string, sync_status: string }>,
doUserFetch: () => void, doUserFetch: () => void,
inSignUpFlow?: boolean, inSignUpFlow?: boolean,
doToggleInterestedInYoutubeSync: () => void,
}; };
export default function YoutubeSync(props: Props) { export default function YoutubeSync(props: Props) {
const { youtubeChannels, doUserFetch, inSignUpFlow = false } = props; const { youtubeChannels, doUserFetch, inSignUpFlow = false, doToggleInterestedInYoutubeSync } = props;
const { const {
location: { search, pathname }, location: { search, pathname },
push, push,
replace,
} = useHistory(); } = useHistory();
const urlParams = new URLSearchParams(search); const urlParams = new URLSearchParams(search);
const statusToken = urlParams.get(STATUS_TOKEN_PARAM); const statusToken = urlParams.get(STATUS_TOKEN_PARAM);
@ -40,6 +42,10 @@ export default function YoutubeSync(props: Props) {
const [addingNewChannel, setAddingNewChannel] = React.useState(newChannelParam); const [addingNewChannel, setAddingNewChannel] = React.useState(newChannelParam);
const hasYoutubeChannels = youtubeChannels && youtubeChannels.length > 0; const hasYoutubeChannels = youtubeChannels && youtubeChannels.length > 0;
React.useEffect(() => {
replace(`?reset_scroll=youtube`);
}, []);
React.useEffect(() => { React.useEffect(() => {
if (statusToken && !hasYoutubeChannels) { if (statusToken && !hasYoutubeChannels) {
doUserFetch(); doUserFetch();
@ -160,6 +166,10 @@ export default function YoutubeSync(props: Props) {
label={__('Claim Now')} label={__('Claim Now')}
/> />
{inSignUpFlow && !errorMessage && (
<Button button="link" label={__('Skip')} onClick={() => doToggleInterestedInYoutubeSync()} />
)}
{errorMessage && <Button button="link" label={__('Skip')} navigate={`/$/${PAGES.REWARDS}`} />} {errorMessage && <Button button="link" label={__('Skip')} navigate={`/$/${PAGES.REWARDS}`} />}
</div> </div>
<div className="help--card-actions"> <div className="help--card-actions">