Ω Olympus Frontend
This is the front-end repo for Olympus that allows users be part of the future of Greece.
_ Note We're currently in the process of switching to TypeScript. Please read this guide on how to use TypeScript for this repository. https://github.com/OlympusDAO/olympus-frontend/wiki/TypeScript-Refactor-General-Guidelines _
🔧 Setting up Local Development
Required:
$ git clone https://github.com/OlympusDAO/olympusdao.git
$ cd olympusdao
# set up your environment variables
# read the comments in the .env files for what is required/optional
$ cp .env.example .env
# fill in your own values in .env, then =>
$ yarn
$ yarn start
The site is now running at http://localhost:3000
!
Open the source code and start editing!
Rinkeby Testing
Rinkeby faucet for sOHM:
Lives here, to retrieve test sOHM click Connect to Web3
and use function #3: dripSOHM
. After connecting to web3, click Write
to execute and 10 sOHM will automatically be transferred to your connected wallet.
Note: The faucet is limited to one transfer per wallet every 6500 blocks (~1 day)
Rinkeby faucet for WETH: Wrap rinkeby eth on rinkeby uniswap
Rinkeby faucets for LUSD, FRAX & DAI can be taken from rinkeby etherscan:
- Go to
src/helpers/AllBonds.ts
- then copy the rinkeby
reserveAddress
for the applicable bond & navigate to that contract on rinkeby etherscan. - On Rinkeby etherscan use the
mint
function. You can use the number helper for 10^18 & then add four more zeros for 10,000 units of whichever reserve you are minting.
Architecture/Layout
The app is written in React using Redux as the state container.
The files/folder structure are a WIP and may contain some unused files. The project is rapidly evolving so please update this section if you see it is inaccurate!
./src/
├── App.jsx // Main app page
├── abi/ // Contract ABIs from etherscan.io
├── actions/ // Redux actions
├── assets/ // Static assets (SVGs)
├── components/ // Reusable individual components
├── constants.js/ // Mainnet Addresses & common ABI
├── contracts/ // TODO: The contracts be here as submodules
├── helpers/ // Helper methods to use in the app
├── hooks/ // Shared reactHooks
├── themes/ // Style sheets for dark vs light theme
└── views/ // Individual Views
Application translation
Olympus uses linguijs to manage translation.
The language files are located in a submodule deployed in src/locales/translations
. This submodule points to the olympus translation repository
In order to mark text for translation you can use:
- The component in jsx templates eg.
<Trans>Translate me!</Trans>
- The t function in javascript code and jsx templates.
t`Translate me`
You can also add comments for the translators. eg.
t({
id: "do_bond",
comment: "The action of bonding (verb)",
})
When new texts are created or existing texts are modified in the application please leave a message in the OlympusDao app-translation channel for the translators to translate them.
🚀 Deployment
Auto deployed on Fleek.co fronted by Cloudflare. Since it is hosted via IPFS there is no running "server" component and we don't have server sided business logic. Users are served an index.html
and javascript to run our applications.
TODO: TheGraph implementation/how/why we use it.
Continuous deployment
Commits to the follow branches are automatically deployed to their respective URLs.
Branch | URL |
---|---|
master | https://app.olympusdao.finance |
deploy | https://staging.olympusdao.finance |
Pull Requests: Each PR into master will get its own custom URL that is visible on the PR page. QA & validate changes on that URL before merging into the deploy branch.
👏🏽 Contributing Guidelines
We keep an updated list of bugs/feature requests in Github Issues.
Filter by "good first issue" to get your feet wet! Once you submit a PR, our CI will generate a temporary testing URL where you can validate your changes. Tag any of the gatekeepers on the review to merge them into master.
NOTE: For big changes associated with feature releases/milestones, they will be merged onto the develop
branch for more thorough QA before a final merge to master
Defenders of the code:
Only the following people have merge access for the master branch.
🗣 Community
- Join our Discord and ask how you can get involved with the DAO!