Commit e74a8bf2 authored by Max Alekseenko's avatar Max Alekseenko

Merge branch 'rewards' of https://github.com/blockscout/frontend into rewards

parents 16e77ad6 3e6be97b
...@@ -140,6 +140,7 @@ const AuthModal = ({ initialScreen, onClose, mixpanelConfig }: Props) => { ...@@ -140,6 +140,7 @@ const AuthModal = ({ initialScreen, onClose, mixpanelConfig }: Props) => {
<AuthModalScreenSuccessEmail <AuthModalScreenSuccessEmail
email={ currentStep.email } email={ currentStep.email }
onConnectWallet={ onNextStep } onConnectWallet={ onNextStep }
onClose={ onModalClose }
isAuth={ currentStep.isAuth } isAuth={ currentStep.isAuth }
profile={ currentStep.profile } profile={ currentStep.profile }
/> />
...@@ -149,6 +150,7 @@ const AuthModal = ({ initialScreen, onClose, mixpanelConfig }: Props) => { ...@@ -149,6 +150,7 @@ const AuthModal = ({ initialScreen, onClose, mixpanelConfig }: Props) => {
<AuthModalScreenSuccessWallet <AuthModalScreenSuccessWallet
address={ currentStep.address } address={ currentStep.address }
onAddEmail={ onNextStep } onAddEmail={ onNextStep }
onClose={ onModalClose }
isAuth={ currentStep.isAuth } isAuth={ currentStep.isAuth }
profile={ currentStep.profile } profile={ currentStep.profile }
/> />
......
...@@ -9,22 +9,32 @@ import config from 'configs/app'; ...@@ -9,22 +9,32 @@ import config from 'configs/app';
interface Props { interface Props {
email: string; email: string;
onConnectWallet: (screen: Screen) => void; onConnectWallet: (screen: Screen) => void;
onClose: () => void;
isAuth?: boolean; isAuth?: boolean;
profile: UserInfo | undefined; profile: UserInfo | undefined;
} }
const AuthModalScreenSuccessEmail = ({ email, onConnectWallet, isAuth, profile }: Props) => { const AuthModalScreenSuccessEmail = ({ email, onConnectWallet, onClose, isAuth, profile }: Props) => {
const handleConnectWalletClick = React.useCallback(() => { const handleConnectWalletClick = React.useCallback(() => {
onConnectWallet({ type: 'connect_wallet', isAuth: true }); onConnectWallet({ type: 'connect_wallet', isAuth: true });
}, [ onConnectWallet ]); }, [ onConnectWallet ]);
if (isAuth) { if (isAuth) {
return ( return (
<Box>
<Text> <Text>
Your account was linked to{ ' ' } Your account was linked to{ ' ' }
<chakra.span fontWeight="700">{ email }</chakra.span>{ ' ' } <chakra.span fontWeight="700">{ email }</chakra.span>{ ' ' }
email. Use for the next login. email. Use for the next login.
</Text> </Text>
<Button
mt={ 6 }
variant="outline"
onClick={ onClose }
>
Got it!
</Button>
</Box>
); );
} }
...@@ -34,11 +44,19 @@ const AuthModalScreenSuccessEmail = ({ email, onConnectWallet, isAuth, profile } ...@@ -34,11 +44,19 @@ const AuthModalScreenSuccessEmail = ({ email, onConnectWallet, isAuth, profile }
<chakra.span fontWeight="700">{ email }</chakra.span>{ ' ' } <chakra.span fontWeight="700">{ email }</chakra.span>{ ' ' }
email has been successfully used to log in to your Blockscout account. email has been successfully used to log in to your Blockscout account.
</Text> </Text>
{ !profile?.address_hash && config.features.blockchainInteraction.isEnabled && ( { !profile?.address_hash && config.features.blockchainInteraction.isEnabled ? (
<> <>
<Text mt={ 6 }>Add your web3 wallet to safely interact with smart contracts and dapps inside Blockscout.</Text> <Text mt={ 6 }>Add your web3 wallet to safely interact with smart contracts and dapps inside Blockscout.</Text>
<Button mt={ 6 } onClick={ handleConnectWalletClick }>Connect wallet</Button> <Button mt={ 6 } onClick={ handleConnectWalletClick }>Connect wallet</Button>
</> </>
) : (
<Button
variant="outline"
mt={ 6 }
onClick={ onClose }
>
Got it!
</Button>
) } ) }
</Box> </Box>
); );
......
...@@ -9,22 +9,32 @@ import shortenString from 'lib/shortenString'; ...@@ -9,22 +9,32 @@ import shortenString from 'lib/shortenString';
interface Props { interface Props {
address: string; address: string;
onAddEmail: (screen: Screen) => void; onAddEmail: (screen: Screen) => void;
onClose: () => void;
isAuth?: boolean; isAuth?: boolean;
profile: UserInfo | undefined; profile: UserInfo | undefined;
} }
const AuthModalScreenSuccessWallet = ({ address, onAddEmail, isAuth, profile }: Props) => { const AuthModalScreenSuccessWallet = ({ address, onAddEmail, onClose, isAuth, profile }: Props) => {
const handleAddEmailClick = React.useCallback(() => { const handleAddEmailClick = React.useCallback(() => {
onAddEmail({ type: 'email', isAuth: true }); onAddEmail({ type: 'email', isAuth: true });
}, [ onAddEmail ]); }, [ onAddEmail ]);
if (isAuth) { if (isAuth) {
return ( return (
<Box>
<Text> <Text>
Your account was linked to{ ' ' } Your account was linked to{ ' ' }
<chakra.span fontWeight="700">{ shortenString(address) }</chakra.span>{ ' ' } <chakra.span fontWeight="700">{ shortenString(address) }</chakra.span>{ ' ' }
wallet. Use for the next login. wallet. Use for the next login.
</Text> </Text>
<Button
mt={ 6 }
variant="outline"
onClick={ onClose }
>
Got it!
</Button>
</Box>
); );
} }
...@@ -35,11 +45,19 @@ const AuthModalScreenSuccessWallet = ({ address, onAddEmail, isAuth, profile }: ...@@ -35,11 +45,19 @@ const AuthModalScreenSuccessWallet = ({ address, onAddEmail, isAuth, profile }:
<chakra.span fontWeight="700">{ shortenString(address) }</chakra.span>{ ' ' } <chakra.span fontWeight="700">{ shortenString(address) }</chakra.span>{ ' ' }
has been successfully used to log in to your Blockscout account. has been successfully used to log in to your Blockscout account.
</Text> </Text>
{ !profile?.email && ( { !profile?.email ? (
<> <>
<Text mt={ 6 }>Add your email to receive notifications about addresses in your watch list.</Text> <Text mt={ 6 }>Add your email to receive notifications about addresses in your watch list.</Text>
<Button mt={ 6 } onClick={ handleAddEmailClick }>Add email</Button> <Button mt={ 6 } onClick={ handleAddEmailClick }>Add email</Button>
</> </>
) : (
<Button
mt={ 6 }
variant="outline"
onClick={ onClose }
>
Got it!
</Button>
) } ) }
</Box> </Box>
); );
......
...@@ -99,7 +99,7 @@ const UserProfileContent = ({ data, onClose, onLogin, onAddEmail, onAddAddress } ...@@ -99,7 +99,7 @@ const UserProfileContent = ({ data, onClose, onLogin, onAddEmail, onAddAddress }
/> />
{ data?.address_hash ? { data?.address_hash ?
<Box>{ shortenString(data?.address_hash) }</Box> : <Box>{ shortenString(data?.address_hash) }</Box> :
<Link onClick={ onAddAddress } color="icon_info" _hover={{ color: 'link_hovered', textDecoration: 'none' }}>Add address</Link> <Link onClick={ onAddAddress } _hover={{ color: 'link_hovered', textDecoration: 'none' }}>Add address</Link>
} }
</Flex> </Flex>
) } ) }
...@@ -107,7 +107,7 @@ const UserProfileContent = ({ data, onClose, onLogin, onAddEmail, onAddAddress } ...@@ -107,7 +107,7 @@ const UserProfileContent = ({ data, onClose, onLogin, onAddEmail, onAddAddress }
<Box mr="auto">Email</Box> <Box mr="auto">Email</Box>
{ data?.email ? { data?.email ?
<TruncatedValue value={ data.email }/> : <TruncatedValue value={ data.email }/> :
<Link onClick={ onAddEmail } color="icon_info" _hover={{ color: 'link_hovered', textDecoration: 'none' }}>Add email</Link> <Link onClick={ onAddEmail } _hover={{ color: 'link_hovered', textDecoration: 'none' }}>Add email</Link>
} }
</Flex> </Flex>
</Box> </Box>
......
...@@ -41,7 +41,7 @@ const UserProfileContentWallet = ({ onClose, className }: Props) => { ...@@ -41,7 +41,7 @@ const UserProfileContentWallet = ({ onClose, className }: Props) => {
isTooltipDisabled isTooltipDisabled
truncation="dynamic" truncation="dynamic"
fontSize="sm" fontSize="sm"
fontWeight={ 700 } fontWeight={ 500 }
/> />
<IconButton <IconButton
aria-label="Open wallet" aria-label="Open wallet"
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment