sync support on lbry.tv

src/ui/component/app/index.js

@@ -1,7 +1,14 @@
 import * as SETTINGS from 'constants/settings';
 import { hot } from 'react-hot-loader/root';
 import { connect } from 'react-redux';
-import { selectUser, doRewardList, doFetchRewardedContent, doFetchAccessToken, selectAccessToken } from 'lbryinc';
+import {
+  selectUser,
+  doRewardList,
+  doFetchRewardedContent,
+  doFetchAccessToken,
+  selectAccessToken,
+  selectGetSyncErrorMessage,
+} from 'lbryinc';
 import { doFetchTransactions, doFetchChannelListMine, selectBalance } from 'lbry-redux';
 import { makeSelectClientSetting, selectThemePath } from 'redux/selectors/settings';
 import { selectIsUpgradeAvailable, selectAutoUpdateDownloaded } from 'redux/selectors/app';
@@ -17,6 +24,7 @@ const select = state => ({
   isUpgradeAvailable: selectIsUpgradeAvailable(state),
   balance: selectBalance(state),
   syncEnabled: makeSelectClientSetting(SETTINGS.ENABLE_SYNC)(state),
+  syncError: selectGetSyncErrorMessage(state),
   accessToken: selectAccessToken(state),
 });
 

src/ui/component/app/view.jsx

@@ -1,6 +1,7 @@
 // @flow
 import * as ICONS from 'constants/icons';
 import * as ACTIONS from 'constants/action_types';
+import * as PAGES from 'constants/pages';
 import React, { useEffect, useRef, useState } from 'react';
 import classnames from 'classnames';
 import analytics from 'analytics';
@@ -31,6 +32,7 @@ type Props = {
   theme: string,
   user: ?{ id: string, has_verified_email: boolean, is_reward_approved: boolean },
   location: { pathname: string, hash: string },
+  history: { push: string => void },
   fetchRewards: () => void,
   fetchRewardedContent: () => void,
   fetchTransactions: () => void,
@@ -47,6 +49,7 @@ type Props = {
   syncEnabled: boolean,
   balance: ?number,
   accessToken: ?string,
+  syncError: ?string,
 };
 
 function App(props: Props) {
@@ -67,6 +70,8 @@ function App(props: Props) {
     checkSync,
     balance,
     accessToken,
+    history,
+    syncError,
   } = props;
 
   const appRef = useRef();
@@ -121,7 +126,7 @@ function App(props: Props) {
       }
       setHasDeterminedIfNewUser(true);
     });
-  }, [balance, accessToken, hasDeterminedIfNewUser]);
+  }, [balance, accessToken, hasDeterminedIfNewUser, setHasDeterminedIfNewUser]);
 
   useEffect(() => {
     ReactModal.setAppElement(appRef.current);
@@ -183,6 +188,10 @@ function App(props: Props) {
     }
   }, [hasVerifiedEmail, syncEnabled, checkSync, hasDeterminedIfNewUser]);
 
+  useEffect(() => {
+    history.push(`/$/${PAGES.AUTH}?redirect=${pathname}`);
+  }, [syncError, pathname]);
+
   if (!user) {
     return null;
   }

src/ui/component/userSignIn/view.jsx

@@ -115,13 +115,11 @@ function UserSignIn(props: Props) {
     showEmailVerification && <UserEmailVerify />,
     showUserVerification && <UserVerify skipLink={redirect} />,
     showChannelCreation && <UserFirstChannel />,
-    // @if TARGET='app'
     showYoutubeTransfer && (
       <div>
         <YoutubeTransferStatus /> <Confetti recycle={false} style={{ position: 'fixed' }} />
       </div>
     ),
-    // @endif
     showSyncPassword && <SyncPassword />,
     showLoadingSpinner && (
       <div className="main--empty">

src/ui/redux/actions/app.js

@@ -33,7 +33,7 @@ import {
   selectUpgradeTimer,
   selectModal,
 } from 'redux/selectors/app';
-import { doAuthenticate, doGetSync, doResetSync } from 'lbryinc';
+import { doAuthenticate, doGetSync } from 'lbryinc';
 import { lbrySettings as config, version as appVersion } from 'package.json';
 import { push } from 'connected-react-router';
 import analytics from 'analytics';
@@ -451,9 +451,6 @@ export function doSignOut() {
         // @if TARGET='web'
         window.persistor.purge();
         // @endif
-        // @if TARGET='app'
-        return dispatch(doResetSync());
-        // @endif
       })
       .then(() => {
         setTimeout(() => {

src/ui/util/saved-passwords.js

@@ -37,16 +37,23 @@ function deleteCookie(name: string) {
 
 export const setSavedPassword = (value?: string, saveToDisk: boolean) => {
   return new Promise<*>(resolve => {
+    // @if TARGET='app'
     ipcRenderer.once('set-password-response', (event, success) => {
       resolve(success);
     });
+    // @endif
 
     const password = value === undefined || value === null ? '' : value;
     sessionPassword = password;
 
     if (saveToDisk) {
       if (password) {
+        // @if TARGET='app'
         ipcRenderer.send('set-password', password);
+        // @endif
+        // @if TARGET='web'
+        setCookie('saved-password', password, 14);
+        // @endif
       } else {
         deleteSavedPassword();
       }
@@ -68,8 +75,8 @@ export const getSavedPassword = () => {
     // @endif
 
     // @if TARGET='web'
-    // Will handle saved passwords on web differently
-    resolve('');
+    const password = getCookie('saved-password');
+    resolve(password);
     // @endif
   });
 };
@@ -82,6 +89,10 @@ export const deleteSavedPassword = () => {
     });
     ipcRenderer.send('delete-password');
     // @endif;
+    // @if TARGET='web'
+    deleteCookie('saved-password');
+    resolve();
+    // @endif
   });
 };