diff --git a/package.json b/package.json
index 9fc053de..a57e75c7 100644
--- a/package.json
+++ b/package.json
@@ -28,7 +28,7 @@
"dependencies": {
"@auth0/auth0-react": "^1.12.0",
"@masa-finance/masa-contracts-identity": "0.3.0",
- "@masa-finance/masa-sdk": "^0.2.3",
+ "@masa-finance/masa-sdk": "^0.2.4",
"ethers": "^5.7.0",
"react": "^18.2.0",
"react-query": "^3.39.1",
diff --git a/src/common/components/masa-interface/index.tsx b/src/common/components/masa-interface/index.tsx
index c6edb744..cabb87f1 100644
--- a/src/common/components/masa-interface/index.tsx
+++ b/src/common/components/masa-interface/index.tsx
@@ -22,6 +22,7 @@ export const MasaInterface = () => {
loading,
identity,
loggedIn,
+ closeModal
} = useMasa();
const page = useMemo(() => {
@@ -52,6 +53,7 @@ export const MasaInterface = () => {
<>
void}
>
{pages[page]}
diff --git a/src/common/components/masa-interface/pages/connected/index.tsx b/src/common/components/masa-interface/pages/connected/index.tsx
index a76571fa..ca5bedb0 100644
--- a/src/common/components/masa-interface/pages/connected/index.tsx
+++ b/src/common/components/masa-interface/pages/connected/index.tsx
@@ -4,7 +4,7 @@ import { useMasa } from '../../../../helpers/provider/masa-provider';
import { MasaLoading } from '../../../masa-loading';
export const InterfaceConnected = () => {
- const { masa, handleLogout } = useMasa();
+ const { masa, handleLogout, closeModal } = useMasa();
const [loading, setLoading] = useState(false);
const [soulnames, setSoulnames] = useState(null);
@@ -24,10 +24,6 @@ export const InterfaceConnected = () => {
})();
}, [masa, setSoulnames, setLoading]);
- console.log({ soulnames });
-
-
-
const name = useMemo(() => {
if (soulnames?.length) {
return soulnames[0].tokenDetails.sbtName;
@@ -45,6 +41,9 @@ export const InterfaceConnected = () => {
web3 soulbound identity!
+
I don't want to use this wallet
diff --git a/src/common/components/masa-interface/pages/createIdentity/index.tsx b/src/common/components/masa-interface/pages/createIdentity/index.tsx
index a2d59bf7..58ee4c5d 100644
--- a/src/common/components/masa-interface/pages/createIdentity/index.tsx
+++ b/src/common/components/masa-interface/pages/createIdentity/index.tsx
@@ -5,29 +5,32 @@ import {
useMasa,
useMetamask,
} from '../../../../helpers/provider/masa-provider';
+import { MasaLoading } from '../../../masa-loading';
import './styles.css';
export const InterfaceCreateIdentity = () => {
- const { masa, setLoading } = useMasa();
+ const { masa, handlePurchaseSoulname } = useMasa();
+ const [loading, setLoading] = useState(false);
const [soulName, setSoulName] = useState('');
- const purchaseSoulname = useCallback(async () => {
- const a = await masa?.identity.create(soulName, 1, 'eth');
- console.log(a);
- return 0;
- }, [masa]);
-
const [price, setPrice] = useState(0);
+
+ const purchaseName = useCallback(async () => {
+ setLoading(true);
+ await handlePurchaseSoulname?.(soulName, 1, 'eth');
+ setLoading(false);
+ }, [handlePurchaseSoulname, soulName, setLoading]);
+
useEffect(() => {
(async () => {
- setLoading?.(true)
const p = await masa?.soulNames.getRegistrationPrice(soulName, 1, 'eth');
setPrice(p);
- setLoading?.(false)
})();
}, [masa, soulName]);
+ if (loading) return ;
+
return (
@@ -56,7 +59,7 @@ export const InterfaceCreateIdentity = () => {
/>
-
diff --git a/src/common/components/modal/index.tsx b/src/common/components/modal/index.tsx
index c60975c9..0b69d1bc 100644
--- a/src/common/components/modal/index.tsx
+++ b/src/common/components/modal/index.tsx
@@ -8,11 +8,12 @@ export interface ModalProps {
children: React.ReactNode;
open: boolean;
setOpen: (val: boolean) => void;
+ close: Function;
}
-export const ModalComponent = ({ children, open, setOpen }: ModalProps) => {
+export const ModalComponent = ({ children, open, close }: ModalProps) => {
return (
- setOpen(false)}>
+
diff --git a/src/common/helpers/provider/masa-context.tsx b/src/common/helpers/provider/masa-context.tsx
index 2f9116d0..3e9e38b7 100644
--- a/src/common/helpers/provider/masa-context.tsx
+++ b/src/common/helpers/provider/masa-context.tsx
@@ -6,7 +6,6 @@ import React, {
useMemo,
useState,
} from 'react';
-import { useDebounce, useDebounceIfValue } from '../hooks/useDebounce';
import { createNewMasa } from '../masa';
export const MASA_CONTEXT = createContext
({});
@@ -28,6 +27,13 @@ export interface MasaShape {
loggedIn?: boolean;
handleLogin?: () => void;
handleLogout?: () => void;
+ handlePurchaseSoulname?: (
+ soulname: string,
+ duration: number,
+ paymentMethod: string
+ ) => void;
+ connect?: (callback?: Function) => void;
+ closeModal: Function;
}
export const MasaContextProvider = ({ children }: MasaContextProviderProps) => {
@@ -43,6 +49,17 @@ export const MasaContextProvider = ({ children }: MasaContextProviderProps) => {
const [identity, setIdentity] = useState(null);
const [loggedIn, setLoggedIn] = useState(false);
+ const [modalCallback, setModalCallback] = useState(null);
+
+ const connect = useCallback(
+ (callback?: () => void) => {
+ setModalOpen(true);
+ if (typeof callback === 'function') {
+ setModalCallback(() => callback);
+ }
+ },
+ [setModalOpen, setModalCallback]
+ );
useEffect(() => {
(async () => {
@@ -102,6 +119,13 @@ export const MasaContextProvider = ({ children }: MasaContextProviderProps) => {
return !!walletAddress;
}, [walletAddress]);
+ const closeModal = useCallback(() => {
+ setModalOpen(false);
+ if (modalCallback && loggedIn && isConnected) {
+ modalCallback();
+ }
+ }, [modalCallback, setModalOpen, loggedIn, isConnected]);
+
useEffect(() => {
(async () => {
setLoading(true);
@@ -116,21 +140,38 @@ export const MasaContextProvider = ({ children }: MasaContextProviderProps) => {
})();
}, [masaInstance]);
- useEffect(() => {
- (async () => {
- setLoading(true);
+ const loadIdentity = useCallback(async () => {
+ setLoading(true);
- if (masaInstance && walletAddress) {
- //@ts-ignore
- const identityResult = await masaInstance.identity.load(walletAddress);
- setIdentity(identityResult);
- } else {
- setIdentity(null);
- }
- setLoading(false);
- })();
+ console.log('Loading identity...');
+ if (masaInstance && walletAddress) {
+ //@ts-ignore
+ const identityResult = await masaInstance.identity.load(walletAddress);
+ console.log('Setting identity', identityResult);
+ setIdentity(identityResult);
+ } else {
+ setIdentity(null);
+ }
+ setLoading(false);
}, [masaInstance, walletAddress, setIdentity]);
+ const handlePurchaseSoulname = useCallback(
+ async (soulname, duration, paymentMethod) => {
+ const tx = await masaInstance?.identity.create(
+ soulname,
+ duration,
+ paymentMethod
+ );
+
+ await loadIdentity();
+ },
+ [masaInstance, loadIdentity]
+ );
+
+ useEffect(() => {
+ loadIdentity();
+ }, [loadIdentity]);
+
useEffect(() => {
if (provider) {
setMasaInstance(createNewMasa(provider));
@@ -152,6 +193,9 @@ export const MasaContextProvider = ({ children }: MasaContextProviderProps) => {
loggedIn,
handleLogin,
handleLogout,
+ handlePurchaseSoulname,
+ connect,
+ closeModal,
};
return (
diff --git a/src/common/helpers/provider/masa-provider.tsx b/src/common/helpers/provider/masa-provider.tsx
index 0792ebe3..0d54fa5b 100644
--- a/src/common/helpers/provider/masa-provider.tsx
+++ b/src/common/helpers/provider/masa-provider.tsx
@@ -51,8 +51,9 @@ export const useMetamask = () => {
});
}, []);
+
+
const connect = () => {
- console.log('CONNECT');
//@ts-ignore
if (window.ethereum) {
provider.send('eth_requestAccounts', []).then(async () => {
diff --git a/stories/masa.stories.tsx b/stories/masa.stories.tsx
index 645da65a..d907926c 100644
--- a/stories/masa.stories.tsx
+++ b/stories/masa.stories.tsx
@@ -25,51 +25,19 @@ const meta: Meta = {
export default meta;
const Component = () => {
- const { masa, setModalOpen } = useMasa();
+ const { masa, connect } = useMasa();
- const handleLogin = useCallback(async () => {
- const result = await masa?.session.login();
- console.log({ result });
- }, [masa]);
+ const handleConect = useCallback(() => {
+ connect?.(function() {
+ alert("hello hello connected")
+ });
+ }, [connect]);
- const handleLogout = useCallback(async () => {
- const result = await masa?.session.logout();
- console.log({ result });
- }, [masa]);
-
- const test = useCallback(async () => {
- const address = await masa?.config.wallet.getAddress();
-
- const balance = await masa?.account.getBalances(address as string);
- console.log({ balance });
-
- // identity id
- const identityId = await masa?.identity.load(address);
- console.log(`Identity ID: '${identityId}'`);
-
- console.log('ACC', await masa?.soulNames.list(address));
- }, [masa]);
-
- const handleCreateIdentity = useCallback(async () => {
- console.log('IDENTITY', masa?.identity);
- const result = await masa?.soulNames.create(
- 'NewTestForSDK2.soul',
- 1,
- 'eth'
- );
- console.log({ result });
- }, [masa]);
return (
<>
SDK Tester!
- setModalOpen?.(true)}>Use Masa!
-
- Login
- Logout
-
- test
- createIdentity
+ Use Masa!
>
);
};
diff --git a/yarn.lock b/yarn.lock
index 4fc9daf9..539000aa 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1999,10 +1999,10 @@
dependencies:
ethers "^5.6.9"
-"@masa-finance/masa-sdk@^0.2.3":
- version "0.2.3"
- resolved "https://registry.yarnpkg.com/@masa-finance/masa-sdk/-/masa-sdk-0.2.3.tgz#44ee5273ab9f9a5551cea6f99c2f210966176963"
- integrity sha512-33bfVSFIK/tr04WyIGxTeazJvE8xZI1TsCg05qZBJyS5yjQ5DVu8nVMRlNX5/Ee7odJyBFP+rM/DZRVXneX15Q==
+"@masa-finance/masa-sdk@^0.2.4":
+ version "0.2.4"
+ resolved "https://registry.yarnpkg.com/@masa-finance/masa-sdk/-/masa-sdk-0.2.4.tgz#6d05d5dab812a66245852eb155a3cf8e608acbc7"
+ integrity sha512-OGBbKGa5bJIQHQ/0fXQlYuZtdPSXEhHhmRyxGWlFUkuy2kwnx4xGU+A/AHK3zjNoJHEldPUqzSMewgLUufXQdw==
dependencies:
"@masa-finance/masa-contracts-identity" "^0.4.1"
arweave "^1.11.6"