Muffin SDK

This package can be used to interact with Muffin Network in your websites and APIs.

Getting started

yarn add muffin-sdk

# OR

npm i muffin-sdk

Sign In with Muffin

The Sign In component generates a QR Code that users can scan to sign in on your app with their Muffin ID.

Props

Prop	Type	Default value	Description
callbackUrl	string	null	URL to which informations about the Muffin ID will be sent to
otherData	{[x: string]: any}	null	Data you want to add to the payload that will be sent to the callback URL
firstname	boolean	false	Ask for the user's firstname
middlename	boolean	false	Ask for the user's middlename
lastname	boolean	false	Ask for the user's lastname
birthdate	boolean	false	Ask for the user's birthdate
email	boolean	false	Ask for the user's email address
username	boolean	false	Ask for the user's username
picture	boolean	false	Ask for the user's picture URL

Payload

This is the structure of the payload that will be sent to the callback URL:

interface Payload {
  muffinAddress: `mx${string}`
  keys: {
    [field: string]: string
  }
  signature: { signature: string; recovery: 0 | 1 }
  [otherDataField: string]: any
}

Example

App.tsx

import React from 'react'
import { SignIn } from' muffin-sdk'

export default class App extends React.Component<any, any> {
  constructor(props: any) {
    super(props)
  }

  render() {
    return (
      <>
        <SignIn
          username
          email
          picture
          callbackUrl={'http://example.com/api/signin'}
          otherData={{
            token: '1234',
          }}
        />
    )
  }
}

Fetch a Muffin ID

Once you've received the payload you must pass the keys to the fetchMuffinID function to decrypt the information you need.

Params

fetchMuffinID(
  muffinAddress: string,
  keys: {[field: string]: string},
  nodeUrl: string
): Promise<{[field: string]: string}>

Example in API

api/signin.ts

import { fetchMuffinID } from "muffin-sdk"

export default async function handler(req: any, res: any) {
  const { muffinAddress, keys, token } = req.body

  const muffinID = await fetchMuffinID(
    muffinAddress,
    keys,
    "https://mynode.example.com"
  )

  console.log(muffinID)
}

Authenticate a Muffin ID

Some people could steal some Muffin ID field encryption keys to pretend to be somebody else.

To avoid this, you can use the authenticateMuffinID function to know if a Sign In request has been made by the true owner of the Muffin ID.

Params

authenticateMuffinID(
  muffinAddress: `mx${string}`,
  signature: { signature: `0x${string}`; recovery: 0 | 1 },
  nodeUrl: string
): Promise<boolean>

Example in API

api/signin.ts

import { authenticateMuffinID } from "muffin-sdk"

export default async function handler(req: any, res: any) {
  const { muffinAddress, signature, token } = req.body

  const isAuthenticated = await authenticateMuffinID(
    muffinAddress,
    signature,
    "https://mynode.example.com"
  )

  if (!isAuthenticated) {
    console.log("You're not the owner of this Muffin ID!")
    return
  }

  console.log("You are the owner of this Muffin ID")
}

Pay with Muffin

You can use muffin-sdk to generate QR Codes that users can scan with Floater Wallet to make a payment.

Props

Prop	Type	mandatory	Description
to	`0x${string}`	true	Receiver's address
amount	number	true	Amount of the transaction in Floats
data	string	false	Transaction data

Example

App.tsx

import React from "react"
import { Pay } from " muffin-sdk"

export default class App extends React.Component<any, any> {
  constructor(props: any) {
    super(props)
  }

  render() {
    return <Pay to={"0x1"} amount={100} data={`mint({})`} />
  }
}

Interact with contracts

muffin-sdk allows you to read data from contracts and generate transaction data to generate payment QR Codes with the Pay component.

Read data from contract

import { Contract } from "muffin-sdk"

const contract = new Contract({ nodeUrl: "https://mynode.net/" })
  .to("0x0")
  .useMethod("balanceOf")
  .setParams("0x71C7656EC7ab88b098defB751B7401B5f6d8976F")

const { res, timestamp, address } = await contract.get()

console.log(res)

Generate data for payment

import React from "react"
import { Contract, Pay } from " muffin-sdk"

export default class App extends React.Component<any, any> {
  constructor(props: any) {
    super(props)

    const contract = new Contract({ nodeUrl: "https://mynode.net/" })
      .to("0x0")
      .useMethod("mint")
      .setParams("0x71C7656EC7ab88b098defB751B7401B5f6d8976F", 1)

    this.data = contract.generateTxData()
  }

  render() {
    return <Pay to={"0x0"} amount={1000} data={this.data} />
  }
}

License

MIT