title: How can I start a new transaction on an existing Gnosis Safe from my react app?
body: <p>Currently I have a React app which connects to a Metamask wallet. On clicking a 'Transfer' button, it transfers some ethers from the connected Metamask wallet to the one input by the user. All of this works fine and is pretty straightforward. It looks something like this (I am using ethers.js):</p>
  <pre><code>// fetch signer from connected metamask account
  const signer = new ethers.providers.Web3Provider(ethereum).getSigner()
  const contract = new ethers.Contract(contractAddress, ERC20ABI, signer)
  
  // create a new transaction - that's it! so simple!
  const txResponse = await contract.transfer(_recipientWalletAddress, utils.parseUnits(_userinput).toString()) 
  </code></pre>
  <p>Now, I want the same functionality but instead of transferring from the connected Metamask wallet, I want to connect to an existing Gnosis Safe and transfer funds from the safe to a recipient. I already have a test Gnosis Safe set up on <code>gnosis-safe.io</code> over Goerli Testnet with 3 owners. I have the Safe address. I have the addresses of the owners.</p>
  <p>In my app, I have connected my app to the test Gnosis Safe using WalletConnect.
  Now, I want that I click a button, enter a recipient address and submit the form. This should create a new transaction on the test Gnosis Safe. And then on the Gnosis Safe, the owners can approve/reject the created transaction. I am struggling with this part.</p>
  <p>This is what I've tried</p>
  <pre><code>import Safe from '@gnosis.pm/safe-core-sdk'
  import { ethers, utils } from 'ethers'
  import EthersAdapter from '@gnosis.pm/safe-ethers-lib'
  
  
  // have all addresses here
  const gnosisSafeAddress = '0xsafexaddress'
  const gnosisSafeOwners = ['0xsafexownerx1', '0xsafexownerx2', '0xsafexownerx3']
  
  
  // create a ethers provider over goerli network
  const provider = new ethers.providers.JsonRpcProvider(`https://goerli.infura.io/v3/${infuraAPIKey}`);
  
  // create signer using the provider and private key of the one of the gnosis safe owner
  const signer = new ethers.Wallet(PRIVATE_KEY_OF_SAFE_OWNER_1, provider);
  
  // create connection to safe using the gnosis safe address
  const ethAdapter = new EthersAdapter({ ethers, signer });
  const safeSdk = await Safe.create({ ethAdapter, safeAddress: gnosisSafeAddress });
  
  // create a transaction
  const transaction = {
     to: _recipientWalletAddress,
     value: utils.parseUnits(_userinput).toString(),
     data: '0x',
  };
  
  const safeTransaction = await safeSdk.createTransaction(transaction);
  </code></pre>
  <p>This does not work at all. I logged every step and every variable in between is empty objects. Kindly help me understand what I am doing wrong. I am extremely confused reading the Gnosis SDK repos.</p>
  <p>I don't want to deploy a test Gnosis Safe programmatically. I don't want to create a Safe app. I just want to create a transaction, programmatically, on Gnosis Safe (a wallet) to transfer funds, like I do for metamask.</p>