Merge pull request #166 from nspcc-dev/feature/143-support_o3_wallet

Add support for O3 wallet

README.md

@@ -86,6 +86,7 @@ $ make docker/start
 
 - [Neon wallet for Windows, Mac OS, Linux, Android and iOS](https://neon.coz.io/)
 - [NeoLine wallet for chrome extension](https://neoline.io/)
+- [O3 wallet](https://o3.network/#/wallet)
 - [OneGate wallet (Mobile)](https://onegate.space/)
 - [Aero web wallet](https://melanke.github.io/aero-beta/) (testnet only, see #133)
 

package.json

@@ -7,6 +7,7 @@
     "@cityofzion/wallet-connect-sdk-react": "^3.2.0",
     "@neongd/neo-dapi": "^1.2.2",
     "bulma": "^0.9.4",
+    "neo3-dapi": "^1.0.1",
     "react": "^17.0.2",
     "react-bulma-components": "^4.1.0",
     "react-copy-to-clipboard": "^5.1.0",

src/App.js

@@ -4,6 +4,7 @@ import {
 	Route,
 	Link,
 	useLocation,
+	useNavigate,
 } from "react-router-dom";
 import {
 	Navbar,
@@ -22,11 +23,13 @@ import api from './api';
 import { useWalletConnect } from "@cityofzion/wallet-connect-sdk-react";
 import { CopyToClipboardBlock } from './CopyToClipboardBlock';
 import { BaseDapi } from '@neongd/neo-dapi';
+import neo3Dapi from "neo3-dapi";
 import 'bulma/css/bulma.min.css';
 import './App.css';
 
 export const App = () => {
 	const location = useLocation();
+	const navigate = useNavigate();
 	const wcSdk = useWalletConnect();
 	const dapi = window.OneGate ? new BaseDapi(window.OneGate) : null;
 	let [neolineN3, setNeolineN3] = useState(null);
@@ -155,7 +158,7 @@ export const App = () => {
 
 	useEffect(() => {
 		window.addEventListener("NEOLine.N3.EVENT.READY", loadNeolineN3);
-		return () => window.removeListener("NEOLine.N3.EVENT.READY", loadNeolineN3);
+		return () => window.removeEventListener("NEOLine.N3.EVENT.READY", loadNeolineN3);
 	}, []); // eslint-disable-line react-hooks/exhaustive-deps
 
 	useEffect(() => {
@@ -184,7 +187,7 @@ export const App = () => {
 				if (location.pathname.indexOf('/profile') === -1) {
 					document.location.href = "/profile";
 				}
-			} else if (walletData) {
+			} else if (walletData || (!walletData && location.pathname !== '/')) {
 				onDisconnectWallet();
 				if (location.pathname !== '/') {
 					document.location.href = "/";
@@ -290,6 +293,8 @@ export const App = () => {
 			onModal('failed', error.data.message);
 		} else if (error.message) {
 			onModal('failed', error.message);
+		} else if (error.description && error.description.msg) {
+			onModal('failed', error.description.msg);
 		} else if (error.description) {
 			onModal('failed', error.description);
 		} else {
@@ -300,7 +305,9 @@ export const App = () => {
 	const onSignMessage = async (msg = '', type, operation, params) => {
 		let response = '';
 
-		if (neolineN3) {
+		if (walletData.name === 'o3-desktop') {
+			response = await neo3Dapi.signMessage({ message: msg }).catch((err) => handleError(err));
+		} else if (neolineN3) {
 			response = await neolineN3.signMessage({ message: msg }).catch((err) => handleError(err));
 		} else if (dapi) {
 			response = await dapi.signMessage({ message: msg }).catch((err) => handleError(err));
@@ -519,7 +526,32 @@ export const App = () => {
 	};
 
 	const onConnectWallet = async (neolineN3Temp = neolineN3) => {
-		if (neolineN3Temp) {
+		let account;
+		try {
+			account = await neo3Dapi.getPublicKey();
+		} catch(err) {}
+		if (account) {
+			const provider = await neo3Dapi.getProvider();
+			const networks = await neo3Dapi.getNetworks();
+
+			setWalletData({
+				name: provider.name,
+				type: 'neo3',
+				net: networks.defaultNetwork.toLowerCase(),
+				account: account,
+				tokens: {
+					container: {},
+					object: null,
+				}
+			});
+
+			onPopup('success', 'Wallet connected');
+			onModal();
+
+			if (location.pathname.indexOf('/profile') === -1) {
+				navigate('/profile');
+			}
+		} else if (neolineN3Temp) {
 			neolineN3Temp.getPublicKey().then((account) => {
 				neolineN3Temp.getNetworks().then((networks) => {
 					setWalletData({
@@ -575,7 +607,9 @@ export const App = () => {
 	}
 
 	const onDisconnectWallet = async () => {
-		if (!dapi) {
+		if (walletData.name === 'o3-desktop') {
+			await neo3Dapi.disconnect();
+		} else if (!dapi) {
 			await wcSdk.disconnect();
 		}
 		document.location.href = "/";

src/Home.js

@@ -41,7 +41,7 @@ const Home = ({
 								Connect wallet
 							</Button>
 							<Heading align="center" size={6} weight="normal">
-								Built with <a href="https://walletconnect.com/" target="_blank" rel="noopener noreferrer">WalletConnect</a>, tested with <a href="https://neonwallet.com/" target="_blank" rel="noopener noreferrer">NEON wallet</a>, <a href="https://neoline.io/" target="_blank" rel="noopener noreferrer">NeoLine extension</a>, <a href="https://onegate.space/" target="_blank" rel="noopener noreferrer">OneGate wallet (Mobile)</a>.
+								Built with <a href="https://walletconnect.com/" target="_blank" rel="noopener noreferrer">WalletConnect</a>, tested with <a href="https://neonwallet.com/" target="_blank" rel="noopener noreferrer">NEON wallet</a>, <a href="https://neoline.io/" target="_blank" rel="noopener noreferrer">NeoLine extension</a>, <a href="https://o3.network/#/wallet" target="_blank" rel="noopener noreferrer">O3 wallet</a>, <a href="https://onegate.space/" target="_blank" rel="noopener noreferrer">OneGate wallet (Mobile)</a>.
 							</Heading>
 						</>
 					)}

src/Profile.js

@@ -1,5 +1,6 @@
 import React, { useEffect, useState } from 'react';
 import Neon from "@cityofzion/neon-js";
+import neo3Dapi from "neo3-dapi";
 import {
 	Container,
 	Section,
@@ -112,7 +113,9 @@ const Profile = ({
 			account: Neon.create.account(walletData.account.address).scriptHash,
 		}];
 
-		if (neolineN3) {
+		if (walletData.name === 'o3-desktop') {
+			response = await neo3Dapi.invokeRead({ ...invocations[0], signers }).catch((err) => handleError(err));
+		} else if (neolineN3) {
 			response = await neolineN3.invokeRead({ ...invocations[0], signers }).catch((err) => handleError(err));
 		} else if (dapi) {
 			response = await dapi.invokeRead({ ...invocations[0] }).catch((err) => handleError(err));
@@ -190,7 +193,9 @@ const Profile = ({
 			}];
 
 			let response = '';
-			if (neolineN3) {
+			if (walletData.name === 'o3-desktop') {
+				response = await neo3Dapi.invoke({ ...invocations[0], signers }).catch((err) => handleError(err));
+			} else if (neolineN3) {
 				response = await neolineN3.invoke({ ...invocations[0], signers }).catch((err) => handleError(err));
 			} else if (dapi) {
 				response = await dapi.invoke({ ...invocations[0], signers }).catch((err) => handleError(err));
@@ -233,7 +238,9 @@ const Profile = ({
 			}];
 
 			let response = '';
-			if (neolineN3) {
+			if (walletData.name === 'o3-desktop') {
+				response = await neo3Dapi.invoke({ ...invocations[0], signers }).catch((err) => handleError(err));
+			} else if (neolineN3) {
 				response = await neolineN3.invoke({ ...invocations[0], signers }).catch((err) => handleError(err));
 			} else if (dapi) {
 				response = await dapi.invoke({ ...invocations[0], signers }).catch((err) => handleError(err));