[Profile] Upload metada doc to IPFS

[matextrem]

Summary

This PR closes #942

A function was added in order to receive the metadata doc and upload this to IPFS (and pinning it using Pinata)

An example of a test metadata doc pinned with Pinata: https://gateway.pinata.cloud/ipfs/QmQVCKwriSzFpz5Ybjp3iumJ9HpMq7bS9aReYvxDBactew

To Test

It can be tested by calling uploadMetadataDocToIpfs and passing a metadata doc as a parameter (We could use generateReferralMetadataDoc with a test address).

• For testing purposes, I use my own Pinata account credentials. We'll need to create a corporate account for production.
• We need to add REACT_APP_PINATA_API_KEY and REACT_APP_PINATA_SECRET_API_KEY enviroment variables to the .env file.

Node version was updated in order to use ipfs-core and @sdk/pinata dependencies

[github-actions]

• 🔭 GP Swap: Gnosis Protocol v2 Swap UI

[alfetopito]

Minor comments

[alfetopito]

Also, I'll get the Pinata api key stuff, will let you know

[alfetopito]

Looks good to me.
But I'm still waiting on our Pinata keys to test it end to end.
Will wait until I have that before approving

[josojo]

looks good to me.

I also tested parsing the uploaded file in the backend, though the json format of your upload was not correct. We call the "innerst" referrer, address now.

[alfetopito]

looks good to me.

I also tested parsing the uploaded file in the backend, though the json format of your upload was not correct. We call the "innerst" referrer, address now.

Indeed, I mentioned that change on #1405 (review)

Now that you mention it might be work addressing that as its own PR.

Created new issue just for that #1412

[matextrem]

@alfetopito that change you mentioned was addressed in #1190

[alfetopito]

Hey @matextrem I'm trying to test but I'm not sure how.
How have you tested this?

[matextrem]

Hey @matextrem I'm trying to test but I'm not sure how.
How have you tested this?

@alfetopito , these are the steps I did to test it:

1. Go to src/custom/pages/About/index.tsx and import generateReferralMetadataDoc along with uploadMetadataDocToIpfs from src/custom/utils/metadata.tsx (import {generateReferralMetadataDoc, uploadMetadataDocToIpfs } from 'utils/metadata')

2. Add a useEffect calling to these functions like this:

React.useEffect(() => {
    const doc = generateReferralMetadataDoc('any ethereum address')
    uploadMetadataDocToIpfs(doc)
  },[])

Add this inside About function component, before the return statement

3. Start the project and go to /about. This will call useEffect with the functions listed above, creating a default metadata doc and uploading it to IPFS. Go to your Pinata dashboard to check the document was pinned.

[alfetopito]

Managed to test it locally with the provided instructions.

CID: QmYmxiQ4BxLudtQTBg7PhVQWeuqHQdATstg168ZcH9MmJh
Hash: 0x9b10bf7289e87734dd1385e836ad64c50f6c0e77ab53edf42add7b66a97f6f92
Contents: {"appCode":"CowSwap","metadata":{"referrer":{"address":"BLA BLA BLA","version":"0.1.0"}},"version":"0.1.0"}

@anxolin you had comments regarding the code in another PR.
Would you like to comment here?

[anxolin]

you had comments regarding the code in another PR.
Would you like to comment here?

Yep, i know i mention this in another PR, but lost track of that, and I see this PR goes to develop so I assume this other PR is merged?

I see this PR adds the integration with @pinata/sdk, so I thought the suggestions are relevant in this one.

[alfetopito]

Yep, i know i mention this in another PR, but lost track of that, and I see this PR goes to develop so I assume this other PR is merged?

Nope, they are in Ramiro's PR that depends on this one.

[anxolin]

Nope, they are in Ramiro's PR that depends on this one.

Cool, just did, u recommended me back then to comment in this one. Anyways, comments are still unaddressed 😅

#1405 (comment)

[anxolin]

Nice! looks good to me 👌

This is a soft approve, just to understand the error handling.

[anxolin]

Approve :)