Skip to content
This repository has been archived by the owner on Apr 20, 2023. It is now read-only.

ImbueNetwork/dapp

Repository files navigation

imbue-web3-open-grant Imbue Network is a decentralised crowdfunding DAO built on top of the Polkadot blockchain platform. It is an idea incubator open to the entire world that allows anyone, from any walk of life and for any kind of endeavour, to submit and vote on Ideas worth funding from the communities that believe in them the most.

Imbue Network Dapp

Requirements

To go through this guide you will need:

  1. An account on the target testnet with funds. Our public testnet can be found here
  2. Polkadot-js wallet extention, you can install one from here
  3. If launching locally, you need to have the env GOOGLE_OAUTH2_CLIENT_ID and GOOGLE_OAUTH2_CLIENT_SECRET variables set. You can set an empty value to them if you dont plan to sign in using OAuth

Local deployment quickstart with docker-compose

From the top-level of the repo.

  1. Add some env variables to your bash profile and source.
echo 'export IMBUE_NETWORK_WEBSOCK_ADDR="wss://rococo.imbue.network"' >> $HOME/.bashrc;
echo 'export RELAY_CHAIN_WEBSOCK_ADDR="wss://rococo-rpc.polkadot.io"' >> $HOME/.bashrc;
source $HOME/.bashrc;
  1. Then build the associated images
docker-compose up -d;
  1. Setup DB and install.
cd api;
make db_up;
  1. Finally to start the project, simply
yarn start;

If you face any issues after the databases are created then restart the services from the top level repo.

docker-compose down;
docker-compose up -d 

Please note if you are using a Apple silicon e.g. M1 then you need to replace the Docker files

Local deployment with virtualBox

  1. Install VirtualBox from https://www.virtualbox.org/wiki/Downloads
  2. Download Ubuntu ISO file from https://ubuntu.com/download
  3. Boot the VM from the ISO file, a good guide is here: https://www.youtube.com/watch?v=J1Bf8FM8yN8
  4. Install yarn on the VM: https://linuxize.com/post/how-to-install-yarn-on-ubuntu-20-04/
  5. CD into the API directory
  6. Run make
  7. Run yarn start

Steps to create a new Imbue Network Project

For the purpose of this tutorial we will be using a local environment but you can just as easily follow it by going to the public staging url https://dev.imbue.network/dapp

We also advise to use two completely different browsers (e.g. Chrome and Firefox) because you will be effectively using two different personas

(Initiator) Create the proposal

  1. Navigate to http://localhost:8081/dapp/proposals/draft
  2. The site will ask you to connect to your wallet, chose the required account who will act as the initiator for this project. Sign-in
  3. Enter all of the required information for the project and the required funds. Add at least one milestone. The "percent to unlock" for all of the milestones should add up to 100%. new-project
  4. Click "Save Draft Proposal Proposal" to start the process of submitting the transaction to the chain.
  5. Review the project and if acceptable click on Finalise! finalise
  6. Once you see the Proposal Created message, congratulations your proposal is now onchain! proposal-created

(ADMIN/COUNCIL) Schedule round

  1. The UI for a super user has not been built yet, but you can use polkadotJS to open the funding round, its fairly simple and can be followed here

(Contributor) Contribute

  1. To contribute you need to ensure you are using a different browser or incognito because initators of projects cannot contribute to their own projects
  2. Navigate to http://localhost:8081/dapp/proposals/
  3. You should the project see a list of projects that have been created via the UI project-list
  4. Click the project you want to fund and you will be navigated to the details page. Notice that contribution section will now be available contribute Enter the amount you want to contribute and click the Contribute button contribution-success

(ADMIN/COUNCIL) Approve Project

  1. The UI for a super user has not been built yet, but you can use polkadotJS to approve a project here

Please note the role of the council here to define what success looks like, answer questions around whether of not a fund raise can be considered successful if it only hit 70% or 80% of its target. The role of the council will be reduced once these thresholds are set

(Initiator) Submit Milestone

  1. Once a project has been approved, switch back to the initator - go to the details page and you will see that it has changed to reflect milestone submission submit-milestone

  2. Once the submission gets saved onchain, you should see confirmation of it and submit your first milestone. submit-milestone-success

(Contributor) Vote On Milestone

  1. Switch back to the contributor and you will see that you can now vote on the milestone vote-milestone

  2. Choose your vote and the milestone you want to vote on, and click vote. Once the vote gets saved on chain you should see the confirmation vote-success

(ADMIN/COUNCIL) Approve Milestone

  1. The UI for a super user has not been built yet, but you can use polkadotJS to approve a milestone here

Please note just like the funding decision, the council comes in here to define what a successful vote looks like. This is a form of protection while we work with the community build the foundations of what success looks like. Once thresholds are set we can reduce the role of the council

(Initiator) Withdraw Funds

  1. Switch back to the initator and now you can successfully withdraw the funds

Services

  • The "web" service is an nginx container that proxy_passes most requests to the webflow server, except for location /dist
  • The "api" service is a nodejs/express app configured to use dynamodb local storage.
  • The "dynamodb-local" service is a temporary sqlite-based dynamodb interface to stand in for an eventual AWS hosted version of the same.
  • The "imbue" service is a rococo-local test network (currently disabled in the docker-compose config)

The repo is split into api and web directories. In each of those, you will find a Dockerfile. To run the api without docker, use its Dockerfile as a guide.

To develop the website locally, using yarn run

yarn install

to install dependencies, and

yarn start

which starts webpack in "watch" mode. This is connected to the running nginx server via the docker-compose volumes directive, which is tied to the ./web/dist directory (where webpack outputs its bundle).