get sync password out of signing flow

ui/component/app/view.jsx

@@ -262,8 +262,8 @@ function App(props: Props) {
   }, [user, setReadyForPrefs]);
 
   useEffect(() => {
-    if (syncError && isAuthenticated) {
-      history.push(`/$/${PAGES.AUTH}?redirect=${pathname}`);
+    if (syncError && isAuthenticated && !pathname.includes(PAGES.AUTH_WALLET_PASSWORD)) {
+      history.push(`/$/${PAGES.AUTH_WALLET_PASSWORD}?redirect=${pathname}`);
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [syncError, pathname, isAuthenticated]);

ui/component/router/view.jsx

@@ -45,7 +45,7 @@ import CheckoutPage from 'page/checkoutPage';
 import ChannelNew from 'page/channelNew';
 import BuyPage from 'page/buy';
 import NotificationsPage from 'page/notifications';
-
+import SignInWalletPasswordPage from 'page/signInWalletPassword';
 import { parseURI } from 'lbry-redux';
 import { SITE_TITLE, WELCOME_VERSION } from 'config';
 
@@ -232,6 +232,7 @@ function AppRouter(props: Props) {
       <PrivateRoute {...props} path={`/$/${PAGES.CHANNELS}`} component={ChannelsPage} />
       <PrivateRoute {...props} path={`/$/${PAGES.BUY}`} component={BuyPage} />
       <PrivateRoute {...props} path={`/$/${PAGES.NOTIFICATIONS}`} component={NotificationsPage} />
+      <PrivateRoute {...props} path={`/$/${PAGES.AUTH_WALLET_PASSWORD}`} component={SignInWalletPasswordPage} />
 
       <Route path={`/$/${PAGES.EMBED}/:claimName`} exact component={EmbedWrapperPage} />
       <Route path={`/$/${PAGES.EMBED}/:claimName/:claimId`} exact component={EmbedWrapperPage} />

ui/component/syncPassword/view.jsx

@@ -6,6 +6,7 @@ import Card from 'component/common/card';
 import { setSavedPassword } from 'util/saved-passwords';
 import usePersistedState from 'effects/use-persisted-state';
 import I18nMessage from 'component/i18nMessage';
+import { useHistory } from 'react-router';
 
 type Props = {
   getSync: ((any, boolean) => void, ?string) => void,
@@ -18,6 +19,12 @@ type Props = {
 
 function SyncPassword(props: Props) {
   const { getSync, getSyncIsPending, email, signOut, passwordError, handleSyncComplete } = props;
+  const {
+    push,
+    location: { search },
+  } = useHistory();
+  const urlParams = new URLSearchParams(search);
+  const redirect = urlParams.get('redirect');
   const [password, setPassword] = React.useState('');
   const [rememberPassword, setRememberPassword] = usePersistedState(true);
 
@@ -26,6 +33,7 @@ function SyncPassword(props: Props) {
       handleSyncComplete(error, hasDataChanged);
 
       if (!error) {
+        push(redirect || '/');
         setSavedPassword(password, rememberPassword);
       }
     }, password);
@@ -55,7 +63,12 @@ function SyncPassword(props: Props) {
               onChange={() => setRememberPassword(!rememberPassword)}
             />
             <div className="card__actions">
-              <Button type="submit" button="primary" label={__('Continue')} disabled={getSyncIsPending} />
+              <Button
+                type="submit"
+                button="primary"
+                label={getSyncIsPending ? __('Continue...') : __('Continue')}
+                disabled={getSyncIsPending}
+              />
               <Button button="link" label={__('Cancel')} onClick={signOut} />
             </div>
             <p className="help">

ui/component/userSignUp/index.js

@@ -1,6 +1,6 @@
 import REWARD_TYPES from 'rewards';
 import { connect } from 'react-redux';
-import { selectGetSyncIsPending, selectGetSyncErrorMessage, selectSyncHash } from 'lbryinc';
+import { selectGetSyncIsPending, selectSyncHash } from 'lbryinc';
 import { doClaimRewardType } from 'redux/actions/rewards';
 import { selectClaimedRewards, makeSelectIsRewardClaimPending } from 'redux/selectors/rewards';
 import { doUserFetch } from 'redux/actions/user';
@@ -36,7 +36,6 @@ const select = state => ({
   userFetchPending: selectUserIsPending(state),
   syncEnabled: makeSelectClientSetting(SETTINGS.ENABLE_SYNC)(state),
   syncingWallet: selectGetSyncIsPending(state),
-  getSyncError: selectGetSyncErrorMessage(state),
   hasSynced: Boolean(selectSyncHash(state)),
   creatingChannel: selectCreatingChannel(state),
 });

ui/component/userSignUp/view.jsx

@@ -13,7 +13,6 @@ import REWARDS from 'rewards';
 import UserVerify from 'component/userVerify';
 import Spinner from 'component/spinner';
 import YoutubeTransferStatus from 'component/youtubeTransferStatus';
-import SyncPassword from 'component/syncPassword';
 import useFetched from 'effects/use-fetched';
 import usePersistedState from 'effects/use-persisted-state';
 import Confetti from 'react-confetti';
@@ -34,7 +33,6 @@ type Props = {
   syncEnabled: boolean,
   hasSynced: boolean,
   syncingWallet: boolean,
-  getSyncError: ?string,
   creatingChannel: boolean,
 };
 
@@ -53,7 +51,6 @@ function UserSignIn(props: Props) {
     youtubeChannels,
     syncEnabled,
     syncingWallet,
-    getSyncError,
     hasSynced,
     fetchingChannels,
     creatingChannel,
@@ -88,7 +85,6 @@ function UserSignIn(props: Props) {
   const showEmail = !hasVerifiedEmail;
   const showEmailVerification = (emailToVerify && !hasVerifiedEmail) || (!hasVerifiedEmail && passwordSet);
   const showUserVerification = hasVerifiedEmail && !rewardsApproved && !isIdentityVerified && !hasSkippedRewards;
-  const showSyncPassword = syncEnabled && getSyncError;
   const showChannelCreation =
     hasVerifiedEmail &&
     balance !== undefined &&
@@ -99,7 +95,7 @@ function UserSignIn(props: Props) {
   const showYoutubeTransfer = hasVerifiedEmail && hasYoutubeChannels && !isYoutubeTransferComplete;
   const showFollowIntro = step === 'channels' || (hasVerifiedEmail && !hasSeenFollowList);
   const showTagsIntro = step === 'tags' || (hasVerifiedEmail && !hasSeenTagsList);
-  const canHijackSignInFlowWithSpinner = hasVerifiedEmail && !getSyncError && !showFollowIntro;
+  const canHijackSignInFlowWithSpinner = hasVerifiedEmail && !showFollowIntro;
   const isCurrentlyFetchingSomething = fetchingChannels || claimingReward || syncingWallet || creatingChannel;
   const isWaitingForSomethingToFinish =
     // If the user has claimed the email award, we need to wait until the balance updates sometime in the future
@@ -177,7 +173,6 @@ function UserSignIn(props: Props) {
         <YoutubeTransferStatus /> <Confetti recycle={false} style={{ position: 'fixed' }} />
       </div>
     ),
-    showSyncPassword && <SyncPassword />,
     showLoadingSpinner && (
       <div className="main--empty">
         <Spinner />

ui/constants/pages.js

@@ -3,6 +3,7 @@ exports.AUTH_SIGNIN = 'signin';
 exports.AUTH_VERIFY = 'verify';
 exports.AUTH_PASSWORD_RESET = 'resetpassword';
 exports.AUTH_PASSWORD_SET = 'reset'; // This is tied to a link in internal-apis - don't change this
+exports.AUTH_WALLET_PASSWORD = 'walletpassword';
 exports.BACKUP = 'backup';
 exports.CHANNEL = 'channel';
 exports.DISCOVER = 'discover';

ui/page/signInWalletPassword/index.js

@@ -0,0 +1,10 @@
+import { connect } from 'react-redux';
+import { doToast } from 'redux/actions/notifications';
+import SignInWalletPasswordPage from './view';
+
+const select = () => ({});
+const perform = {
+  doToast,
+};
+
+export default connect(select, perform)(SignInWalletPasswordPage);

ui/page/signInWalletPassword/view.jsx

@@ -0,0 +1,11 @@
+import React from 'react';
+import Page from 'component/page';
+import SyncPassword from 'component/syncPassword';
+
+export default function SignInWalletPasswordPage() {
+  return (
+    <Page authPage>
+      <SyncPassword />
+    </Page>
+  );
+}