diff --git a/ui/component/router/view.jsx b/ui/component/router/view.jsx index 4d3d166c0..ea8e5091a 100644 --- a/ui/component/router/view.jsx +++ b/ui/component/router/view.jsx @@ -86,7 +86,7 @@ type Props = { function AppRouter(props: Props) { const { currentScroll, - location: { pathname }, + location: { pathname, search }, isAuthenticated, history, uri, @@ -95,6 +95,8 @@ function AppRouter(props: Props) { } = props; const { entries } = history; const entryIndex = history.index; + const urlParams = new URLSearchParams(search); + const resetScroll = urlParams.get('reset_scroll'); useEffect(() => { if (uri) { @@ -123,7 +125,7 @@ function AppRouter(props: Props) { useEffect(() => { window.scrollTo(0, currentScroll); - }, [currentScroll, pathname]); + }, [currentScroll, pathname, resetScroll]); // react-router doesn't decode pathanmes before doing the route matching check // We have to redirect here because if we redirect on the server, it might get encoded again @@ -150,6 +152,7 @@ function AppRouter(props: Props) { + 0; + const showFollowIntro = hasVerifiedEmail && !hasSeenFollowList; const canHijackSignInFlowWithSpinner = hasVerifiedEmail && !getSyncError && !showFollowIntro; const isCurrentlyFetchingSomething = fetchingChannels || claimingReward || syncingWallet || creatingChannel; const isWaitingForSomethingToFinish = @@ -119,7 +120,22 @@ function UserSignIn(props: Props) { showEmailVerification && , showUserVerification && , showChannelCreation && , - showFollowIntro && setHasSeenFollowList(true)} />, + showFollowIntro && ( + { + let url = `/$/${PAGES.AUTH}?reset_scroll=1`; + if (redirect) { + url += `&redirect=${redirect}`; + } + if (shouldRedirectImmediately) { + url += `&immediate=true`; + } + + history.replace(url); + setHasSeenFollowList(true); + }} + /> + ), showYoutubeTransfer && (
diff --git a/ui/scss/component/nag.scss b/ui/scss/component/nag.scss index e218f9292..8ff754cb1 100644 --- a/ui/scss/component/nag.scss +++ b/ui/scss/component/nag.scss @@ -9,6 +9,7 @@ color: var(--color-white); font-weight: var(--font-weight-bold); text-align: center; + z-index: 2; .button--link { font-weight: var(--font-weight-bold); @@ -20,6 +21,7 @@ .nag--helpful { background-color: var(--color-secondary); color: var(--color-white); + z-index: 3; } .nag__button {