Skip to content

Commit

Permalink
upgraded to alpha 8
Browse files Browse the repository at this point in the history
  • Loading branch information
ihsraham committed Sep 18, 2024
1 parent 4c0cf9d commit 70a8b62
Show file tree
Hide file tree
Showing 8 changed files with 1,561 additions and 2,399 deletions.

Large diffs are not rendered by default.

Original file line number Diff line number Diff line change
Expand Up @@ -14,13 +14,13 @@
"@walletconnect/modal": "^2.6.1",
"@walletconnect/sign-client": "^2.11.1",
"@web3auth/auth": "^9.3.2",
"@web3auth/auth-adapter": "^9.0.0-alpha.1",
"@web3auth/base": "^9.0.0-alpha.1",
"@web3auth/ethereum-provider": "^9.0.0-alpha.1",
"@web3auth/no-modal": "^9.0.0-alpha.1",
"@web3auth/auth-adapter": "^9.0.0-alpha.8",
"@web3auth/base": "^9.0.0-alpha.8",
"@web3auth/ethereum-provider": "^9.0.0-alpha.8",
"@web3auth/no-modal": "^9.0.0-alpha.8",
"@web3auth/openlogin-adapter": "^9.0.0-alpha.0",
"@web3auth/wallet-connect-v2-adapter": "^9.0.0-alpha.1",
"@web3auth/wallet-services-plugin": "^9.0.0-alpha.1",
"@web3auth/wallet-connect-v2-adapter": "^9.0.0-alpha.8",
"@web3auth/wallet-services-plugin": "^9.0.0-alpha.8",
"ethers": "^6.7.1",
"react": "^18.2.0",
"react-dom": "^18.2.0",
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import { WalletConnectV2Adapter, getWalletConnectV2Settings } from "@web3auth/wa
import { WalletConnectModal } from "@walletconnect/modal";
import { WalletServicesPlugin } from "@web3auth/wallet-services-plugin";
import "./App.css";
import RPC from "./web3RPC"; // for using web3.js
import RPC from "./viemRPC"; // for using viem

const clientId = "BPi5PB_UiIZ-cPz1GtV5i1I2iOSOHuimiXBI0e-Oe_u6X3oVAbCiAZOTEBtTXw4tsluTITPqA8zMsfxIKMjiqNQ"; // get from https://dashboard.web3auth.io

Expand Down Expand Up @@ -41,7 +41,7 @@ function App() {
appUrl: "https://web3auth.io",
logoLight: "https://web3auth.io/images/web3authlog.png",
logoDark: "https://web3auth.io/images/web3authlogodark.png",
defaultLanguage: "pt", // en, de, ja, ko, zh, es, fr, pt, nl
defaultLanguage: "en", // en, de, ja, ko, zh, es, fr, pt, nl
mode: "dark", // whether to enable dark mode. defaultValue: false
theme: {
primary: "#768729",
Expand Down Expand Up @@ -97,7 +97,7 @@ function App() {

const walletServicesPluginInstance = new WalletServicesPlugin({
wsEmbedOpts: {},
walletInitOptions: { whiteLabel: { showWidgetButton: true } },
walletInitOptions: { whiteLabel: { showWidgetButton: true }, confirmationStrategy: "modal" },
});

setWalletServicesPlugin(walletServicesPluginInstance);
Expand All @@ -107,6 +107,7 @@ function App() {
setWeb3Auth(web3auth);
await web3auth.init();
setProvider(web3auth.provider);

if (web3auth.connected) {
setLoggedIn(true);
}
Expand All @@ -118,12 +119,25 @@ function App() {
init();
}, []);

const enableMFA = async () => {
if (!web3auth) {
uiConsole("web3auth not initialized yet");
return;
}
try {
await web3auth.enableMFA();
uiConsole("MFA enabled");
} catch (error) {
uiConsole(error);
}
};

const login = async () => {
if (!web3auth) {
uiConsole("web3auth not initialized yet");
return;
}
const web3authProvider = await web3auth.connectTo(WALLET_ADAPTERS.AUTH, {
const web3authProvider = await web3auth.connectTo<AuthLoginParams>(WALLET_ADAPTERS.AUTH, {
loginProvider: "google",
});
setProvider(web3authProvider);
Expand Down Expand Up @@ -155,9 +169,14 @@ function App() {
uiConsole("web3auth not initialized yet");
return;
}
await web3auth.logout();
setProvider(null);
setLoggedIn(false);
try {
await web3auth.logout();
setProvider(null);
setLoggedIn(false);
uiConsole("Logged out successfully.");
} catch (error) {
uiConsole(error);
}
};

const getChainId = async () => {
Expand Down Expand Up @@ -238,6 +257,88 @@ function App() {
uiConsole(signedMessage);
};

const signTypedDataMessage = async () => {
if (!provider) {
uiConsole("provider not initialized yet");
return;
}
const rpc = new RPC(provider as IProvider);
const signedMessage = await rpc.signTypedDataMessage();
uiConsole(signedMessage);
};

const signTransaction = async () => {
if (!provider) {
uiConsole("provider not initialized yet");
return;
}
const rpc = new RPC(provider as IProvider);
const signature = await rpc.signTransaction();
uiConsole(signature);
};

const deployContract = async () => {
if (!provider) {
uiConsole("provider not initialized yet");
return;
}
const rpc = new RPC(provider as IProvider);
const message = await rpc.deployContract();
uiConsole(message);
};

const readContract = async () => {
if (!provider) {
uiConsole("provider not initialized yet");
return;
}
const rpc = new RPC(provider as IProvider);
const message = await rpc.readContract();
uiConsole(message);
};

const writeContract = async () => {
if (!provider) {
uiConsole("provider not initialized yet");
return;
}
const rpc = new RPC(provider as IProvider);
const receipt = await rpc.writeContract();
uiConsole(receipt);
if (receipt) {
setTimeout(async () => {
await readContract();
}, 10000);
}
};

const showCheckout = async () => {
if (!walletServicesPlugin) {
uiConsole("walletServicesPlugin not initialized yet");
return;
}
const checkout = await walletServicesPlugin.showCheckout();
uiConsole(checkout);
};

const showWalletUI = async () => {
if (!walletServicesPlugin) {
uiConsole("walletServicesPlugin not initialized yet");
return;
}
const walletUI = await walletServicesPlugin.showWalletUi();
uiConsole(walletUI);
};

const showWalletConnectScanner = async () => {
if (!walletServicesPlugin) {
uiConsole("walletServicesPlugin not initialized yet");
return;
}
const walletConnectScanner = await walletServicesPlugin.showWalletConnectScanner();
uiConsole(walletConnectScanner);
};

const getPrivateKey = async () => {
if (!provider) {
uiConsole("provider not initialized yet");
Expand Down Expand Up @@ -268,6 +369,26 @@ function App() {
Get ID Token
</button>
</div>
<div>
<button onClick={enableMFA} className="card">
Enable MFA
</button>
</div>
<div>
<button onClick={showWalletUI} className="card">
Show Wallet UI
</button>
</div>
<div>
<button onClick={showCheckout} className="card">
Show Checkout
</button>
</div>
<div>
<button onClick={showWalletConnectScanner} className="card">
Show WalletConnect Scanner
</button>
</div>
<div>
<button onClick={getChainId} className="card">
Get Chain ID
Expand Down Expand Up @@ -298,6 +419,31 @@ function App() {
Sign Message
</button>
</div>
<div>
<button onClick={signTypedDataMessage} className="card">
Sign Typed Data Message
</button>
</div>
<div>
<button onClick={signTransaction} className="card">
Sign Transaction
</button>
</div>
<div>
<button onClick={deployContract} className="card">
Deploy Contract
</button>
</div>
<div>
<button onClick={readContract} className="card">
Read Contract
</button>
</div>
<div>
<button onClick={writeContract} className="card">
Write Contract
</button>
</div>
<div>
<button onClick={sendTransaction} className="card">
Send Transaction
Expand Down Expand Up @@ -337,6 +483,10 @@ function App() {
& React Ethereum Example
</h1>

<div className="container" style={{ textAlign: "center" }}>
<h2 style={{ color: web3auth?.status === "connected" ? "green" : "red" }}>Web3Auth Status: {web3auth?.status ?? "Not initialized"}</h2>
</div>

<div className="grid">{loggedIn ? loggedInView : unloggedInView}</div>

<footer className="footer">
Expand Down
Loading

0 comments on commit 70a8b62

Please sign in to comment.