@pioneer-platform/pioneer-react 0.2.34 → 0.2.35

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pioneer-platform/pioneer-react",
-  "version": "0.2.34",
+  "version": "0.2.35",
   "author": "highlander",
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -37,6 +37,7 @@
     "@shapeshiftoss/hdwallet-core": "^1.50.0",
     "@shapeshiftoss/hdwallet-metamask": "^1.50.0",
     "@shapeshiftoss/hdwallet-native": "^1.50.3",
+    "@shapeshiftoss/metamask-snaps-adapter": "^1.0.1",
     "@types/uuid": "^9.0.1",
     "assert": "^2.0.0",
     "dotenv": "^16.3.1",

package/src/index.tsx

@@ -16,19 +16,19 @@ import MiddleEllipsis from "lib/components/MiddleEllipsis";
 
 import App from "./App";
 
-// To publish as lib uncomment
+// To publish run as dev uncomment
 
-// index.tsx
+const root = ReactDOM.createRoot(
+  document.getElementById("root") as HTMLElement
+);
+root.render(
+  <>
+    <ColorModeScript initialColorMode={theme.config?.initialColorMode} />
+    <App />
+  </>
+);
 
-// const root = ReactDOM.createRoot(
-//   document.getElementById("root") as HTMLElement
-// );
-// root.render(
-//   <>
-//     <ColorModeScript initialColorMode={theme.config?.initialColorMode} />
-//     <App />
-//   </>
-// );
+//end dev mode
 
 export {
   Pioneer,

package/src/lib/components/modals/Onboarding.tsx

@@ -0,0 +1,67 @@
+import {
+    Button,
+    Modal,
+    ModalOverlay,
+    ModalContent,
+    ModalHeader,
+    ModalCloseButton,
+    ModalBody,
+    ModalFooter,
+    Tabs,
+    TabList,
+    Tab,
+    TabPanels,
+    Card,
+    CardBody,
+    TabPanel,
+} from "@chakra-ui/react";
+import { useState, useEffect } from "react";
+
+import { usePioneer } from "lib/context/Pioneer";
+
+interface ModalProps {
+    isOpen: boolean;
+    onClose: () => void;
+}
+//@ts-ignore
+const OnboardingModal: React.FC<ModalProps> = ({ isOpen, onClose }) => {
+    const { state, dispatch } = usePioneer();
+    const { api, app, user, context } = state;
+    const [walletDescriptions, setWalletDescriptions] = useState([]);
+    const [balances, setBalances] = useState([]);
+
+    const setUser = async function () {
+        try {
+            if (user && user.wallets) {
+                const { wallets, walletDescriptions, balances, pubkeys } = user;
+                setWalletDescriptions(walletDescriptions);
+                setBalances(balances);
+            }
+        } catch (e) {
+            console.error("header e: ", e);
+        }
+    };
+
+    useEffect(() => {
+        setUser();
+    }, [user]); // once on startup
+
+    return (
+        <Modal isOpen={isOpen} onClose={onClose} size="xl">
+            <ModalOverlay />
+            <ModalContent>
+                <ModalHeader>Wallet Select</ModalHeader>
+                <ModalCloseButton />
+                <ModalBody></ModalBody>
+                <ModalFooter>
+                    <Button colorScheme="blue" mr={3} onClick={onClose}>
+                        Close
+                    </Button>
+                    <Button variant="ghost">Secondary Action</Button>
+                </ModalFooter>
+            </ModalContent>
+        </Modal>
+    );
+};
+
+export default OnboardingModal;

package/src/lib/context/Pioneer/index.tsx

@@ -39,6 +39,7 @@ import { KkRestAdapter } from "@keepkey/hdwallet-keepkey-rest";
 import { KeepKeySdk } from "@keepkey/keepkey-sdk";
 import { SDK } from "@pioneer-sdk/sdk";
 import * as core from "@shapeshiftoss/hdwallet-core";
+import { enableShapeShiftSnap, shapeShiftSnapInstalled } from '@shapeshiftoss/metamask-snaps-adapter'
 // import * as keplr from "@shapeshiftoss/hdwallet-keplr";
 import * as metaMask from "@shapeshiftoss/hdwallet-metamask";
 import type { NativeHDWallet } from "@shapeshiftoss/hdwallet-native";
@@ -59,6 +60,8 @@ import { checkKeepkeyAvailability, timeout } from "lib/components/utils";
 
 const eventEmitter = new EventEmitter();
 
+const SNAP_ID = "npm:@shapeshiftoss/metamask-snaps"
+
 export enum WalletActions {
   SET_STATUS = "SET_STATUS",
   SET_USERNAME = "SET_USERNAME",
@@ -179,45 +182,84 @@ export const PioneerProvider = ({
   // @ts-ignore
   const [state, dispatch] = useReducer(reducer, initialState);
 
-  //@TODO build Native Wallet from Metamask
-  // if (!hashStored) {
-  //   //generate from MM
-  //   const message = 'Pioneers:0xD9B4BEF9:gen1';
-  //   const { hardenedPath, relPath } = walletMetaMask.ethGetAccountPaths({
-  //     coin: 'Ethereum',
-  //     accountIdx: 0,
-  //   })[0];
-  //   const sig = await walletMetaMask.ethSignMessage({
-  //     addressNList: hardenedPath.concat(relPath),
-  //     message,
-  //   });
-  //   // @ts-ignore
-  //   //console.log('sig: ', sig.signature);
-  //   // @ts-ignore
-  //   localStorage.setItem('hash', sig.signature);
-  //   // @ts-ignore
-  //   hashStored = sig.signature;
-  // }
+  //TODO add wallet to state
+  const connectWallet = async function(wallet:string){
+    try{
+      console.log("connectWallet: ",wallet)
+
+      if(wallet === "metamask"){
+        // walletMetaMask = await metaMaskAdapter.pairDevice();
+        // if (walletMetaMask) {
+        //   // pair metamask
+        //   await walletMetaMask.initialize();
+        //   //console.log("walletMetaMask: ", walletMetaMask);
+        //
+        //   // get all accounts
+        //   //@ts-ignore
+        //   const accounts = await window.ethereum.request({
+        //     method: "eth_requestAccounts",
+        //   });
+        //   //console.log("accounts: ", accounts);
+        //   //@ts-ignore
+        //   walletMetaMask.accounts = accounts;
+        //
+        //   const successMetaMask = await appInit.pairWallet(walletMetaMask);
+        //   console.log("successMetaMask: ", successMetaMask);
+        //   if(successMetaMask){
+        //     // @ts-ignore
+        //     if (appInit.pubkeyContext?.master || appInit?.pubkey){
+        //       // @ts-ignore
+        //       dispatch({
+        //         type: WalletActions.SET_PUBKEY_CONTEXT,
+        //         // @ts-ignore
+        //         payload: appInit.pubkeyContext?.master || appInit?.pubkey,
+        //       });
+        //     }
+        //   }
+        //   // @ts-ignore
+        //   dispatch({
+        //     type: WalletActions.SET_STATUS,
+        //     payload: "MetaMask connected!",
+        //   });
+        // }
+      }else if (wallet === "keepkey"){
+
+      }
+
+
+
+    }catch(e){
+      console.error(e)
+    }
+  }
 
   const onStart = async function () {
     try {
-      // eslint-disable-next-line no-console
-      //console.log("onStart***** ");
       const serviceKey: string | null = localStorage.getItem("serviceKey"); // KeepKey api key
       let queryKey: string | null = localStorage.getItem("queryKey");
       let username: string | null = localStorage.getItem("username");
       //@ts-ignore
       dispatch({ type: WalletActions.SET_USERNAME, payload: username });
 
+      //if auto connecting
+      let metamaskPaired = localStorage.getItem("metamaskPaired");
+      console.log("metamaskPaired: ", metamaskPaired);
+
+      const isKeepkeyAvailable = await checkKeepkeyAvailability();
+      console.log("isKeepkeyAvailable: ", isKeepkeyAvailable);
+
+      //is metamask available?
       const isMetaMaskAvailable = (): boolean => {
         return (
-          (window as any).ethereum !== undefined &&
-          (window as any).ethereum.isMetaMask
+            (window as any).ethereum !== undefined &&
+            (window as any).ethereum.isMetaMask
         );
       };
       const keyring = new core.Keyring();
       const metaMaskAdapter = metaMask.MetaMaskAdapter.useKeyring(keyring);
 
+
+
       if (!queryKey) {
         queryKey = `key:${uuidv4()}`;
         localStorage.setItem("queryKey", queryKey);
@@ -264,7 +306,18 @@ export const PioneerProvider = ({
       // Example usage
       let walletMetaMask: metaMask.MetaMaskHDWallet | undefined;
       if (isMetaMaskAvailable()) {
-        // //console.log("isMetaMaskAvailable ")
+        //is snap enabled?
+        let isSnapInstalled = await shapeShiftSnapInstalled(SNAP_ID);
+        console.log(isSnapInstalled)
+
+        //if not installed install snap
+        if(!isSnapInstalled){
+            //install it
+            let result = await enableShapeShiftSnap(SNAP_ID);
+            console.log("result: ", result)
+        }
+
+        //console.log("isMetaMaskAvailable ")
         walletMetaMask = await metaMaskAdapter.pairDevice();
         if (walletMetaMask) {
           // pair metamask
@@ -290,7 +343,7 @@ export const PioneerProvider = ({
                 type: WalletActions.SET_PUBKEY_CONTEXT,
                 // @ts-ignore
                 payload: appInit.pubkeyContext?.master || appInit?.pubkey,
-              });  
+              });
             }
           }
           // @ts-ignore
@@ -300,12 +353,9 @@ export const PioneerProvider = ({
           });
         }
       } else {
-        //console.log("MetaMask is not available");
+        console.log("MetaMask is not available");
       }
 
-      const isKeepkeyAvailable = await checkKeepkeyAvailability();
-      //console.log("isKeepkeyAvailable: ", isKeepkeyAvailable);
-
       let walletKeepKey: core.HDWallet;
       if (isKeepkeyAvailable) {
         const config: any = {