From 9e22b3044d39cacffbeb4943a4aef5e70737d726 Mon Sep 17 00:00:00 2001
From: Sever Abibula <5903809+SeverS@users.noreply.github.com>
Date: Wed, 15 Dec 2021 14:03:20 +0200
Subject: [PATCH] Fix image popovers (#1519)

* fix(): avatar and cover image popovers

* chore(): add redirect from topbar sign-in
---
 apps/auth-app/src/components/sign-in/index.tsx               | 5 +++--
 ui/design/src/components/ImagePopover/form-image-popover.tsx | 1 +
 ui/widgets/top-bar/src/components/topbar-component.tsx       | 2 +-
 3 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/apps/auth-app/src/components/sign-in/index.tsx b/apps/auth-app/src/components/sign-in/index.tsx
index b7c091d181..cd6360eebb 100644
--- a/apps/auth-app/src/components/sign-in/index.tsx
+++ b/apps/auth-app/src/components/sign-in/index.tsx
@@ -47,6 +47,8 @@ const SignIn: React.FC<RootComponentProps> = props => {
   const { signUpState, ethAddress, fireRemainingMessages, error, fullSignUp, resetState } =
     useSignUp(selectedProvider, true);
 
+  const signupStateReset = React.useRef(resetState);
+
   const isNotRegistered = React.useMemo(
     () => error && error.message.toLowerCase().trim() === 'profile not found',
     [error],
@@ -60,7 +62,6 @@ const SignIn: React.FC<RootComponentProps> = props => {
 
   React.useEffect(() => {
     if (signInComplete && profileDataReq.isSuccess && !!profileDataReq.data?.userName) {
-      resetState();
       return navigateTo.current((qsStringify, currentRedirect) => {
         if (!currentRedirect) {
           return '/';
@@ -149,7 +150,7 @@ const SignIn: React.FC<RootComponentProps> = props => {
           {networkNotSupported && (
             <RequiredNetworkStep
               setRequiredNetworkLabel={t('To use Ethereum World during the alpha period, ')}
-              setRequiredNetworkBoldLabel={`${t('you’ll need to set the')} ${
+              setRequiredNetworkBoldLabel={`${t(`you'll need to set the`)} ${
                 selectedProvider === EthProviders.WalletConnect
                   ? 'WalletConnect'
                   : injectedProvider.name
diff --git a/ui/design/src/components/ImagePopover/form-image-popover.tsx b/ui/design/src/components/ImagePopover/form-image-popover.tsx
index 8afae59b50..00e581f0c8 100644
--- a/ui/design/src/components/ImagePopover/form-image-popover.tsx
+++ b/ui/design/src/components/ImagePopover/form-image-popover.tsx
@@ -102,6 +102,7 @@ const FormImagePopover: React.FC<IFormImagePopover> = props => {
       align={{ top: 'bottom', left: 'left' }}
       onClickOutside={closePopover}
       onEsc={closePopover}
+      style={{ zIndex: 999 }}
     >
       <Box direction="column" pad="xsmall">
         <StyledBox
diff --git a/ui/widgets/top-bar/src/components/topbar-component.tsx b/ui/widgets/top-bar/src/components/topbar-component.tsx
index 1441ce1175..55028d2f82 100644
--- a/ui/widgets/top-bar/src/components/topbar-component.tsx
+++ b/ui/widgets/top-bar/src/components/topbar-component.tsx
@@ -16,7 +16,6 @@ import {
 } from '@akashaproject/ui-awf-hooks';
 import { useTranslation } from 'react-i18next';
 import { RootComponentProps } from '@akashaproject/ui-awf-typings';
-import { StorageKeys } from '@akashaproject/ui-awf-typings/lib/profile';
 import { extensionPointsMap } from '../extension-points';
 
 const { lightTheme, Topbar, ThemeSelector, ExtensionPoint } = DS;
@@ -106,6 +105,7 @@ const TopbarComponent = (props: RootComponentProps) => {
       pathName: appRoutes => {
         return appRoutes[appRoutes.SIGN_IN];
       },
+      queryStrings: qsStringify => qsStringify({ redirectTo: location.pathname }),
     });
   };