Skip to content
Philip Halsall edited this page Sep 26, 2023 · 20 revisions

MinaPortal Wiki

Welcome to the MinaPortal Wiki page! This page is designed to provide all essential information, answers to common questions, and resources for users and developers interested in utilizing the mina-portal snap to interact with MetaMask.

Table of Contents

About MinaPortal

The MinaPortal is an open beta wallet, built to use the mina-portal snap. The mina-portal snap allows MetaMask users to interact with the Mina protocol using MetaMask Snaps - a powerful system that expands the capabilities of your MetaMask wallet via isolated, secure and customizable programs known as "snaps". MinaPortal focuses on facilitating interactions with the Mina protocol, providing users with the abilility to send and receive mina payments, manage Mina accounts, and send transactions to zkApps. The MinaPortal also demonstrates how to use the mina-portal snap in your zkApp.

Architecture

To use the MinaPortal ensure you have MetaMask installed in your browser and then visit https://minaportal.sotatek.works/. The MetaMask mina-portal snap is provided by npm. The following diagram describes the workflow for using the MinaPortal and the mina-portal snap.

mina-portal-snap-diagram

Click on the picture below to watch a video showing how to connect the MinaPortal to MetaMask.

Once the MinaPortal is connected to MetaMask, a new Mina account is automatically generated. The following account details can be obtained using the MetaMask Snap API:

  • Account Address
  • Account Balance

The MinaPortal uses the mina-portal snap to interact with MetaMask to sign transactions and submit them to the network.

Getting Started

The MinaPortal shows how you interact with Mina protocol with these steps:

Install MetaMask

Before you begin, make sure you have MetaMask installed in your browser. If you haven't already installed it, you can download it from metamask.io.

Request the Snap

Your zkApp (Zero-Knowledge Application) will need to request the mina-portal snap from npm with the Ethereum Provider. This process fetches the mina-portal snap:

To request the mina-portal snap, use the following Ethereum JSON-RPC request:

ethereum.request({
  method: 'wallet_requestSnaps',
  params: { "npm:mina-portal": { version: `^${snapVersion}` } }
});

### Invoke Snap's methods
Once installed we can invoke the snap methods by calling:
```javascript
ethereum.request({ 
   method: 'wallet_invokeSnap', 
   params: { 
      snapId: “npm:mina-portal”, 
      request: { method: `${methodName}`, }, 
   }, 
});

You will able to find all mina-portal snap methods here

Sending zkApp Transactions

The MinaPortal supports zkApp transactions by using the "mina_sendTransaction" method. Sending transactions requires the compiled zkApp and source code.

Note: As of 2023 August, this method is only available on the Berkeley network. This will be supported on the Mainnet after the Berkeley Hard Fork.

  • To make zkApp transactions with your smart contract, you will need to have the built file of the smart contract. You can learn more about how to write a zkApp smart contract here.
  • Install o1js on your zkApp and use it to make the transaction.
  • Then submit your transaction by calling the “mina_sendTransaction" method.

Send Transaction Example

import { Mina, PublicKey, fetchAccount, Field } from 'o1js';

(async() => {
    const { <Your smart contract class name> } = await import(<Path to your built smart contract>);
    const zkAppAddress = <Your deployed smart contract address>
    const graphqlEndpoint = <replace the graphql endpoint here>
    const zkApp = new <Your smart contract class name>(PublicKey.fromBase58(zkAppAddress));
    Mina.setActiveInstance(Mina.Network(<graphqlEndpoint>));
    <Your smart contract class name>.compile();
    const account = await fetchAccount({publicKey: zkAppAddress, ...zkApp}, <graphqlEndpoint>);
    const tx = await Mina.transaction({
        sender: PublicKey.fromBase58(<sender address>),
        fee: <replace the fee here>
    }, () => {
        zkApp.update(<your parameter>);
    });
    const provedTx = await tx.prove();
    await ethereum.request({
      method: 'wallet_invokeSnap',
      params: {
        snapId: <the mina-portal snap id>,
        request: {
          method: 'mina_sendTransaction',
          params: {
            transaction: tx.toJSON(),
            feePayer: {
              fee: <replace the fee here>,
              memo: <user' memo>,
            }
          }
        },
      },
    });
})();

Click on the picture below to watch a demo video on how a user can send a transaction.

Running MinaPortal on a local machine

To run the MinaPortal on your local machine:

git clone https://github.com/sotatek-dev/mina-snap.git  
yarn install 
yarn start

This will set up the mina-portal snap, allowing you to explore its capabilities.

Important Notes

  • Transpilation of TypeScript to JavaScript is handled using Babel. When using the CLI to build, ensure that the transpilationMode is set to localOnly (default) or localAndDeps.
  • For the global wallet type to function as expected, ensure you add the following configuration to your tsconfig.json file:
"files": ["./node_modules/@metamask/snap-types/global.d.ts"]

Contact

For questions, assistance, or discussions related to Mina Portal, you can reach out through the following channels: