@safe-global/safe-apps-provider

What is @safe-global/safe-apps-provider?

@safe-global/safe-apps-provider is an npm package that provides a Web3 provider for Safe Apps. It allows developers to interact with the Gnosis Safe smart contract and build decentralized applications (dApps) that can be used within the Gnosis Safe ecosystem.

What are @safe-global/safe-apps-provider's main functionalities?

Initialize Safe Apps Provider

This feature allows you to initialize the Safe Apps Provider with the Gnosis Safe information and the Ethereum provider. It sets up the Web3 instance to interact with the Gnosis Safe smart contract.

const { SafeAppProvider } = require('@safe-global/safe-apps-provider');
const Web3 = require('web3');

const safe = { /* Safe information */ };
const provider = new SafeAppProvider(safe, window.ethereum);
const web3 = new Web3(provider);

Send Transactions

This feature allows you to send transactions from the Gnosis Safe. You can specify the sender address, recipient address, value, and data for the transaction.

const tx = {
  from: '0xYourSafeAddress',
  to: '0xRecipientAddress',
  value: web3.utils.toWei('1', 'ether'),
  data: '0x',
};

web3.eth.sendTransaction(tx).then(receipt => {
  console.log('Transaction receipt:', receipt);
});

Call Smart Contract Methods

This feature allows you to call smart contract methods using the Safe Apps Provider. You can interact with any smart contract by specifying the ABI and contract address.

const contract = new web3.eth.Contract(abi, contractAddress);

contract.methods.myMethod().call({ from: '0xYourSafeAddress' }).then(result => {
  console.log('Method call result:', result);
});

Other packages similar to @safe-global/safe-apps-provider

web3

web3 is a popular JavaScript library for interacting with the Ethereum blockchain. It provides a comprehensive set of features for sending transactions, interacting with smart contracts, and querying blockchain data. Compared to @safe-global/safe-apps-provider, web3 is more general-purpose and not specifically tailored for Gnosis Safe.

ethers

ethers is a lightweight library for interacting with the Ethereum blockchain and its ecosystem. It offers similar functionalities to web3 but with a more modern and modular design. Like web3, ethers is not specifically designed for Gnosis Safe but can be used in conjunction with it.

truffle

truffle is a development framework for Ethereum that provides tools for smart contract development, testing, and deployment. While it includes features for interacting with the Ethereum blockchain, it is more focused on the development lifecycle of smart contracts rather than providing a Web3 provider for dApps.

README

Safe Apps Provider

This is a provider that follows common standards (e.g. EIP-1193) and can be used with various Web3 libraries (e.g. web3.js or Ethers)

How to use

• Add npm package

yarn add @safe-global/safe-apps-provider

npm i @safe-global/safe-apps-provider

SafeAppProvider

The provider can be used with the safe-apps-react-sdk and common web3 libraries.

With Ethers.js

• Ethers.js

import React, { useMemo } from 'react';
import { ethers } from 'ethers';
import { useSafeAppsSDK } from '@safe-global/safe-apps-react-sdk';
import { SafeAppProvider } from '@safe-global/safe-apps-provider';

const App = () => {
  const { sdk, safe } = useSafeAppsSDK();
  const web3Provider = useMemo(() => new ethers.providers.Web3Provider(new SafeAppProvider(safe, sdk)), [sdk, safe]);

  // use provider with contracts

  return;
};

export default App;

With web3.js

• web3.js

import React, { useMemo } from 'react';
import Web3 from 'web3';
import { useSafeAppsSDK } from '@safe-global/safe-apps-react-sdk';
import { SafeAppProvider } from '@safe-global/safe-apps-provider';

const App = () => {
  const { sdk, safe } = useSafeAppsSDK();
  const web3Provider = useMemo(() => new Web3(new SafeAppProvider(safe, sdk)), [sdk, safe]);

  // use provider with contracts

  return;
};

export default App;

A note on gas limit

The ethereum transaction gas limit passed to the safe-apps-provider will be treated as safeTxGas, which is an equivalent of the ethereum transaction gas limit in the Safe context. To learn more about the safe transaction gas, read here:
https://github.com/safe-global/safe-contracts/blob/c36bcab46578a442862d043e12a83fec41143dec/docs/safe_tx_gas.md

If you don't want to pass a calculation and leave it to the Safe, pass 0 as the gas limit.

More scenarios

For the SDK overview documentation, please refer to the safe-apps-sdk documentation