format code
This commit is contained in:
Sean Yesmunt
parent
7ae4c3301d
commit
1b62fe8a5a
2 changed files with 56 additions and 48 deletions
|
|
@ -18,7 +18,7 @@ import { IS_MAC } from 'component/app/view';
|
|||
type Props = {
|
||||
balance: string,
|
||||
roundedBalance: number,
|
||||
history: { push: string => void, goBack: () => void, goForward: () => void },
|
||||
history: { push: string => void, goBack: () => void, goForward: () => void, location: { pathname: string } },
|
||||
currentTheme: string,
|
||||
automaticDarkModeEnabled: boolean,
|
||||
setClientSetting: (string, boolean | string) => void,
|
||||
|
|
@ -49,9 +49,7 @@ const Header = (props: Props) => {
|
|||
|
||||
// Sign out if they click the "x" when they are on the password prompt
|
||||
const authHeaderAction = syncError ? { onClick: signOut } : { navigate: '/' };
|
||||
const homeButtonNavigationProps = isVerifyPage ?
|
||||
{ } :
|
||||
authHeader ? authHeaderAction : { navigate: '/' };
|
||||
const homeButtonNavigationProps = isVerifyPage ? {} : authHeader ? authHeaderAction : { navigate: '/' };
|
||||
const closeButtonNavigationProps = authHeader ? authHeaderAction : { onClick: () => history.goBack() };
|
||||
|
||||
function handleThemeToggle() {
|
||||
|
|
@ -116,7 +114,7 @@ const Header = (props: Props) => {
|
|||
)}
|
||||
{/* @endif */}
|
||||
|
||||
{!authHeader && <WunderBar/>}
|
||||
{!authHeader && <WunderBar />}
|
||||
</div>
|
||||
|
||||
{!authHeader ? (
|
||||
|
|
@ -127,37 +125,37 @@ const Header = (props: Props) => {
|
|||
<MenuButton className="header__navigation-item menu__title">{getWalletTitle()}</MenuButton>
|
||||
<MenuList className="menu__list--header">
|
||||
<MenuItem className="menu__link" onSelect={() => history.push(`/$/${PAGES.WALLET}`)}>
|
||||
<Icon aria-hidden icon={ICONS.WALLET}/>
|
||||
<Icon aria-hidden icon={ICONS.WALLET} />
|
||||
{__('Wallet')}
|
||||
</MenuItem>
|
||||
<MenuItem className="menu__link" onSelect={() => history.push(`/$/${PAGES.REWARDS}`)}>
|
||||
<Icon aria-hidden icon={ICONS.FEATURED}/>
|
||||
<Icon aria-hidden icon={ICONS.FEATURED} />
|
||||
{__('Rewards')}
|
||||
</MenuItem>
|
||||
</MenuList>
|
||||
</Menu>
|
||||
<Menu>
|
||||
<MenuButton className="header__navigation-item menu__title">
|
||||
<Icon size={18} icon={ICONS.ACCOUNT}/>
|
||||
<Icon size={18} icon={ICONS.ACCOUNT} />
|
||||
</MenuButton>
|
||||
<MenuList className="menu__list--header">
|
||||
<MenuItem className="menu__link" onSelect={() => history.push(`/$/${PAGES.ACCOUNT}`)}>
|
||||
<Icon aria-hidden icon={ICONS.OVERVIEW}/>
|
||||
<Icon aria-hidden icon={ICONS.OVERVIEW} />
|
||||
{__('Overview')}
|
||||
</MenuItem>
|
||||
|
||||
<MenuItem className="menu__link" onSelect={() => history.push(`/$/${PAGES.PUBLISH}`)}>
|
||||
<Icon aria-hidden icon={ICONS.PUBLISH}/>
|
||||
<Icon aria-hidden icon={ICONS.PUBLISH} />
|
||||
{__('Publish')}
|
||||
</MenuItem>
|
||||
{authenticated ? (
|
||||
<MenuItem className="menu__link" onSelect={signOut}>
|
||||
<Icon aria-hidden icon={ICONS.SIGN_OUT}/>
|
||||
<Icon aria-hidden icon={ICONS.SIGN_OUT} />
|
||||
{__('Sign Out')}
|
||||
</MenuItem>
|
||||
) : (
|
||||
<MenuItem className="menu__link" onSelect={() => history.push(`/$/${PAGES.AUTH}`)}>
|
||||
<Icon aria-hidden icon={ICONS.SIGN_IN}/>
|
||||
<Icon aria-hidden icon={ICONS.SIGN_IN} />
|
||||
{__('Sign In')}
|
||||
</MenuItem>
|
||||
)}
|
||||
|
|
@ -166,37 +164,39 @@ const Header = (props: Props) => {
|
|||
|
||||
<Menu>
|
||||
<MenuButton className="header__navigation-item menu__title">
|
||||
<Icon size={18} icon={ICONS.SETTINGS}/>
|
||||
<Icon size={18} icon={ICONS.SETTINGS} />
|
||||
</MenuButton>
|
||||
<MenuList className="menu__list--header">
|
||||
<MenuItem className="menu__link" onSelect={() => history.push(`/$/${PAGES.SETTINGS}`)}>
|
||||
<Icon aria-hidden tootlip icon={ICONS.SETTINGS}/>
|
||||
<Icon aria-hidden tootlip icon={ICONS.SETTINGS} />
|
||||
{__('Settings')}
|
||||
</MenuItem>
|
||||
<MenuItem className="menu__link" onSelect={() => history.push(`/$/${PAGES.HELP}`)}>
|
||||
<Icon aria-hidden icon={ICONS.HELP}/>
|
||||
<Icon aria-hidden icon={ICONS.HELP} />
|
||||
{__('Help')}
|
||||
</MenuItem>
|
||||
<MenuItem className="menu__link" onSelect={handleThemeToggle}>
|
||||
<Icon icon={currentTheme === 'light' ? ICONS.DARK : ICONS.LIGHT}/>
|
||||
<Icon icon={currentTheme === 'light' ? ICONS.DARK : ICONS.LIGHT} />
|
||||
{currentTheme === 'light' ? __('Dark') : __('Light')}
|
||||
</MenuItem>
|
||||
</MenuList>
|
||||
</Menu>
|
||||
</Fragment>
|
||||
) : (
|
||||
<Button navigate={`/$/${PAGES.AUTH}`} button="primary" label={__('Sign In')}/>
|
||||
<Button navigate={`/$/${PAGES.AUTH}`} button="primary" label={__('Sign In')} />
|
||||
)}
|
||||
</div>
|
||||
) : (!isVerifyPage &&
|
||||
<div className="header__menu">
|
||||
{/* Add an empty span here so we can use the same style as above */}
|
||||
{/* This pushes the close button to the right side */}
|
||||
<span/>
|
||||
<Tooltip label={__('Go Back')}>
|
||||
<Button icon={ICONS.REMOVE} {...closeButtonNavigationProps} />
|
||||
</Tooltip>
|
||||
</div>
|
||||
) : (
|
||||
!isVerifyPage && (
|
||||
<div className="header__menu">
|
||||
{/* Add an empty span here so we can use the same style as above */}
|
||||
{/* This pushes the close button to the right side */}
|
||||
<span />
|
||||
<Tooltip label={__('Go Back')}>
|
||||
<Button icon={ICONS.REMOVE} {...closeButtonNavigationProps} />
|
||||
</Tooltip>
|
||||
</div>
|
||||
)
|
||||
)}
|
||||
</div>
|
||||
</header>
|
||||
|
|
|
|||
|
|
@ -2,18 +2,21 @@
|
|||
import React, { useState } from 'react';
|
||||
import { withRouter } from 'react-router';
|
||||
import Page from 'component/page';
|
||||
import ReCAPTCHA from "react-google-recaptcha";
|
||||
import ReCAPTCHA from 'react-google-recaptcha';
|
||||
import Button from 'component/button';
|
||||
import { Lbryio } from 'lbryinc';
|
||||
import * as PAGES from 'constants/pages';
|
||||
|
||||
type Props = {
|
||||
history: { push: string => void },
|
||||
doToast: ({}) => void
|
||||
history: { push: string => void, location: { search: string } },
|
||||
doToast: ({}) => void,
|
||||
};
|
||||
|
||||
function SignInVerifyPage(props: Props) {
|
||||
const { history: { push }, doToast } = props;
|
||||
const {
|
||||
history: { push, location },
|
||||
doToast,
|
||||
} = props;
|
||||
const urlParams = new URLSearchParams(location.search);
|
||||
const authToken = urlParams.get('auth_token');
|
||||
const userSubmittedEmail = urlParams.get('email');
|
||||
|
|
@ -42,31 +45,36 @@ function SignInVerifyPage(props: Props) {
|
|||
verification_token: verificationToken,
|
||||
recaptcha: value,
|
||||
})
|
||||
.then(() => {
|
||||
setIsAuthenticationSuccess(true);
|
||||
})
|
||||
.catch(() => {
|
||||
onAuthError(__('Invalid captcha response or other authentication error.'));
|
||||
});
|
||||
.then(() => {
|
||||
setIsAuthenticationSuccess(true);
|
||||
})
|
||||
.catch(() => {
|
||||
onAuthError(__('Invalid captcha response or other authentication error.'));
|
||||
});
|
||||
}
|
||||
|
||||
return (
|
||||
<Page authPage className="main--auth-page">
|
||||
<section className="main--contained">
|
||||
<h1 className="section__title--large">{isAuthenticationSuccess ? __('Sign In Success!') : __('Sign In to lbry.tv') }</h1>
|
||||
<p className="section__subtitle">{ isAuthenticationSuccess ? __('You can now close this tab.') : __('Click below to sign in to lbry.tv') }</p>
|
||||
{ !isAuthenticationSuccess &&
|
||||
<div className="section__actions">
|
||||
<ReCAPTCHA
|
||||
sitekey="6LePsJgUAAAAAFTuWOKRLnyoNKhm0HA4C3elrFMG"
|
||||
onChange={onCaptchaChange}
|
||||
onExpired={onAuthError}
|
||||
onErrored={onAuthError}
|
||||
/>
|
||||
</div>}
|
||||
<h1 className="section__title--large">
|
||||
{isAuthenticationSuccess ? __('Sign In Success!') : __('Sign In to lbry.tv')}
|
||||
</h1>
|
||||
<p className="section__subtitle">
|
||||
{isAuthenticationSuccess ? __('You can now close this tab.') : __('Click below to sign in to lbry.tv')}
|
||||
</p>
|
||||
{!isAuthenticationSuccess && (
|
||||
<div className="section__actions">
|
||||
<ReCAPTCHA
|
||||
sitekey="6LePsJgUAAAAAFTuWOKRLnyoNKhm0HA4C3elrFMG"
|
||||
onChange={onCaptchaChange}
|
||||
onExpired={onAuthError}
|
||||
onErrored={onAuthError}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
</section>
|
||||
</Page>
|
||||
);
|
||||
};
|
||||
}
|
||||
|
||||
export default withRouter(SignInVerifyPage);
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue