fix: improve switch instance

myriadsocial · Feb 4, 2023 · c5b00d2 · c5b00d2
1 parent d5988ea
commit c5b00d2
Show file tree

Hide file tree

Showing 13 changed files with 243 additions and 288 deletions.
diff --git a/pages/api/auth/[...nextauth].ts b/pages/api/auth/[...nextauth].ts
@@ -40,6 +40,7 @@ const createOptions = (req: NextApiRequest) => ({
         instanceURL: {label: 'Instance url', type: 'text'},
       },
       async authorize(credentials) {
+        // Initialize instance api url
         initialize({apiURL: credentials.instanceURL});
 
         if (credentials.anonymous === 'true') {
@@ -69,6 +70,9 @@ const createOptions = (req: NextApiRequest) => ({
             const payload = encryptMessage(data.accessToken, credentials.address);
             return credentialToSession(credentials as unknown as SignInCredential, payload);
           } catch (error) {
+            // If failed, use instance url from session
+            initialize({cookie: req.headers.cookie});
+
             console.log('[api][Auth]', error);
             return null;
           }
@@ -92,6 +96,7 @@ const createOptions = (req: NextApiRequest) => ({
       async authorize(credentials) {
         if (!credentials?.token) throw Error('no token!');
 
+        // Initialize instance api url
         initialize({apiURL: credentials.instanceURL});
 
         const data = await AuthLinkAPI.loginWithLink(credentials.token);
@@ -109,6 +114,9 @@ const createOptions = (req: NextApiRequest) => ({
             payload,
           );
         } catch (error) {
+          // If failed, use instance url from session
+          initialize({cookie: req.headers.cookie});
+
           console.log('[api][Auth]', error);
           return null;
         }
@@ -191,6 +199,7 @@ const createOptions = (req: NextApiRequest) => ({
           nonce: user.nonce,
           token: user.token,
           email: user.email,
+          instanceURL: user.instanceURL,
         };
       }
 

diff --git a/src/components/Login/render/Email/LoginByEmail.tsx b/src/components/Login/render/Email/LoginByEmail.tsx
@@ -5,7 +5,7 @@ import {Button, TextField, Typography} from '@material-ui/core';
 
 import {useStyles} from './LoginByEmail.style';
 
-import SelectServer from 'components/SelectServer';
+import SelectServer from 'src/components/SelectServer';
 import {useAuthLinkHook} from 'src/hooks/auth-link.hook';
 import {ServerListProps} from 'src/interfaces/server-list';
 import i18n from 'src/locale';
@@ -87,7 +87,7 @@ const LoginByEmail = ({onNext, setSelectedInstance}: LoginByEmailProps) => {
         error={error.isError}
         helperText={error.isError ? error.message : ''}
       />
-      <SelectServer onServerSelect={server => toggleSelected(server)} />
+      <SelectServer onServerSelect={server => toggleSelected(server)} page="login" />
       <div className={styles.actionWrapper}>
         <Button variant="outlined" color="primary" onClick={handleBack}>
           {i18n.t('Login.Email.LoginByEmail.Back')}

diff --git a/src/components/Login/render/Options/Options.tsx b/src/components/Login/render/Options/Options.tsx
@@ -8,7 +8,7 @@ import {InjectedAccountWithMeta} from '@polkadot/extension-inject/types';
 
 import {useStyles} from './Options.style';
 
-import SelectServer from 'components/SelectServer';
+import SelectServer from 'src/components/SelectServer';
 import {
   CoinbaseWalletisabledIcon,
   EthereumNetworkIcon,
@@ -425,7 +425,7 @@ export const Options: React.FC<OptionProps> = props => {
             </Grid>
           </div>
 
-          <SelectServer onServerSelect={server => toggleSelected(server)} />
+          <SelectServer onServerSelect={server => toggleSelected(server)} page="login" />
           <div className={styles.actionWrapper}>
             <Button variant="outlined" color="secondary" onClick={() => navigate('/')}>
               Back
@@ -595,7 +595,7 @@ export const Options: React.FC<OptionProps> = props => {
               </Grid>
             </div>
 
-            <SelectServer onServerSelect={server => toggleSelected(server)} />
+            <SelectServer onServerSelect={server => toggleSelected(server)} page="login" />
 
             <div style={{display: 'flex', flexDirection: 'column', gap: 16}}>
               <Button variant="outlined" color="secondary" onClick={() => navigate('/')}>

diff --git a/src/components/Menu/Menu.styles.ts b/src/components/Menu/Menu.styles.ts
@@ -53,7 +53,7 @@ export const useStyles = makeStyles((theme: Theme) =>
       padding: '0 30px',
     },
     backdrop: {
-      zIndex: theme.zIndex.drawer + 1,
+      zIndex: theme.zIndex.drawer + 1 + 100,
       color: '#fff',
     },
   }),