diff --git a/scaffolds/nextjs-dedicated-wallet/scaffold.ts b/scaffolds/nextjs-dedicated-wallet/scaffold.ts
index 128fe7a..44b17a4 100644
--- a/scaffolds/nextjs-dedicated-wallet/scaffold.ts
+++ b/scaffolds/nextjs-dedicated-wallet/scaffold.ts
@@ -75,9 +75,6 @@ export default class DedicatedScaffold extends BaseScaffold {
if (authType === 'EmailOTP') {
(this.source as string[]).push('./src/components/magic/wallet-methods/UpdateEmail.tsx');
}
- if (authType === 'SMSOTP') {
- (this.source as string[]).push('./src/components/magic/wallet-methods/UpdatePhone.tsx');
- }
});
}
}
diff --git a/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/Discord.tsx b/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/Discord.tsx
index 763aed7..65a8718 100644
--- a/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/Discord.tsx
+++ b/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/Discord.tsx
@@ -1,9 +1,8 @@
import { LoginProps } from '@/utils/types';
import { useMagic } from '../MagicProvider';
import { useEffect, useState } from 'react';
-import { saveToken } from '@/utils/common';
+import { saveUserInfo } from '@/utils/common';
import Spinner from '@/components/ui/Spinner';
-import classNames from 'classnames';
import Image from 'next/image';
import discord from 'public/social/Discord.svg';
import Card from '@/components/ui/Card';
@@ -22,8 +21,10 @@ const Discord = ({ token, setToken }: LoginProps) => {
try {
if (magic) {
const result = await magic?.oauth.getRedirectResult();
- //do stuff with user profile data
- saveToken(result.magic.idToken, setToken, 'SOCIAL');
+ const metadata = await magic?.user.getMetadata();
+ if (!metadata?.publicAddress) return;
+ setToken(result.magic.idToken);
+ saveUserInfo(result.magic.idToken, 'SOCIAL', metadata?.publicAddress);
setLoadingFlag('false');
}
} catch (e) {
@@ -63,7 +64,7 @@ const Discord = ({ token, setToken }: LoginProps) => {
disabled={false}
>
-
Continue with Discord
+ Continue with Discord
)}
diff --git a/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/EmailOTP.tsx b/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/EmailOTP.tsx
index 2b0954e..152156e 100644
--- a/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/EmailOTP.tsx
+++ b/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/EmailOTP.tsx
@@ -3,7 +3,7 @@ import showToast from '@/utils/showToast';
import Spinner from '../../ui/Spinner';
import { RPCError, RPCErrorCode } from 'magic-sdk';
import { LoginProps } from '@/utils/types';
-import { saveToken } from '@/utils/common';
+import { saveUserInfo } from '@/utils/common';
import Card from '../../ui/Card';
import CardHeader from '../../ui/CardHeader';
import { useState } from 'react';
@@ -23,10 +23,16 @@ const EmailOTP = ({ token, setToken }: LoginProps) => {
setLoginInProgress(true);
setEmailError(false);
const token = await magic?.auth.loginWithEmailOTP({ email });
- if (token) {
- saveToken(token, setToken, 'EMAIL');
- setEmail('');
+
+ const metadata = await magic?.user.getMetadata();
+
+ if (!token || !metadata?.publicAddress) {
+ throw new Error('Magic login failed');
}
+
+ setToken(token);
+ saveUserInfo(token, 'EMAIL', metadata?.publicAddress);
+ setEmail('');
} catch (e) {
console.log('login error: ' + JSON.stringify(e));
if (e instanceof RPCError) {
diff --git a/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/Facebook.tsx b/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/Facebook.tsx
index 17bd3a1..6b33d7e 100644
--- a/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/Facebook.tsx
+++ b/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/Facebook.tsx
@@ -1,9 +1,8 @@
import { LoginProps } from '@/utils/types';
import { useMagic } from '../MagicProvider';
import { useEffect, useState } from 'react';
-import { saveToken } from '@/utils/common';
+import { saveUserInfo } from '@/utils/common';
import Spinner from '../../ui/Spinner';
-import classNames from 'classnames';
import Image from 'next/image';
import facebook from 'public/social/Facebook.svg';
import Card from '../../ui/Card';
@@ -22,8 +21,10 @@ const Facebook = ({ token, setToken }: LoginProps) => {
try {
if (magic) {
const result = await magic?.oauth.getRedirectResult();
- //do stuff with user profile data
- saveToken(result.magic.idToken, setToken, 'SOCIAL');
+ const metadata = await magic?.user.getMetadata();
+ if (!metadata?.publicAddress) return;
+ setToken(result.magic.idToken);
+ saveUserInfo(result.magic.idToken, 'SOCIAL', metadata?.publicAddress);
setLoadingFlag('false');
}
} catch (e) {
@@ -63,7 +64,7 @@ const Facebook = ({ token, setToken }: LoginProps) => {
disabled={false}
>
- Continue with Facebook
+ Continue with Facebook
)}
diff --git a/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/Github.tsx b/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/Github.tsx
index 8004de7..23ba301 100644
--- a/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/Github.tsx
+++ b/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/Github.tsx
@@ -1,9 +1,8 @@
import { LoginProps } from '@/utils/types';
import { useMagic } from '../MagicProvider';
import { useEffect, useState } from 'react';
-import { saveToken } from '@/utils/common';
+import { saveUserInfo } from '@/utils/common';
import Spinner from '../../ui/Spinner';
-import classNames from 'classnames';
import Image from 'next/image';
import github from 'public/social/Github.svg';
import Card from '../../ui/Card';
@@ -22,8 +21,10 @@ const Github = ({ token, setToken }: LoginProps) => {
try {
if (magic) {
const result = await magic?.oauth.getRedirectResult();
- //do stuff with user profile data
- saveToken(result.magic.idToken, setToken, 'SOCIAL');
+ const metadata = await magic?.user.getMetadata();
+ if (!metadata?.publicAddress) return;
+ setToken(result.magic.idToken);
+ saveUserInfo(result.magic.idToken, 'SOCIAL', metadata?.publicAddress);
setLoadingFlag('false');
}
} catch (e) {
@@ -63,7 +64,7 @@ const Github = ({ token, setToken }: LoginProps) => {
disabled={false}
>
- Continue with Github
+ Continue with Github
)}
diff --git a/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/Google.tsx b/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/Google.tsx
index 4dc8087..b2b0079 100644
--- a/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/Google.tsx
+++ b/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/Google.tsx
@@ -1,9 +1,8 @@
import { LoginProps } from '@/utils/types';
import { useMagic } from '../MagicProvider';
import { useEffect, useState } from 'react';
-import { saveToken } from '@/utils/common';
+import { saveUserInfo } from '@/utils/common';
import Spinner from '../../ui/Spinner';
-import classNames from 'classnames';
import Image from 'next/image';
import google from 'public/social/Google.svg';
import Card from '../../ui/Card';
@@ -22,8 +21,10 @@ const Google = ({ token, setToken }: LoginProps) => {
try {
if (magic) {
const result = await magic?.oauth.getRedirectResult();
- //do stuff with user profile data
- saveToken(result.magic.idToken, setToken, 'SOCIAL');
+ const metadata = await magic?.user.getMetadata();
+ if (!metadata?.publicAddress) return;
+ setToken(result.magic.idToken);
+ saveUserInfo(result.magic.idToken, 'SOCIAL', metadata?.publicAddress);
setLoadingFlag('false');
}
} catch (e) {
@@ -63,7 +64,7 @@ const Google = ({ token, setToken }: LoginProps) => {
disabled={false}
>
- Continue with Google
+ Continue with Google
)}
diff --git a/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/SMSOTP.tsx b/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/SMSOTP.tsx
index a0150b2..fa075de 100644
--- a/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/SMSOTP.tsx
+++ b/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/SMSOTP.tsx
@@ -4,7 +4,7 @@ import showToast from '@/utils/showToast';
import Spinner from '../../ui/Spinner';
import { RPCError, RPCErrorCode } from 'magic-sdk';
import { LoginProps } from '@/utils/types';
-import { saveToken } from '@/utils/common';
+import { saveUserInfo } from '@/utils/common';
import Card from '../../ui/Card';
import CardHeader from '../../ui/CardHeader';
import FormInput from '@/components/ui/FormInput';
@@ -25,10 +25,15 @@ const SMSOTP = ({ token, setToken }: LoginProps) => {
const token = await magic?.auth.loginWithSMS({
phoneNumber: phone,
});
- if (token) {
- saveToken(token, setToken, 'SMS');
- setPhone('');
+ const metadata = await magic?.user.getMetadata();
+
+ if (!token || !metadata?.publicAddress) {
+ throw new Error('Magic login failed');
}
+
+ setToken(token);
+ saveUserInfo(token, 'EMAIL', metadata?.publicAddress);
+ setPhone('');
} catch (e) {
console.log('login error: ' + JSON.stringify(e));
if (e instanceof RPCError) {
diff --git a/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/Twitch.tsx b/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/Twitch.tsx
index 8986ba7..0747e80 100644
--- a/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/Twitch.tsx
+++ b/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/Twitch.tsx
@@ -1,9 +1,8 @@
import { LoginProps } from '@/utils/types';
import { useMagic } from '../MagicProvider';
import { useEffect, useState } from 'react';
-import { saveToken } from '@/utils/common';
+import { saveUserInfo } from '@/utils/common';
import Spinner from '../../ui/Spinner';
-import classNames from 'classnames';
import Image from 'next/image';
import twitch from 'public/social/Twitch.svg';
import Card from '../../ui/Card';
@@ -22,8 +21,10 @@ const Twitch = ({ token, setToken }: LoginProps) => {
try {
if (magic) {
const result = await magic?.oauth.getRedirectResult();
- //do stuff with user profile data
- saveToken(result.magic.idToken, setToken, 'SOCIAL');
+ const metadata = await magic?.user.getMetadata();
+ if (!metadata?.publicAddress) return;
+ setToken(result.magic.idToken);
+ saveUserInfo(result.magic.idToken, 'SOCIAL', metadata?.publicAddress);
setLoadingFlag('false');
}
} catch (e) {
@@ -63,7 +64,7 @@ const Twitch = ({ token, setToken }: LoginProps) => {
disabled={false}
>
- Continue with Twitch
+ Continue with Twitch
)}
diff --git a/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/Twitter.tsx b/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/Twitter.tsx
index f90a7a2..39a1180 100644
--- a/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/Twitter.tsx
+++ b/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/auth/Twitter.tsx
@@ -1,9 +1,8 @@
import { LoginProps } from '@/utils/types';
import { useMagic } from '../MagicProvider';
import { useEffect, useState } from 'react';
-import { saveToken } from '@/utils/common';
+import { saveUserInfo } from '@/utils/common';
import Spinner from '../../ui/Spinner';
-import classNames from 'classnames';
import Image from 'next/image';
import twitter from 'public/social/Twitter.svg';
import Card from '../../ui/Card';
@@ -22,8 +21,10 @@ const Twitter = ({ token, setToken }: LoginProps) => {
try {
if (magic) {
const result = await magic?.oauth.getRedirectResult();
- //do stuff with user profile data
- saveToken(result.magic.idToken, setToken, 'SOCIAL');
+ const metadata = await magic?.user.getMetadata();
+ if (!metadata?.publicAddress) return;
+ setToken(result.magic.idToken);
+ saveUserInfo(result.magic.idToken, 'SOCIAL', metadata?.publicAddress);
setLoadingFlag('false');
}
} catch (e) {
@@ -63,7 +64,7 @@ const Twitter = ({ token, setToken }: LoginProps) => {
disabled={false}
>
- Continue with Twitter
+ Continue with Twitter
)}
diff --git a/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/cards/UserInfoCard.tsx b/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/cards/UserInfoCard.tsx
index b4ded64..1f6003f 100644
--- a/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/cards/UserInfoCard.tsx
+++ b/scaffolds/nextjs-dedicated-wallet/template/src/components/magic/cards/UserInfoCard.tsx
@@ -16,25 +16,7 @@ const UserInfo = ({ token, setToken }: LoginProps) => {
const [copied, setCopied] = useState('Copy');
const [isRefreshing, setIsRefreshing] = useState(false);
- const [publicAddress, setPublicAddress] = useState(localStorage.getItem('user'));
-
- useEffect(() => {
- const checkLoginandGetBalance = async () => {
- const isLoggedIn = await magic?.user.isLoggedIn();
- if (isLoggedIn) {
- try {
- const metadata = await magic?.user.getInfo();
- if (metadata) {
- localStorage.setItem('user', metadata?.publicAddress!);
- setPublicAddress(metadata?.publicAddress!);
- }
- } catch (e) {
- console.log('error in fetching address: ' + e);
- }
- }
- };
- setTimeout(() => checkLoginandGetBalance(), 5000);
- }, []);
+ const [publicAddress] = useState(localStorage.getItem('user'));
const getBalance = useCallback(async () => {
if (publicAddress && web3) {
diff --git a/scaffolds/nextjs-dedicated-wallet/template/src/utils/common.ts b/scaffolds/nextjs-dedicated-wallet/template/src/utils/common.ts
index 7b17952..cfda3a2 100644
--- a/scaffolds/nextjs-dedicated-wallet/template/src/utils/common.ts
+++ b/scaffolds/nextjs-dedicated-wallet/template/src/utils/common.ts
@@ -12,9 +12,9 @@ export const logout = async (setToken: Dispatch>, magic:
setToken('');
};
-export const saveToken = (token: string, setToken: Dispatch>, loginMethod: LoginMethod) => {
+export const saveUserInfo = (token: string, loginMethod: LoginMethod, userAddress: string) => {
localStorage.setItem('token', token);
- setToken(token);
localStorage.setItem('isAuthLoading', 'false');
localStorage.setItem('loginMethod', loginMethod);
+ localStorage.setItem('user', userAddress);
};