threedotstech/otomee-interface

A censorship-resistant Hub for The Metaverse, a place communities can call home. Create and exchange value with 0% fees.

otomee-interface's Issues

Need the ability to list ERC721 tokens for sale

As a seller
I need to have the ability to list any ERC721 token for sale
So that other users can see my listing and accept my offer.

Details and Assumptions

• To create a listing, the user must be registered.

Acceptance Criteria

Given the user has approved his token to be transferred by the Wyvern Proxy,
When the user lists an ERC720 item for sale and selects the desired ERC20 (If applicable)
Then listing must be added to the OrbitDB database, with the ability to be taken with both ETH or the specified ERC20.

Implement initial CI/CD pipelines

As a developer
I need basic CI/CD pipelines
So that the agility of our development lifecycle improves.

Details and Assumptions

• Must build a release of the react app
• Must deploy it to IPFS and the S3 bucket behind the otomee.com domain
• Initially we will release the alpha version, so it must use alpha.otomee.com
• Must follow the gitflow branching strategy

Acceptance Criteria

Given a new release or feature is ready
When I merge the corresponding branch to master, release or dev
Then the corresponding CI/CD workflows must be executed, making the changes available on alpha.otomee.com and on IPFS.

Migrate to Stateswap

As an trading platform
I need to migrate to the Stateswap contracts
So that we can leverage it's support and ecosystem.

Details and Assumptions

• https://github.com/stateswap/stateswap-v1

Acceptance Criteria

Given Otomee currently works with the Wyvern contracts
When the platform is used
Then it should work with the Stateswap contracts instead.

Need the ability to list ERC1155 for sale.

As a seller
I need to have the ability to list any amount of a ERC1155 tokens for sale
So that other users can see my listing and accept my offer.

Details and Assumptions

• To create a listing, the user must be registered.
• To create a listing, the user must be registered.

Acceptance Criteria

Given the user has approved his token to be transferred by the Wyvern Proxy,
When the user lists an ERC1155 item for sale and selects the desired ERC20 (If applicable)
Then listing must be added to the OrbitDB database, with the ability to be taken with both ETC and the specified ERC20.

Need the ability to search collections

As a user
I need a search bar functionality
So that I can easily and securely find collections and Items

Details and Assumptions

• Use a collectible list: https://github.com/0xsequence/collectible-lists

Acceptance Criteria

Given there collection is registered in the collectible list
When I look up for the name of the collection on the search bar
Then I must see a button which takes me to the collection page.

Need the ability to take WETH offers to ERC721s

As a seller
I need to have the ability to take WETH offers
So that I can obtain the WETH in exchange for my ERC721.

Details and Assumptions

• There should be an existing WETH offer for the NFT
• To take an offer, the seller must be registered.
• The desired NFT must be an ERC721

Acceptance Criteria

Given there is an existing WETH offer to a user's ERC721
When the seller takes the offer
Then the orders should be matched by Stateswap and the WETH offer must be removed from the OrbitDB database.

Migrate subgraphs to Goerli

We need to migrate Rinkeby subgraphs to the Goerli network.

Details and Assumptions

• Rinkeby EIP1155 subgraph: https://thegraph.com/studio/subgraph/d-otomee-eip1155-rinkeby/
• Rinkeby EIP721 subgraph: https://thegraph.com/studio/subgraph/d-otomee-eip721-rinkeby/

Acceptance Criteria

Given that the two new subgraphs have been deployed
When a user accesses Otomee on the Goerli testnet
Then the platform should display nft info queried by the Goerli subgraphs.

The OrbitDB must replicate across users

As a user
I need to persist the active orders
So that everyone can have access to offers made by other users

Details and Assumptions

Acceptance Criteria

Given there are orders stored in the database
When a new user enters Otomee
Then his local copy of the database should start replicating the global state.

Create CI pipeline

As a developer
I need a CI pipeline in GitHub Actions that builds my project every time I create a pull request to the dev, master or release branch
So that I can ensure that my code integrates seamlessly, passes all build steps, and maintains the quality of the development branch

Details and Assumptions

• The project is a React application hosted on GitHub.
• The project follows the Gitflow Workflow. (https://www.atlassian.com/git/tutorials/comparing-workflows/gitflow-workflow)
• GitHub Actions is used for continuous integration.
• The pipeline is implemented as a reusable workflow (https://docs.github.com/en/actions/using-workflows/reusing-workflows)
• The pipeline triggers on pull requests to the dev, master and release branches.
• The pipeline includes steps for installing dependencies, building the React project, and optionally running tests (such as unit tests and linters).
• The build process should succeed without any compilation errors.
• Node.js v18 and yarn are used for managing dependencies.
• The dev branch is the primary branch for ongoing development.

Acceptance Criteria

Given the CI pipeline is triggered
When the pipeline executes
Then it installs all necessary dependencies

Given the CI pipeline is triggered
When the pipeline executes
Then it installs all necessary dependencies

And when the dependencies are installed
Then it builds the React project successfully without compilation errors

Given the React project build is successful
When I check the status of the pull request
Then I see a passing build status on the pull request

Given the React project build fails
When I check the status of the pull request
Then I see a failing build status and detailed error messages indicating the cause of the failure

Add install instruction to project's readme.

As a contributor
I need clear install instructions
So that I can easily bootstrap the project to develop on my local machine

Details and Assumptions

• Standard NextJS installation
• The only tricky part could be running the patch-package script, not sure if it's ran by default after installing modules.
• Create .env file and add REACT_APP_THE_GRAPH_KEY

Acceptance Criteria

Given a new user/developer wants to install and run Otomee locally from source
When following the Installation instructions of the readme
Then after finishing the last step, running npm start should successfully run Otomee ready to use.

Create Order builder

We need to refactor the order-building system to encapsulate all the logic inside a builder class.

Details and Assumptions

• Current order building logic is implemented at useExchangeContract.ts.
• Must implement the Builder design pattern.

Need the ability to make WETH offers to ERC721s

As a buyer
I need to have the ability to make WETH offer
So that I can obtain the NFT in exchange for WETH token.

Details and Assumptions

• To make an offer, the buyer must be registered.
• The desired NFT must be a ERC721

Acceptance Criteria

Given there is an existing ERC721 that the user wants and has enough funds to pay for it, in WETH
When the buyer creates the offer
Then the offer must be added to the OrbitDB database, with the ability to be taken by the owner of the ERC721.

Need the ability to take ERC721 listings

As a buyer
I need to have the ability to take any ERC721 offer
So that I can obtain the NFT in exchange for ETH or an ERC20 token.

Details and Assumptions

• To take an offer, the user must be registered.
• Need a listed ERC721 offer

Acceptance Criteria

Given there is a listed ERC721 which the user wants and has enough funds to pay for it, whether its ETH or an ERC20
When the user takes the offer
Then the desired ERC721 token must be transferred to the buyer's address, and the listing price (in ETH or ERC20( must be transferred to the seller's address. After the transaction is confirmed, the sell offer must be deleted from the Orbit Database.

Need the ability to take ERC1155 offers

As a buyer
I need to have the ability to take any amount of a listed ERC1155 offer
So that I can obtain the NFT in exchange for ETH or an ERC20 token.

Details and Assumptions

• To take an offer, the user must be registered.
• Need a listed ERC1155 offer
• The buyer has enough funds to cover the offer

Acceptance Criteria

Given there is a listed ERC1155 offer with tree items,
When the user takes the offer, buying only two of the three items listed,
Then the two ERC1155s must be transferred to the buyer's address, and the desired price per ERC1155 times two (paid in ETH or ERC20) must be transferred to the seller's address. After the transaction is confirmed, the sell offer must be updated in the Orbit Database to reflect there is still one ERC1155 available for sell.

Need the ability to navigate to my profile from the Nav Bar

As a user
I need to be able to navigate to my profile from the Navigation Bar
So that easily see my collected Items and detailed profile

Details and Assumptions

• The user is logged in to Otomee
• NavBar: https://github.com/ThreeDotsTech/Otomee-interface/blob/main/src/components/NavBar/index.tsx
• Web3Status Element is where user identity is shown inside the NavBar: https://github.com/ThreeDotsTech/Otomee-interface/blob/main/src/components/Web3Status/index.tsx#L115
• Consult the useWeb3React hook documentation of the Web3-react module.

Acceptance Criteria

Given I am logged in to Otomee
When I clock on my profile button
Then I am redirected to my profile

Refactor state management.

We need to refactor the state management system to properly implement Redux across the whole application.

Details and Assumptions

• Current state management logic is implemented at src/state.
• Must implement Redux to store state
• Must implement reducers to manage state.
• Must use redux-state-sync to sync state between tabs ONLY when applicable. (e.g. share orbitdb or ipfs state)
• Must use redux-persist or redux-localstorage-simple (TBD) to persist state when applicable.

Show a warning when the user doesn't have enough funds

As a user
I need a warning when I don't have enough funds to make a transaction
So that I can be aware of why my purchase is failing

Details and Assumptions

• [document what you know]

Acceptance Criteria

Given [some context]
When [certain action is taken]
Then [the outcome of action is observed]

Görli testnet MVP launch

Need the ability to disconnect my wallet from Otomee

As a user
I need a button to logout from Otomee
So that I can log in with other accounts if I want to.

Details and Assumptions

• Logging out of Otomee means
  a) Disconnecting Metamask from the Dapp
  b) Changing the Orbitdb identity to an anonymous ID.

Acceptance Criteria

Given the user has connected his wallet to Otomee
When he presses the logout button
Then his metamask wallet must disconnect from Otomee and his Orbitdb ID must change to an anonymous ID.

Create CD pipeline

As a developer
I need a CD pipeline in GitHub Actions that builds the Otomee Interface and deploys it to an AWS S3 bucket and IPFS when changes are merged to the dev, release or master branch
So that my application is automatically updated and distributed across both AWS and IPFS networks, ensuring high availability and decentralization

Details and Assumptions

• The project is a React application hosted on GitHub.
• The project follows the Gitflow Workflow. (https://www.atlassian.com/git/tutorials/comparing-workflows/gitflow-workflow)
• GitHub Actions is used for continuous deployment.
• The CD pipeline triggers when changes are merged into the dev, master or release branches.
• The pipeline includes steps for building the React project, uploading the build to an AWS S3 bucket, and uploading it to IPFS.
• The workflow interacts with AWS using the AWS cli (https://docs.aws.amazon.com/cli/latest/userguide/cli-services-s3-commands.html) (https://docs.aws.amazon.com/cli/latest/userguide/getting-started-install.html)
• The authentication with AWS is done using access keys.
• AWS credentials are securely stored and accessible within the GitHub Actions environment.
• The AWS S3 bucket is properly configured to serve the React application.
• The workflow interacts with IPFS via an IPFS client inside the github runner. (ipns://docs.ipfs.tech/install/command-line/#install-official-binary-distributions) (ipns://docs.ipfs.tech/how-to/kubo-basic-cli/#add-files)

Acceptance Criteria

Given the Otomee interface repository and a configured CD pipeline
When changes are merged into the dev, release or master branch
Then the CD pipeline triggers automatically

Given the CD pipeline is triggered
When the pipeline executes
Then it builds the React project successfully

And when the React project is built
Then it uploads the build artifacts to the specified AWS S3 bucket

And after uploading to AWS S3
Then it uploads the build artifacts to IPFS

Given the deployment is successful
When I access the React application URL on AWS S3
Then I see the latest version of the application

And when I access the React application through an IPFS gateway
Then I see the latest version of the application

Refactor Item page state management.

We need to refactor the Item page state management to improve code maintainability and legibility.

Details and Assumptions

• Items page state should NOT be synced across tabs.
• Items page state should NOT be persistent.
• Improve UI components' readability by migrating state management logic to isolated reducers.

Migrate to Görli

As a trading platform
I need to migrate to the Görli testnet
So that we can leverage it's support and ecosystem.

Details and Assumptions

• https://goerli.net/

Acceptance Criteria

Given Otomee's testnet currently runs on Rinkeby
When the platform is used
Then it should run on Görli instead.