14 | { children } 15 |
16 | ) 17 | } 18 | } 19 | 20 | Title.propTypes = { 21 | children: PropTypes.node, 22 | } 23 | 24 | export default Title 25 | -------------------------------------------------------------------------------- /src/containers/LegalCompliance/store/selectors.js: -------------------------------------------------------------------------------- 1 | import { formValueSelector } from 'redux-form' 2 | import { getFeatureConfig } from 'utils/features' 3 | 4 | const { documents } = getFeatureConfig('legalCompliance') 5 | 6 | const getFormValue = formValueSelector('legalCompliance') 7 | 8 | const getLegalDocumentFields = (state) => { 9 | const fields = {} 10 | 11 | documents.forEach((doc) => { 12 | fields[doc.id] = !!getFormValue(state, doc.id) 13 | }) 14 | 15 | return fields 16 | } 17 | 18 | export default state => ({ 19 | fields: getLegalDocumentFields(state), 20 | documents, 21 | }) 22 | -------------------------------------------------------------------------------- /src/api/utils/fetch.js: -------------------------------------------------------------------------------- 1 | /* globals fetch */ 2 | import qs from 'querystring' 3 | import { getConfiguration } from 'utils/features' 4 | 5 | const config = getConfiguration() 6 | 7 | const API_URL = `${config.gnosisdb.protocol}://${config.gnosisdb.host}/api` 8 | 9 | export const requestFromRestAPI = async (endpoint, queryparams) => { 10 | const url = `${API_URL}/${endpoint}?${qs.stringify(queryparams)}` 11 | 12 | let response 13 | 14 | try { 15 | response = await fetch(url) 16 | return response.json() 17 | } catch (e) { 18 | console.error(`GnosisDB: Couldn't fetch ${e}`) 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /src/store/reducers/accountShares.js: -------------------------------------------------------------------------------- 1 | import { Map } from 'immutable' 2 | import { handleActions } from 'redux-actions' 3 | import { addShare, updateShare, redeemShare } from 'store/actions/shares' 4 | 5 | export default handleActions( 6 | { 7 | [addShare]: (state, { payload }) => state.withMutations((map) => { 8 | payload.forEach(share => map.set(share.id, share)) 9 | }), 10 | [redeemShare]: (state, { payload: shareId }) => state.setIn([shareId, 'balance'], '0'), 11 | [updateShare]: (state, { payload: { shareId, data } }) => state.mergeIn([shareId], data), 12 | }, 13 | Map(), 14 | ) 15 | -------------------------------------------------------------------------------- /scripts/configuration.browser.js: -------------------------------------------------------------------------------- 1 | /* globals process */ 2 | const fs = require('fs') 3 | const path = require('path') 4 | 5 | const GNOSIS_ENV = process.argv.splice(-1)[0] 6 | const { GNOSIS_CONFIG } = process.env 7 | 8 | const configLoader = require('./configuration.js') 9 | 10 | const applicationConfiguration = configLoader(GNOSIS_ENV, GNOSIS_CONFIG) 11 | 12 | const configTarget = path.join(__dirname, '..', 'dist', 'config.js') 13 | fs.writeFileSync(configTarget, `window.__GNOSIS_CONFIG__ = ${JSON.stringify(applicationConfiguration, null, 2)}`) 14 | console.log('[PM-UI] Config for env written to dist/config.js') 15 | -------------------------------------------------------------------------------- /.travis/scripts/prepare_production_deployment.sh: -------------------------------------------------------------------------------- 1 | #!/bin/bash 2 | 3 | set -ev 4 | 5 | # Only: 6 | # - Tagged commits 7 | # - Security env variables are available. 8 | if [ -n "$TRAVIS_TAG" ] && [ -n "$PROD_DEPLOYMENT_HOOK_TOKEN" ] && [ -n "$PROD_DEPLOYMENT_HOOK_URL_DOMAIN" ] 9 | then 10 | curl -X POST \ 11 | -F token="$PROD_DEPLOYMENT_HOOK_TOKEN" \ 12 | -F ref=master \ 13 | -F "variables[TRIGGER_RELEASE_COMMIT_TAG]=$TRAVIS_TAG" \ 14 | https://"$PROD_DEPLOYMENT_HOOK_URL_DOMAIN"/api/v4/projects/39/trigger/pipeline 15 | else 16 | echo "[ERROR] Production deployment could not be prepared" 17 | fi 18 | -------------------------------------------------------------------------------- /src/assets/img/icons/icon_checkmark.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 10 | -------------------------------------------------------------------------------- /src/assets/img/icons/icon_link.svg: -------------------------------------------------------------------------------- 1 | 4 | -------------------------------------------------------------------------------- /src/components/layout/Paragraph/index.scss: -------------------------------------------------------------------------------- 1 | .default-paragraph { 2 | font-family: Montserrat; 3 | color: #626262; 4 | 5 | line-height: 1.7; 6 | font-weight: 300; 7 | color: #333; 8 | } 9 | 10 | .soft { 11 | color: #888888; 12 | } 13 | 14 | .medium { 15 | color: #686868; 16 | } 17 | 18 | .dark { 19 | color: black; 20 | } 21 | 22 | .primary { 23 | color: #00a6c4; 24 | } 25 | 26 | .no-margin{ 27 | margin-bottom: 5px; 28 | } 29 | 30 | .center { 31 | text-align: center; 32 | } 33 | 34 | .normal { 35 | font-size: 18px; 36 | } 37 | 38 | .small { 39 | font-size: 12px; 40 | } -------------------------------------------------------------------------------- /src/components/layout/Subtitle/index.js: -------------------------------------------------------------------------------- 1 | import classNames from 'classnames/bind' 2 | import PropTypes from 'prop-types' 3 | import React, { PureComponent } from 'react' 4 | import * as css from './index.scss' 5 | 6 | const cx = classNames.bind(css) 7 | 8 | class Subtitle extends PureComponent { 9 | render() { 10 | const { children, ...props } = this.props 11 | 12 | return ( 13 |14 | { children } 15 |
16 | ) 17 | } 18 | } 19 | 20 | Subtitle.propTypes = { 21 | children: PropTypes.node, 22 | } 23 | 24 | export default Subtitle 25 | -------------------------------------------------------------------------------- /src/api/token.js: -------------------------------------------------------------------------------- 1 | import { getROGnosisConnection } from 'api' 2 | 3 | export const getTokenSymbol = async (tokenAddress) => { 4 | const gnosis = await getROGnosisConnection() 5 | const token = await gnosis.contracts.DetailedERC20.at(tokenAddress) 6 | const tokenSymbol = await token.symbol() 7 | return tokenSymbol 8 | } 9 | 10 | export const getTokenBalance = async (tokenAddress, accountAddress) => { 11 | const gnosis = await getROGnosisConnection() 12 | const token = await gnosis.contracts.Token.at(tokenAddress) 13 | const balance = await token.balanceOf(accountAddress) 14 | return balance.toString() 15 | } 16 | -------------------------------------------------------------------------------- /src/assets/img/icons/icon_incomeForecast.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 10 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | 2 | .DS_STORE 3 | node_modules 4 | *~ 5 | *.pyc 6 | static 7 | .grunt 8 | _SpecRunner.html 9 | __benchmarks__ 10 | dist/ 11 | coverage/ 12 | .module-cache 13 | *.gem 14 | docs/.bundle 15 | docs/code 16 | docs/_site 17 | docs/.sass-cache 18 | docs/js/* 19 | docs/downloads/*.zip 20 | docs/vendor/bundle 21 | examples/shared/*.js 22 | examples/**/bundle.js 23 | test/the-files-to-test.generated.js 24 | *.log* 25 | chrome-user-data 26 | *.sublime-project 27 | *.sublime-workspace 28 | .idea 29 | *.iml 30 | .vscode 31 | /semantic.json 32 | /semantic 33 | yarn-error.log 34 | yarn.lock 35 | local.json 36 | production.json 37 | .history -------------------------------------------------------------------------------- /src/integrations/uport/uportQr.js: -------------------------------------------------------------------------------- 1 | export const isValid = cred => !!cred 2 | 3 | const assignSessionProps = (uport, cred) => { 4 | // eslint-disable-next-line 5 | uport.address = cred.address 6 | // eslint-disable-next-line 7 | uport.firstReq = false 8 | } 9 | 10 | const init = async (uport, requestCredentials, getCredential) => { 11 | let credential = getCredential() 12 | if (!isValid(credential)) { 13 | uport.firstReq = true 14 | credential = await requestCredentials() 15 | } 16 | 17 | if (credential) { 18 | assignSessionProps(uport, credential) 19 | } 20 | 21 | return uport 22 | } 23 | 24 | export default init 25 | -------------------------------------------------------------------------------- /src/routes/MarketDetails/components/MarketDetail/Infos/utils/embeddedLink.js: -------------------------------------------------------------------------------- 1 | export default (marketAddress) => { 2 | const path = `${window.location.origin}/embedded/${marketAddress}` 3 | 4 | return ` 5 |
6 |
7 |
8 |
21 | `
22 | }
23 |
--------------------------------------------------------------------------------
/src/routes/MarketList/components/MarketsTitle/index.js:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import PropTypes from 'prop-types'
3 | import { withNamespaces } from 'react-i18next'
4 | import classNames from 'classnames/bind'
5 |
6 | import css from './MarketsTitle.scss'
7 |
8 | const cx = classNames.bind(css)
9 |
10 | const MarketListTitle = ({ t }) => (
11 |
12 |
16 | )
17 |
18 | MarketListTitle.propTypes = {
19 | t: PropTypes.func.isRequired,
20 | }
21 |
22 | export default withNamespaces()(MarketListTitle)
23 |
--------------------------------------------------------------------------------
/src/containers/BackdropProvider/backdrop.scss:
--------------------------------------------------------------------------------
1 | .below {
2 | height: 100vh;
3 | background-color: #09697b;
4 | opacity: 0.9;
5 |
6 | z-index: 99;
7 | position: fixed;
8 | top: 0;
9 | left: 0;
10 | right: 0;
11 | bottom: 0;
12 | }
13 |
14 | .above {
15 | z-index: 100;
16 | position: fixed;
17 | top: 0;
18 | left: 0;
19 | right: 0;
20 | bottom: 0;
21 | }
22 |
23 | .fade-enter {
24 | opacity: 0.01;
25 | }
26 | .fade-enter-active {
27 | opacity: 1;
28 | transition: all 300ms ease-out;
29 | }
30 | .fade-exit {
31 | opacity: 1;
32 | }
33 | .fade-exit-active {
34 | opacity: 0.01;
35 | transition: all 300ms ease-out;
36 | }
37 |
--------------------------------------------------------------------------------
/src/routes/MarketList/store/test/market.selector.js:
--------------------------------------------------------------------------------
1 | import { List } from 'immutable'
2 | import { marketListSelector } from '../selectors'
3 |
4 | const marketTests = () => {
5 | describe('Market List Selector[marketsSelector]', () => {
6 | it('should get empty immutable List when they are not loaded', () => {
7 | // GIVEN
8 | const emptyList = List([])
9 | const reduxStore = { marketList: emptyList }
10 |
11 | // WHEN
12 | const marketListState = marketListSelector(reduxStore)
13 |
14 | // THEN
15 | expect(marketListState).toEqual(emptyList)
16 | })
17 | })
18 | }
19 |
20 | export default marketTests
21 |
--------------------------------------------------------------------------------
/src/containers/Modals/ModalClaimReward/action.js:
--------------------------------------------------------------------------------
1 | import { GAS_COST } from 'utils/constants'
2 | import { setGasCost } from 'routes/MarketDetails/store/actions'
3 | import { getFeatureConfig } from 'utils/features'
4 | import { calcClaimRewardGasCost } from './api'
5 |
6 | const contractType = GAS_COST.CLAIM_REWARD
7 | const { claimReward } = getFeatureConfig('rewardClaiming')
8 |
9 | const requestClaimRewardGasCost = () => async (dispatch) => {
10 | const gasCost = await calcClaimRewardGasCost(claimReward.contractAddress)
11 |
12 | dispatch(setGasCost({ entityType: 'gasCosts', contractType, gasCost }))
13 | }
14 |
15 | export { requestClaimRewardGasCost }
16 |
--------------------------------------------------------------------------------
/src/utils/analytics/intercom/index.js:
--------------------------------------------------------------------------------
1 | import { getThirdPartyConfig } from 'utils/features'
2 |
3 | export const THIRD_PARTY_ID = 'intercom'
4 |
5 | const { id: APP_ID } = getThirdPartyConfig(THIRD_PARTY_ID)
6 |
7 | export default () => {
8 | const d = document
9 |
10 | const s = d.createElement('script')
11 | s.type = 'text/javascript'
12 | s.async = true
13 | s.src = `https://widget.intercom.io/widget/${APP_ID}`
14 | const x = d.getElementsByTagName('script')[0]
15 | x.parentNode.insertBefore(s, x)
16 |
17 | s.onload = () => {
18 | window.Intercom('boot', {
19 | app_id: APP_ID,
20 | consent: true,
21 | })
22 | }
23 | }
24 |
--------------------------------------------------------------------------------
/src/routes/MarketDetails/components/ExpandableViews/MarketBuySharesForm/SubmitError/index.js:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import PropTypes from 'prop-types'
3 | import { withNamespaces } from 'react-i18next'
4 | import cn from 'classnames/bind'
5 | import style from '../marketBuySharesForm.scss'
6 |
7 | const cx = cn.bind(style)
8 |
9 | const SubmitError = ({ t }) => (
10 |
13 |
15 | {t('markets.list_title')}
14 |
11 |
15 | )
16 |
17 | SubmitError.propTypes = {
18 | t: PropTypes.func.isRequired,
19 | }
20 |
21 | export default withNamespaces()(SubmitError)
22 |
--------------------------------------------------------------------------------
/src/utils/marginPrice.js:
--------------------------------------------------------------------------------
1 | import Decimal from 'decimal.js'
2 |
3 | const allowedRangePrice = (oldP, newP) => {
4 | const oldPrice = new Decimal(oldP)
5 | const newPrice = new Decimal(newP)
6 |
7 | // We calculate the 5% of the latest price applying 18 decimals round up
8 | const allowance = new Decimal(newPrice)
9 | .mul(5)
10 | .div(100)
11 | .toDP(18, Decimal.ROUND_UP)
12 |
13 | // Calculate the abs difference between prices
14 | const diff = new Decimal(newPrice).sub(oldPrice).absoluteValue()
15 |
16 | return diff.lte(allowance) // return true if diff between prices is lower than 5 percent
17 | }
18 |
19 | export default allowedRangePrice
20 |
--------------------------------------------------------------------------------
/src/containers/Modals/ModalRegisterWallet/actions.js:
--------------------------------------------------------------------------------
1 | import { GAS_COST } from 'utils/constants'
2 | import { setGasCost } from 'routes/MarketDetails/store/actions'
3 | import { getCurrentAccount } from 'integrations/store/selectors'
4 | import { calcRegistrationGasCost } from './api'
5 |
6 | const contractType = GAS_COST.MAINNET_ADDRESS_REGISTRATION
7 |
8 | const requestRegistrationGasCost = () => async (dispatch, getState) => {
9 | const account = getCurrentAccount(getState())
10 | const gasCost = await calcRegistrationGasCost(account)
11 |
12 | dispatch(setGasCost({ entityType: 'gasCosts', contractType, gasCost }))
13 | }
14 |
15 | export { requestRegistrationGasCost }
16 |
--------------------------------------------------------------------------------
/src/routes/MarketDetails/store/selectors/getMarketTradesForAccount.js:
--------------------------------------------------------------------------------
1 | import { createSelector } from 'reselect'
2 | import moment from 'moment'
3 | import tradeSelector from 'store/selectors/account/trades'
4 | import { normalizeHex } from 'utils/helpers'
5 |
6 | const getMarketTradesForAccount = (eventAddress, accountAddress = '') => createSelector(tradeSelector, trades => trades
7 | .filter(
8 | trade => normalizeHex(trade.eventAddress) === normalizeHex(eventAddress)
9 | && normalizeHex(trade.owner) === normalizeHex(accountAddress),
10 | )
11 | .sort((a, b) => (moment(a.date).isBefore(b.date) ? 1 : -1)))
12 |
13 | export default getMarketTradesForAccount
14 |
--------------------------------------------------------------------------------
/src/routes/MarketList/components/Markets/Market/MarketResolution.js:
--------------------------------------------------------------------------------
1 | import PropTypes from 'prop-types'
2 | import React from 'react'
3 | import classNames from 'classnames/bind'
4 |
5 | import Icon from 'components/Icon'
6 |
7 | import css from './Market.scss'
8 |
9 | const cx = classNames.bind(css)
10 |
11 | const MarketResolution = ({ resolution }) => (
12 |
12 | {t('market.submit_error')}
13 |
14 |
13 |
18 | )
19 |
20 | MarketResolution.propTypes = {
21 | resolution: PropTypes.string.isRequired,
22 | }
23 |
24 | export default MarketResolution
25 |
--------------------------------------------------------------------------------
/src/assets/img/icons/icon_share.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/routes/MarketDetails/components/MarketGraph/DateAxisTick/index.js:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import PropTypes from 'prop-types'
3 | import moment from 'moment'
4 |
5 | const DateAxisTick = ({ x, y, payload }) => (
6 |
15 | {resolution}
16 |
17 |
11 |
17 | )
18 |
19 | MarketsOverview.propTypes = {
20 | children: PropTypes.node,
21 | }
22 |
23 | MarketsOverview.defaultProps = {
24 | children: null,
25 | }
26 |
27 | export default MarketsOverview
28 |
--------------------------------------------------------------------------------
/src/store/models/share/index.js:
--------------------------------------------------------------------------------
1 | import { Record } from 'immutable'
2 |
3 | const ShareRecord = Record({
4 | id: undefined, // string
5 | owner: undefined, // string
6 | eventAddress: undefined, // string
7 | collateralTokenAddress: undefined, // string
8 | balance: undefined, // int
9 | marketTitle: undefined, // string
10 | marketType: undefined, // oneOf OUTCOME_TYPE
11 | marketResolution: undefined, // moment
12 | marketOutcomes: undefined, // List
12 |
16 |
13 | {children}
14 |
15 |
21 |
22 |
23 |
24 | )
25 |
26 | export default MenuAccountDropdown
27 |
--------------------------------------------------------------------------------
/src/routes/MarketDetails/components/ExpandableViews/MarketBuySharesForm/LimitMarginAnnotation/index.js:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import PropTypes from 'prop-types'
3 | import { withNamespaces } from 'react-i18next'
4 | import cn from 'classnames/bind'
5 | import style from '../marketBuySharesForm.scss'
6 |
7 | const cx = cn.bind(style)
8 |
9 | const LimitMarginAnnotation = ({ t }) => (
10 |
11 |
15 | )
16 |
17 | LimitMarginAnnotation.propTypes = {
18 | t: PropTypes.func.isRequired,
19 | }
20 |
21 | export default withNamespaces()(LimitMarginAnnotation)
22 |
--------------------------------------------------------------------------------
/src/components/Header/Layouts/index.js:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import Loadable from 'react-loadable'
3 | import { Desktop, Tablet, Mobile } from 'components/Responsive'
4 |
5 | const LoadableDesktop = Loadable({
6 | loader: () => import('./DesktopHeader'),
7 | loading: () => null,
8 | })
9 |
10 | const LoadableMobile = Loadable({
11 | loader: () => import('./MobileHeader'),
12 | loading: () => null,
13 | })
14 |
15 | const Layout = props => (
16 |
12 | {t('market.limit_margin_warning')}
13 |
14 |
17 |
18 |
20 |
21 |
23 |
24 |
26 |
27 | )
28 |
29 | export default Layout
30 |
--------------------------------------------------------------------------------
/src/routes/Scoreboard/components/Table/ScoreTable/index.stories.js:
--------------------------------------------------------------------------------
1 | import { text } from '@storybook/addon-knobs'
2 | import { storiesOf } from '@storybook/react'
3 | import * as React from 'react'
4 | import users from 'stories/knobs/scoreboardUsers'
5 | import { host } from 'storybook-host'
6 | import Component from './index'
7 |
8 | storiesOf('Route ScoreBoard components', module)
9 | .addDecorator(host({
10 | title: 'ScoreBoard',
11 | align: 'center',
12 | height: 650,
13 | width: '100%',
14 | }))
15 | .add('ScoreTable', () => {
16 | const data = users
17 | const myWallet = text('User Account', '0x90F8bf6A479f320ead074411a4B0e7944Ea8ca007')
18 |
19 | return
11 |
12 |
16 | )
17 |
18 | OutcomePriceChanged.propTypes = {
19 | closeModal: PropTypes.func.isRequired,
20 | t: PropTypes.func.isRequired,
21 | }
22 |
23 | export default withNamespaces()(OutcomePriceChanged)
24 |
--------------------------------------------------------------------------------
/src/components/Outcome/WinningOutcome/WinningOutcome.scss:
--------------------------------------------------------------------------------
1 | .winningOutcomeContainer {
2 | display: flex;
3 | margin: 10px 0 10px 3px;
4 | align-items: center;
5 | justify-content: flex-start;
6 | text-transform: uppercase;
7 | font-weight: 500;
8 | }
9 |
10 | .winningOutcomeIcon {
11 | background: url('../../../assets/img/icons/icon_winningOutcome.svg');
12 | background-size: contain;
13 | width: 40px;
14 | height: 40px;
15 | margin-left: -10px;
16 | }
17 |
18 | .winningOutcomeLabel {
19 | color: #87949c;
20 | font-size: 12px;
21 | }
22 |
23 | .winningOutcomeText {
24 | margin-left: 10px;
25 | background-color: #87949c;
26 | color: #fff;
27 | border-radius: 6px;
28 | padding: 5px 10px;
29 | }
30 |
31 | .winningOutcomeUnit {
32 | text-transform: none;
33 | }
34 |
--------------------------------------------------------------------------------
/src/assets/img/icons/icon_cross.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
12 |
--------------------------------------------------------------------------------
/src/components/Header/Layouts/MobileHeader/BurgerIcon/index.js:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import PropTypes from 'prop-types'
3 | import cn from 'classnames/bind'
4 | import menuIcon from './assets/menu_icon.svg'
5 | import style from './BurgerIcon.scss'
6 |
7 | const cx = cn.bind(style)
8 |
9 | // the prop is called addClass because prop className is overwriteen by react-burger-menu
10 | const BurgerIcon = ({ addClass }) => (
11 | 13 | {t('warning.price_changed')} 14 |
15 |
12 | 
13 | MENU
14 |
15 | )
16 |
17 | BurgerIcon.propTypes = {
18 | addClass: PropTypes.string,
19 | }
20 |
21 | BurgerIcon.defaultProps = {
22 | addClass: '',
23 | }
24 |
25 | export default BurgerIcon
26 |
--------------------------------------------------------------------------------
/src/routes/Scoreboard/store/actions/rewards.js:
--------------------------------------------------------------------------------
1 | import { claimRewards } from 'api'
2 |
3 | import { setAccountRewardClaimState } from 'store/actions/account'
4 | import { getCurrentAccount } from 'integrations/store/selectors'
5 | import { getFeatureConfig } from 'utils/features'
6 |
7 | const { claimUntil } = getFeatureConfig('rewards')
8 |
9 | export const claimUserRewards = (contractAddress, rewardClaimAmount) => async (dispatch, getState) => {
10 | const state = getState()
11 | const account = getCurrentAccount(state)
12 | try {
13 | await claimRewards(contractAddress) // These arguments get hashed, this way we can determine if claiming is available again
14 | dispatch(setAccountRewardClaimState(account, claimUntil, rewardClaimAmount))
15 | } catch (e) {
16 | console.error(e)
17 | }
18 | }
19 |
--------------------------------------------------------------------------------
/src/routes/MarketDetails/components/MarketDetail/Controls/Controls.scss:
--------------------------------------------------------------------------------
1 | @import "~style/vars.scss";
2 |
3 | $expandable-arrow-size: 15px;
4 | $expandable-margin: 40px;
5 |
6 | .marketControls {
7 | &.controlsContainer {
8 | padding-top: 40px;
9 | }
10 |
11 | .button {
12 | margin-right: 20px;
13 |
14 | &.active {
15 | &:after {
16 | content: '';
17 | position: absolute;
18 | bottom: -$expandable-margin;
19 | left: 50%;
20 | margin-left: -$expandable-arrow-size;
21 | width: 0;
22 | height: 0;
23 | border-left: $expandable-arrow-size solid transparent;
24 | border-right: $expandable-arrow-size solid transparent;
25 | border-bottom: $expandable-arrow-size solid $bg-color-muted;
26 | }
27 | }
28 | }
29 | }
30 |
--------------------------------------------------------------------------------
/src/store/middlewares/Storage/index.js:
--------------------------------------------------------------------------------
1 | import StorageLoader from './Load'
2 | import StorageDumper from './Dump'
3 |
4 | export * from './actions'
5 |
6 | const localstorageOptions = {
7 | whitelist: [
8 | 'transactions.log',
9 | 'integrations.accountSettings',
10 | 'blockchain.targetNetworkId',
11 | 'integrations.documentsAccepted',
12 | ],
13 | }
14 | export const LocalStorageDump = StorageDumper(window.localStorage, localstorageOptions)
15 | export const LocalStorageLoad = StorageLoader(window.localStorage, localstorageOptions)
16 |
17 | const sessionstorageOptions = {
18 | whitelist: ['modal'],
19 | }
20 | export const SessionStorageDump = StorageDumper(window.sessionStorage, sessionstorageOptions)
21 | export const SessionStorageLoad = StorageLoader(window.sessionStorage, sessionstorageOptions)
22 |
--------------------------------------------------------------------------------
/src/containers/HeaderContainer/store/actions.js:
--------------------------------------------------------------------------------
1 | import { requestCollateralTokenBalance } from 'store/actions/blockchain'
2 | import { openModal } from 'store/actions/modal'
3 | import { requestMainnetAddress } from 'store/actions/account'
4 |
5 | import { initProviders } from 'integrations/store/actions'
6 | import { WALLET_PROVIDER } from 'integrations/constants'
7 | import { fetchTournamentUserData } from 'routes/Scoreboard/store'
8 |
9 | export default {
10 | requestMainnetAddress,
11 | fetchTournamentUserData: accountAddress => dispatch => dispatch(fetchTournamentUserData(accountAddress)),
12 | requestTokenBalance: requestCollateralTokenBalance,
13 | openModal: modalName => dispatch => dispatch(openModal({ modalName })),
14 | initUport: () => dispatch => dispatch(initProviders({ providers: [WALLET_PROVIDER.UPORT] })),
15 | }
16 |
--------------------------------------------------------------------------------
/src/store/models/trade/index.js:
--------------------------------------------------------------------------------
1 | import { Record } from 'immutable'
2 |
3 | export const ORDER_TYPE_BUY = 'BUY'
4 | export const ORDER_TYPE_SELL = 'SELL'
5 |
6 | const TradeRecord = Record({
7 | id: undefined, // string
8 | date: undefined, // moment
9 | owner: undefined, // string
10 | price: undefined, // string (Decimal)
11 | eventAddress: undefined, // string
12 | collateralTokenAddress: undefined, // string
13 | orderType: undefined, // string oneOf 'BUY', 'SELL'
14 | marketType: undefined, // string
15 | marketTitle: undefined, // string
16 | marketResolution: undefined, // moment
17 | marketOutcomes: undefined, // List
13 | {isLoading ?
15 | )
16 |
17 | Category.propTypes = {
18 | children: PropTypes.node.isRequired,
19 | className: PropTypes.oneOfType([PropTypes.string, PropTypes.array]),
20 | isLoading: PropTypes.bool,
21 | }
22 |
23 | Category.defaultProps = {
24 | className: '',
25 | isLoading: false,
26 | }
27 |
28 | export default Category
29 |
--------------------------------------------------------------------------------
/src/components/Root/index.js:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import { I18nextProvider } from 'react-i18next'
3 | import { BrowserRouter } from 'react-router-dom'
4 | import { hot } from 'react-hot-loader'
5 | import BackdropProvider from 'containers/BackdropProvider'
6 | import AppContainer from 'containers/App'
7 | import store from 'store'
8 | import { Provider } from 'react-redux'
9 | import AppRouter from 'routes'
10 | import i18n from 'i18n'
11 |
12 | const RootComponent = () => (
13 |
12 |
22 | )
23 |
24 | Title.propTypes = {
25 | t: PropTypes.func.isRequired,
26 | }
27 |
28 | export default withNamespaces()(Title)
29 |
--------------------------------------------------------------------------------
/src/store/models/market/scalar.js:
--------------------------------------------------------------------------------
1 | import { Record } from 'immutable'
2 | import { OUTCOME_TYPES } from 'utils/constants'
3 |
4 | const ScalarMarketRecord = Record({
5 | type: OUTCOME_TYPES.SCALAR,
6 | address: undefined,
7 | title: undefined, // string
8 | description: undefined, // string
9 | resolution: undefined, // moment
10 | volume: undefined, // decimal
11 | bounds: undefined, // BoundRecord
12 | eventAddress: undefined, // string
13 | winningOutcome: undefined, // int
14 | funding: undefined, // int
15 | creation: undefined, // moment
16 | stage: undefined,
17 | fee: undefined, // int
18 | resolved: undefined, // boolean
19 | closed: undefined, // boolean
20 | creator: undefined, // string
21 | collateralToken: undefined, // string
22 | outcomeTokensSold: undefined, // List
13 |
21 |
14 |
20 |
15 |
19 |
16 |
18 | {t('header.dashboard')}
17 |
22 | {children}
23 |
24 | )
25 | }
26 | }
27 |
28 | Block.propTypes = {
29 | width: PropTypes.string,
30 | margin: PropTypes.string,
31 | center: PropTypes.bool,
32 | children: PropTypes.node,
33 | className: PropTypes.string,
34 | }
35 |
36 | export default Block
37 |
--------------------------------------------------------------------------------
/src/routes/MarketList/components/Markets/Market/MarketTrading.js:
--------------------------------------------------------------------------------
1 | import CurrencyName from 'components/CurrencyName'
2 | import PropTypes from 'prop-types'
3 | import React from 'react'
4 | import classNames from 'classnames/bind'
5 | import { hexWithPrefix } from 'utils/helpers'
6 |
7 | import Icon from 'components/Icon'
8 |
9 | import css from './Market.scss'
10 |
11 | const cx = classNames.bind(css)
12 |
13 | const MarketTrading = ({ volume, collateralToken }) => (
14 |
15 |
20 | )
21 |
22 | MarketTrading.propTypes = {
23 | volume: PropTypes.string.isRequired,
24 | collateralToken: PropTypes.string.isRequired,
25 | }
26 |
27 | export default MarketTrading
28 |
--------------------------------------------------------------------------------
/src/store/models/market/categorical.js:
--------------------------------------------------------------------------------
1 | import { Record } from 'immutable'
2 | import { OUTCOME_TYPES } from 'utils/constants'
3 |
4 | const CategoricalMarketRecord = Record({
5 | type: OUTCOME_TYPES.CATEGORICAL,
6 | address: undefined,
7 | title: undefined, // string
8 | description: undefined, // string
9 | resolution: undefined, // moment
10 | volume: undefined, // decimal
11 | outcomes: undefined, // List
17 | {volume} {collateralToken &&
19 |
8 |
13 | )
14 |
15 | TrendingOutcomeScalar.propTypes = {
16 | predictedValue: PropTypes.instanceOf(Decimal),
17 | unit: PropTypes.string,
18 | decimals: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
19 | }
20 |
21 | TrendingOutcomeScalar.defaultProps = {
22 | predictedValue: Decimal(0),
23 | unit: '',
24 | decimals: 0,
25 | }
26 |
27 | export default TrendingOutcomeScalar
28 |
--------------------------------------------------------------------------------
/src/routes/MarketDetails/components/ExpandableViews/MarketMyTrades/marketMyTrades.scss:
--------------------------------------------------------------------------------
1 | @import '~style/vars.scss';
2 |
3 | $indexWidth: 36px;
4 | $groupWidth: 20%;
5 |
6 | .marketMyTrades {
7 | .shareTable {
8 | margin-top: 20px;
9 | table-layout: fixed;
10 | }
11 |
12 | .shareTableRow {
13 | vertical-align: middle;
14 |
15 | td {
16 | vertical-align: middle !important;
17 | border-top: 1px solid #ddd;
18 |
19 | &:first-of-type {
20 | border-top: 0;
21 | }
22 | }
23 | }
24 | }
25 |
26 | .shareOutcomeColor {
27 | display: inline-block;
28 | vertical-align: middle;
29 |
30 | width: 20px;
31 | height: 20px;
32 |
33 | border-radius: 4px;
34 | }
35 |
36 | .tableHeading {
37 | &.first {
38 | width: 36px;
39 | }
40 |
41 | font-weight: 400;
42 | text-transform: uppercase;
43 | color: #a3adb3;
44 | border-bottom: none !important;
45 | }
46 |
--------------------------------------------------------------------------------
/src/routes/Transactions/components/Transactions/Transaction/DetailLabel/index.js:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import PropTypes from 'prop-types'
3 | import cn from 'classnames/bind'
4 | import moment from 'moment'
5 | import { RESOLUTION_TIME } from 'utils/constants'
6 | import style from './DetailLabel.scss'
7 |
8 | const cx = cn.bind(style)
9 |
10 | const DetailLabel = ({ label, date, children }) => (
11 |
9 |
12 |
12 |
15 | )
16 |
17 | DetailLabel.propTypes = {
18 | label: PropTypes.string,
19 | date: PropTypes.string,
20 | children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]),
21 | }
22 |
23 | DetailLabel.defaultProps = {
24 | label: ,
25 | date: undefined,
26 | children: undefined,
27 | }
28 |
29 | export default DetailLabel
30 |
--------------------------------------------------------------------------------
/src/routes/Transactions/containers/TransactionsPage/index.js:
--------------------------------------------------------------------------------
1 | import { connect } from 'react-redux'
2 | import { withRouter } from 'react-router-dom'
3 | import { compose, withProps } from 'recompose'
4 |
5 | import { getRunningTransactions, getCompletedTransactions } from 'routes/Transactions/store/selectors/transactions'
6 | import { getCurrentAccount } from 'integrations/store/selectors'
7 | import Transactions from '../../components/Transactions'
8 |
9 | const mapStateToProps = state => ({
10 | currentAccount: getCurrentAccount(state),
11 | runningTransactions: getRunningTransactions(state),
12 | completedTransactions: getCompletedTransactions(state),
13 | })
14 |
15 | const enhancer = compose(
16 | withRouter,
17 | withProps(({ history }) => ({
18 | changeUrl: url => history.push(url),
19 | })),
20 | connect(
21 | mapStateToProps,
22 | ),
23 | )
24 |
25 | export default enhancer(Transactions)
26 |
--------------------------------------------------------------------------------
/src/routes/Scoreboard/components/Layout.stories.js:
--------------------------------------------------------------------------------
1 | import { text } from '@storybook/addon-knobs'
2 | import { storiesOf } from '@storybook/react'
3 | import * as React from 'react'
4 | import users from 'stories/knobs/scoreboardUsers'
5 | import { host } from 'storybook-host'
6 | import Layout from './Layout'
7 |
8 | storiesOf('Route ScoreBoard', module)
9 | .addDecorator(host({
10 | title: 'ScoreBoard ',
11 | align: 'center',
12 | height: 720,
13 | }))
14 | .add('Account in the first 10 positions ', () => {
15 | const data = users
16 | const myWallet = text('User account', '0x90F8bf6A479f320ead074411a4B0e7944Ea8ca007')
17 |
18 | return (
19 | {label}
13 | {children || moment(date).format(RESOLUTION_TIME.ABSOLUTE_FORMAT)}
14 | 17 | {children} 18 |
19 | ) 20 | } 21 | 22 | TextInputAdornment.propTypes = { 23 | children: PropTypes.node, 24 | position: PropTypes.oneOf(['end', 'start']), 25 | // eslint-disable-next-line 26 | style: PropTypes.object, 27 | } 28 | 29 | TextInputAdornment.defaultProps = { 30 | children: undefined, 31 | position: undefined, 32 | style: {}, 33 | } 34 | 35 | export default TextInputAdornment 36 | -------------------------------------------------------------------------------- /src/api/market.js: -------------------------------------------------------------------------------- 1 | import Gnosis from '@gnosis.pm/pm-js/' 2 | import { OUTCOME_TYPES } from 'utils/constants' 3 | import { getGnosisConnection } from 'api' 4 | 5 | export const resolveEvent = async (event, selectedOutcomeIndex) => { 6 | const gnosis = await getGnosisConnection() 7 | 8 | await gnosis.resolveEvent({ event: event.address, outcome: parseInt(selectedOutcomeIndex, 10) }) 9 | } 10 | 11 | export const redeemWinnings = async (eventType, eventAddress) => { 12 | const gnosis = await getGnosisConnection() 13 | 14 | const eventContract = eventType === OUTCOME_TYPES.CATEGORICAL 15 | ? await gnosis.contracts.CategoricalEvent.at(eventAddress) 16 | : await gnosis.contracts.ScalarEvent.at(eventAddress) 17 | 18 | if (eventContract) { 19 | return Gnosis.requireEventFromTXResult(await eventContract.redeemWinnings(), 'WinningsRedemption') 20 | } 21 | throw new Error("Invalid Event - can't find the specified Event, invalid Eventtype?") 22 | } 23 | -------------------------------------------------------------------------------- /src/utils/analytics/google/index.js: -------------------------------------------------------------------------------- 1 | /* globals ga */ 2 | import { getThirdPartyConfig } from 'utils/features' 3 | 4 | export const THIRD_PARTY_ID = 'googleAnalytics' 5 | 6 | const { id } = getThirdPartyConfig(THIRD_PARTY_ID) 7 | 8 | const GOOGLE_ANALYTICS_URL = 'https://www.google-analytics.com/analytics.js' 9 | 10 | export const ga = (...args) => (window.ga && window.ga.q && window.ga.q(...args)) 11 | || (window.ga && window.ga(...args)) 12 | || (() => {})(...args) // no-op 13 | 14 | const loadGoogleAnalytics = () => new Promise((resolve) => { 15 | const script = document.createElement('script') 16 | script.src = GOOGLE_ANALYTICS_URL 17 | script.type = 'text/javascript' 18 | 19 | document.head.appendChild(script) 20 | 21 | script.onload = () => { 22 | ga('create', id, 'auto') 23 | ga('send', 'pageview') 24 | 25 | resolve() 26 | } 27 | }) 28 | 29 | export const gaSend = (...args) => ga(id, ...args) 30 | 31 | export default loadGoogleAnalytics 32 | -------------------------------------------------------------------------------- /src/setup.js: -------------------------------------------------------------------------------- 1 | import moment from 'moment' 2 | import momentDurationFormatSetup from 'moment-duration-format' 3 | 4 | export const setMomentRelativeTime = () => { 5 | moment.updateLocale('en', { 6 | relativeTime: { 7 | future: '%s', 8 | past: '%s ago', 9 | s: '< 59s', 10 | ss: '> %d s', 11 | m: '< 59m', 12 | mm: '> %d m', 13 | h: '< 1h', 14 | hh: '> %d h', 15 | d: '< 1d', 16 | dd: '< %d d', 17 | M: 'a month', 18 | MM: '%d months', 19 | y: 'a year', 20 | yy: '%d years', 21 | }, 22 | }) 23 | 24 | // Set new thresholds 25 | moment.relativeTimeThreshold('ss', 3) 26 | moment.relativeTimeThreshold('s', 59) 27 | moment.relativeTimeThreshold('m', 59) 28 | moment.relativeTimeThreshold('h', 20) 29 | moment.relativeTimeThreshold('d', 25) 30 | moment.relativeTimeThreshold('M', 10) 31 | } 32 | 33 | export const setMomentDurationFormat = () => { 34 | momentDurationFormatSetup(moment) 35 | } 36 | -------------------------------------------------------------------------------- /src/routes/MarketList/components/MarketStats/MarketStats.scss: -------------------------------------------------------------------------------- 1 | @import '~style/vars.scss'; 2 | 3 | .marketStats { 4 | width: 100%; 5 | margin-bottom: 96px; 6 | 7 | .inner { 8 | width: 100%; 9 | max-width: 100%; 10 | display: flex; 11 | flex-flow: row wrap; 12 | justify-content: space-between; 13 | 14 | @media (max-width: $screen-sm) { 15 | flex-direction: column; 16 | align-items: baseline; 17 | } 18 | 19 | .stat { 20 | margin-bottom: 12px; 21 | width: auto; 22 | 23 | .content { 24 | margin-left: 20px; 25 | float: left; 26 | } 27 | 28 | .value { 29 | font-size: 28px; 30 | font-weight: 300; 31 | letter-spacing: 1px; 32 | } 33 | 34 | .label { 35 | color: $font-color-light; 36 | opacity: .6; 37 | text-transform: uppercase; 38 | font-size: 10px; 39 | letter-spacing: .5px; 40 | } 41 | } 42 | } 43 | 44 | } -------------------------------------------------------------------------------- /src/routes/Dashboard/components/Dashboard/Markets/Category.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import PropTypes from 'prop-types' 3 | import classnames from 'classnames/bind' 4 | 5 | import { marketRecordListShape } from 'utils/shapes' 6 | import ConditionalList from './ConditionalList' 7 | 8 | import style from './Category.scss' 9 | 10 | const cx = classnames.bind(style) 11 | 12 | const Category = ({ 13 | markets, title, viewMarket, component: MarketComponent, 14 | }) => ( 15 |
16 |
19 | )
20 |
21 | Category.propTypes = {
22 | title: PropTypes.string.isRequired,
23 | viewMarket: PropTypes.func.isRequired,
24 | component: PropTypes.func.isRequired,
25 | markets: marketRecordListShape,
26 | }
27 |
28 | Category.defaultProps = {
29 | markets: undefined,
30 | }
31 |
32 | export default Category
33 |
--------------------------------------------------------------------------------
/src/utils/analytics/index.js:
--------------------------------------------------------------------------------
1 | import { isThirdPartyIntegrationEnabled, getThirdPartyConfig } from 'utils/features'
2 |
3 | import loadGoogleAnalytics, { THIRD_PARTY_ID as GOOGLE_ANALYTICS } from './google'
4 | import loadIntercom, { THIRD_PARTY_ID as INTERCOM } from './intercom'
5 |
6 | export const THIRD_PARTY_INTEGRATIONS = {
7 | [GOOGLE_ANALYTICS]: loadGoogleAnalytics,
8 | [INTERCOM]: loadIntercom,
9 | }
10 |
11 | const initAnalytics = () => {
12 | Object.keys(THIRD_PARTY_INTEGRATIONS).forEach((THIRD_PARTY_ID) => {
13 | if (isThirdPartyIntegrationEnabled(THIRD_PARTY_ID)) {
14 | const init = THIRD_PARTY_INTEGRATIONS[THIRD_PARTY_ID]
15 | const thirdPartyConfig = getThirdPartyConfig(THIRD_PARTY_ID)
16 |
17 | // console.info(`Loading third party: ${THIRD_PARTY_ID}`)
18 | init(thirdPartyConfig).then(() => {
19 | // console.info(`Finished loading third party: ${THIRD_PARTY_ID}`)
20 | })
21 | }
22 | })
23 | }
24 |
25 | export default initAnalytics
26 |
--------------------------------------------------------------------------------
/src/store/reducers/notifications/index.js:
--------------------------------------------------------------------------------
1 | import { handleActions } from 'redux-actions'
2 | import { Map, List } from 'immutable'
3 | import { showNotification, fadeOutNotification, hideAllNotifications } from 'store/actions/notifications'
4 | import NotificationRecord from 'store/reducers/notifications/models/notification'
5 |
6 | const reducer = handleActions(
7 | {
8 | [showNotification]: (state, action) =>
9 | state.withMutations((stateMap) => {
10 | stateMap.update('currentVisible', value => value.push(action.payload.id))
11 | stateMap.setIn(['log', action.payload.id], new NotificationRecord(action.payload))
12 | }),
13 | [fadeOutNotification]: (state, action) =>
14 | state.update('currentVisible', value => value.filter(id => id !== action.payload.id)),
15 | [hideAllNotifications]: state => state.set('currentVisible', List()),
16 | },
17 | Map({
18 | log: Map(),
19 | currentVisible: List(),
20 | }),
21 | )
22 |
23 | export default reducer
24 |
--------------------------------------------------------------------------------
/src/assets/img/icons/icon_winningOutcome.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
--------------------------------------------------------------------------------
/src/components/Header/Layouts/MobileHeader/AccountOverview/AccountOverview.scss:
--------------------------------------------------------------------------------
1 | .overviewContainer {
2 | text-align: center;
3 | margin-bottom: 30px;
4 |
5 | .identicon {
6 | width: 90px;
7 | height: 90px;
8 |
9 | border-radius: 50%;
10 | border: 1px solid white;
11 | }
12 |
13 | .networkBalanceWrapper {
14 | display: flex;
15 | margin-bottom: 10px;
16 |
17 | & > div {
18 | line-height: 1;
19 | margin-top: -1px;
20 | }
21 |
22 | span {
23 | font-size: 15px;
24 | font-weight: bold;
25 | }
26 |
27 | .network {
28 | margin-right: auto;
29 | }
30 | }
31 |
32 | .addressWrapper {
33 | margin-top: 10px;
34 | .address {
35 | padding: 0;
36 | border: 0;
37 | background: transparent;
38 | color: #b8b7ad;
39 | font-size: 16px;
40 |
41 | &:focus,
42 | &:hover {
43 | color: darken($color: #b8b7ad, $amount: 20);
44 | outline: 0;
45 | }
46 | }
47 | }
48 | }
49 |
--------------------------------------------------------------------------------
/src/routes/MarketDetails/store/actions/requestGasCost.js:
--------------------------------------------------------------------------------
1 | import { GAS_COST } from 'utils/constants'
2 | import { createAction } from 'redux-actions'
3 | import { calcBuySharesGasCost, calcSellSharesGasCost, calcRedeemWinningsGasCost } from '../../api'
4 |
5 | const setGasCost = createAction('SET_GAS_COST')
6 |
7 | const requestGasCost = (contractType, opts) => async (dispatch) => {
8 | if (contractType === GAS_COST.BUY_SHARES) {
9 | const gasCost = await calcBuySharesGasCost()
10 | dispatch(setGasCost({ entityType: 'gasCosts', contractType, gasCost }))
11 | } else if (contractType === GAS_COST.SELL_SHARES) {
12 | const gasCost = await calcSellSharesGasCost()
13 | dispatch(setGasCost({ entityType: 'gasCosts', contractType, gasCost }))
14 | } else if (contractType === GAS_COST.REDEEM_WINNINGS) {
15 | const gasCost = await calcRedeemWinningsGasCost(opts)
16 | dispatch(setGasCost({ entityType: 'gasCosts', contractType, gasCost }))
17 | }
18 | }
19 |
20 | export { requestGasCost, setGasCost }
21 |
--------------------------------------------------------------------------------
/src/routes/Scoreboard/components/RewardClaimAddress/RewardClaim.scss:
--------------------------------------------------------------------------------
1 | @import '~style/vars.scss';
2 |
3 | .rewardClaim {
4 | width: 350px;
5 | height: 110px;
6 | border-radius: 2px;
7 | background-color: #ffffff;
8 | box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.11);
9 | word-break: break-all;
10 | margin-bottom: 20px;
11 |
12 | display: flex;
13 |
14 | @media (max-width: $screen-sm) {
15 | width: 100%;
16 | }
17 |
18 | .iconSection {
19 | background-color: #f0f1f1;
20 | width: 60px;
21 | flex-shrink: 0;
22 | flex-grow: 0;
23 |
24 | display: flex;
25 | justify-content: center;
26 | align-items: center;
27 | }
28 |
29 | p {
30 | font-size: 14px;
31 | margin: 0;
32 | }
33 |
34 | .loadingSection {
35 | display: flex;
36 | justify-content: center;
37 | align-items: center;
38 | width: 100%;
39 | height: 118px;
40 | }
41 |
42 | a,
43 | a:link,
44 | a:visited {
45 | color: #00a6c4;
46 | text-decoration: underline;
47 | }
48 | }
49 |
--------------------------------------------------------------------------------
/src/store/utils/marketStatus.js:
--------------------------------------------------------------------------------
1 | import moment from 'moment'
2 | import { MARKET_STAGES } from 'store/models'
3 |
4 | export const isMarketClosed = ({ stage, resolution }) => {
5 | const stageClosed = stage !== MARKET_STAGES.MARKET_FUNDED
6 | const marketExpired = moment.utc(resolution).isBefore(moment.utc())
7 |
8 | const marketClosed = stageClosed || marketExpired
9 | return marketClosed
10 | }
11 |
12 | export const isMarketEndingSoon = (resolutionDate) => {
13 | const threeDays = moment.utc().add(3, 'days')
14 | return moment.utc(resolutionDate).isSameOrBefore(threeDays)
15 | }
16 |
17 | export const isNewMarket = (creation) => {
18 | const threeDaysAgo = moment.utc().subtract(3, 'days')
19 |
20 | return threeDaysAgo.isBefore(creation)
21 | }
22 |
23 | export const isMarketResolved = ({ resolved }) => resolved
24 |
25 | export const isMarketClosedOrResolved = market => isMarketClosed(market) || isMarketResolved(market)
26 |
27 | export const isMarketFunded = stage => stage > MARKET_STAGES.MARKET_CREATED
28 |
--------------------------------------------------------------------------------
/src/store/middlewares/Storage/Load.js:
--------------------------------------------------------------------------------
1 | import * as actions from './actions'
2 | import { NOOP_MIDDLEWARE, STORAGE_KEY } from './constants'
3 |
4 | const middleware = (storage) => {
5 | const storageIsValid = storage instanceof Storage
6 |
7 | if (!storageIsValid) {
8 | console.warn('StorageLoader: Storage is either not supported or invalid')
9 | return NOOP_MIDDLEWARE
10 | }
11 |
12 | return store => next => (action) => {
13 | const { type } = action
14 | if (type === 'INIT') {
15 | const stringPayload = storage.getItem(STORAGE_KEY)
16 | if (stringPayload) {
17 | let payload
18 | try {
19 | const decoded = Buffer.from(stringPayload, 'base64').toString('ascii')
20 | payload = JSON.parse(decoded)
21 | store.dispatch(actions.loadStorage(payload))
22 | } catch (e) {
23 | console.error('Could not load saved storage: ', e)
24 | }
25 | }
26 | }
27 |
28 | next(action)
29 | }
30 | }
31 |
32 | export default middleware
33 |
--------------------------------------------------------------------------------
/src/routes/MarketDetails/components/MarketDetail/Details/RedeemWinnings/RedeemWinnings.scss:
--------------------------------------------------------------------------------
1 | @import '~style/vars.scss';
2 |
3 | .redeemWinning {
4 | display: flex;
5 | flex-direction: column;
6 | max-width: 267px;
7 | margin: 20px 0;
8 |
9 | .detailsContainer {
10 | display: flex;
11 | align-items: center;
12 |
13 | .details {
14 | padding-left: 10px;
15 | }
16 |
17 | .heading {
18 | font-size: 30px;
19 | }
20 |
21 | .label {
22 | text-transform: uppercase;
23 | color: $font-color-muted;
24 | font-size: 10px;
25 | font-weight: 500;
26 | letter-spacing: 0.5px;
27 | }
28 | }
29 |
30 | .action {
31 | text-align: center;
32 | margin-top: 20px;
33 | .redeemButton {
34 | padding: 10px;
35 | height: auto;
36 | width: 100%;
37 | text-align: center;
38 | line-height: 1;
39 | }
40 | }
41 |
42 | .gasCost {
43 | margin-top: 5px;
44 | display: inline-block;
45 | color: $font-color-muted;
46 | }
47 | }
48 |
--------------------------------------------------------------------------------
/src/routes/MarketDetails/store/selectors/getMarketShares.js:
--------------------------------------------------------------------------------
1 | import { getCurrentAccount } from 'integrations/store/selectors'
2 | import Decimal from 'decimal.js'
3 | import { createSelector } from 'reselect'
4 | import { sharesWithMarketsSelector } from 'store/selectors/account/shares'
5 | import { hexWithoutPrefix } from 'utils/helpers'
6 | import { calcShareWinnings } from 'routes/Dashboard/containers/Dashboard/utils'
7 |
8 | const getMarketShares = marketAddress => createSelector(sharesWithMarketsSelector, getCurrentAccount, (shares, account) => shares
9 | .filter(
10 | share => Decimal(share.balance).gt(0)
11 | && share.owner === hexWithoutPrefix(account)
12 | && share.market?.address === marketAddress,
13 | )
14 | .map((share) => {
15 | let shareWinnings = '0'
16 |
17 | if (share.market.resolved) {
18 | shareWinnings = calcShareWinnings(share, share.market)
19 | }
20 |
21 | return share.set('winnings', shareWinnings)
22 | })
23 | .toList())
24 |
25 | export default getMarketShares
26 |
--------------------------------------------------------------------------------
/src/routes/MarketDetails/components/ExpandableViews/MarketMyTrades/TableHeader/index.js:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import cn from 'classnames/bind'
3 | import PropTypes from 'prop-types'
4 | import { withNamespaces } from 'react-i18next'
5 | import style from '../marketMyTrades.scss'
6 |
7 | const cx = cn.bind(style)
8 |
9 | const TableHeader = ({ t }) => (
10 |
11 | {title}
17 | {t('verification.errors.not_loaded')}
15 | 16 |{t('verification.errors.not_found')}
17 | 18 | ) 19 | 20 | const ModalVerification = props => ( 21 |
22 |
24 | )
25 |
26 | ModalVerification.propTypes = {
27 | closeModal: PropTypes.func.isRequired,
28 | t: PropTypes.func.isRequired,
29 | }
30 |
31 | export default withNamespaces()(ModalVerification)
32 |
--------------------------------------------------------------------------------
/src/routes/Dashboard/assets/crystal-ball.svg:
--------------------------------------------------------------------------------
1 |
8 |
--------------------------------------------------------------------------------
/src/store/reducers/modal.js:
--------------------------------------------------------------------------------
1 | import { handleActions } from 'redux-actions'
2 | import { Map, List, fromJS } from 'immutable'
3 |
4 | import { loadStorage } from 'store/middlewares/Storage'
5 | import { openModal, closeModal } from 'store/actions/modal'
6 |
7 | const reducer = handleActions(
8 | {
9 | [openModal]: (state, { payload: { modalName: currentModal, modalData = {} } }) => state.withMutations((stateMap) => {
10 | stateMap.set('isOpen', true)
11 | stateMap.set('currentModal', currentModal)
12 | stateMap.set('modalData', fromJS(modalData))
13 | }),
14 | [closeModal]: () => Map({
15 | isOpen: false,
16 | currentModal: undefined,
17 | transactions: List(),
18 | }),
19 | [loadStorage]: (state, { payload: { modal } }) => {
20 | if (modal) {
21 | return state.merge(fromJS(modal))
22 | }
23 |
24 | return state
25 | },
26 | },
27 | Map({
28 | isOpen: false,
29 | currentModal: undefined,
30 | modalData: Map(),
31 | }),
32 | )
33 |
34 | export default reducer
35 |
--------------------------------------------------------------------------------
/src/assets/img/badges/crystal-gazer.svg:
--------------------------------------------------------------------------------
1 |
8 |
--------------------------------------------------------------------------------
/src/routes/MarketDetails/components/MarketDetail/Details/MarketTimer/MarketTimer.scss:
--------------------------------------------------------------------------------
1 | @import '~style/vars.scss';
2 |
3 | .marketTimer {
4 | margin-top: 12px;
5 | margin-bottom: 12px;
6 |
7 | .marketTimerLive {
8 | font-size: 22px;
9 | font-weight: 300;
10 | letter-spacing: 1px;
11 | line-height: 1.2;
12 | @media (min-width: $screen-sm) {
13 | font-size: 28px;
14 | }
15 |
16 | &.big {
17 | font-size: 24px;
18 | }
19 |
20 | .timerLabel {
21 | color: $font-color-muted;
22 | font-size: 18px;
23 | text-transform: uppercase;
24 | }
25 | }
26 |
27 | .marketStatus {
28 | margin-top: 20px;
29 | font-size: 22px;
30 | font-weight: 300;
31 | letter-spacing: 1px;
32 | line-height: 1.2;
33 | @media (min-width: $screen-sm) {
34 | font-size: 28px;
35 | }
36 | }
37 |
38 | .marketTimeAbsolute {
39 | color: $font-color-light;
40 | opacity: 0.6;
41 | font-size: 10px;
42 | text-transform: uppercase;
43 | letter-spacing: 0.5px;
44 | }
45 | }
46 |
--------------------------------------------------------------------------------
/src/store/selectors/account/trades.js:
--------------------------------------------------------------------------------
1 | import { List } from 'immutable'
2 | import { createSelector } from 'reselect'
3 | import { getCollateralToken } from 'store/selectors/blockchain'
4 | import { normalizeHex } from 'utils/helpers'
5 |
6 | const tradesWithMarketsSelector = createSelector(
7 | state => state.marketList,
8 | state => state.accountTrades,
9 | (marketList, marketTrades) => marketTrades.map((marketTrade) => {
10 | const tradesMarket = marketList.find(
11 | market => normalizeHex(market.eventAddress) === normalizeHex(marketTrade.eventAddress),
12 | )
13 | return marketTrade.set('market', tradesMarket)
14 | }),
15 | )
16 |
17 | const tradeSelector = createSelector(tradesWithMarketsSelector, getCollateralToken, (trades, collateralToken) => List(
18 | trades
19 | .filter(trade => typeof trade.market !== 'undefined' && trade.collateralTokenAddress === collateralToken.address)
20 | .sortBy(trade => trade.date, (dateA, dateB) => (dateA.isBefore(dateB) ? 1 : -1))
21 | .values(),
22 | ))
23 |
24 | export default tradeSelector
25 |
--------------------------------------------------------------------------------
/src/assets/verification/onfido/id-type-id.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/components/ModalContent/TransactionsExplanation/index.js:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import PropTypes from 'prop-types'
3 | import { withNamespaces } from 'react-i18next'
4 | import cn from 'classnames/bind'
5 | import style from './TransactionExplanation.scss'
6 |
7 | const cx = cn.bind(style)
8 |
9 | const TransactionsExplanation = ({ transactions, closeModal, t }) => (
10 |
11 |
19 | )
20 |
21 | TransactionsExplanation.propTypes = {
22 | transactions: PropTypes.arrayOf(PropTypes.string).isRequired,
23 | closeModal: PropTypes.func.isRequired,
24 | t: PropTypes.func.isRequired,
25 | }
26 |
27 | export default withNamespaces()(TransactionsExplanation)
28 |
--------------------------------------------------------------------------------
/src/routes/Dashboard/assets/badges/crystal-gazer.svg:
--------------------------------------------------------------------------------
1 |
8 |
--------------------------------------------------------------------------------
/src/containers/LegalCompliance/components/DocumentExplanation.js:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import PropTypes from 'prop-types'
3 |
4 | const TOS_DOCUMENT = 'TOS_DOCUMENT'
5 | const TOS_TEXT = 'TOS_TEXT'
6 |
7 | const DOCUMENT_TYPES = {
8 | FILE: TOS_DOCUMENT,
9 | TEXT: TOS_TEXT,
10 | }
11 |
12 | const LegalDocumentTitle = ({
13 | type, file, id, t,
14 | }) => {
15 | if (type === DOCUMENT_TYPES.FILE) {
16 | return (
17 |
18 |
19 | {t(`legal.documents.${id}`)}
20 |
21 |
22 | )
23 | }
24 | if (type === DOCUMENT_TYPES.TEXT) {
25 | return {t(`legal.documents.${id}_short`)}
26 | }
27 |
28 | return null
29 | }
30 |
31 | LegalDocumentTitle.propTypes = {
32 | type: PropTypes.string.isRequired,
33 | id: PropTypes.string.isRequired,
34 | t: PropTypes.func.isRequired,
35 | file: PropTypes.string,
36 | }
37 |
38 | LegalDocumentTitle.defaultProps = {
39 | file: '',
40 | }
41 |
42 | export default LegalDocumentTitle
43 |
--------------------------------------------------------------------------------
/src/routes/Transactions/store/selectors/transactions.spec.js:
--------------------------------------------------------------------------------
1 | import { transactionSelector } from 'routes/Transactions/store/selectors/transactions'
2 | import { Map } from 'immutable'
3 |
4 | // import { TRANSACTION_STATUS, TRANSACTION_COMPLETE_STATUS } from 'utils/constants'
5 |
6 | describe('transactionsSelector', () => {
7 | test('it should return a transaction object', () => {
8 | const state = {
9 | transactions: Map({
10 | log: Map({
11 | test123: {
12 | id: 'test123',
13 | },
14 | }),
15 | }),
16 | }
17 |
18 | expect(transactionSelector(state, 'test123')).toMatchObject(state.transactions.getIn(['log', 'test123']))
19 | })
20 |
21 | test('it should return an empty object for an invalid transaction id', () => {
22 | const state = {
23 | transactions: Map({
24 | log: {
25 | test123: {
26 | id: 'test123',
27 | },
28 | },
29 | }),
30 | }
31 |
32 | expect(transactionSelector(state, 'test123')).toMatchObject({})
33 | })
34 | })
35 |
--------------------------------------------------------------------------------
/src/routes/GameGuide/components/uPortComponents/SignUp/index.js:
--------------------------------------------------------------------------------
1 | import * as React from 'react'
2 | import Block from 'components/layout/Block'
3 | import Subtitle from 'components/layout/Subtitle'
4 | import Paragraph from 'components/layout/Paragraph'
5 |
6 | const SignUp = () => (
7 | 12 |
13 | uPort is a secure, easy-to-use system for self-sovereign identity, built on Ethereum. uPort identities are fully 14 | owned and controlled by the creator, and don't rely on centralized third-parties for creation or validation. 15 | Via uPort, you can own and control your personal identity; securely and selectively disclose your data to 16 | counterparties, and interact with decentralized applications and smart contracts such as Gnosis. 17 |
17 | { children } 18 |
19 | ) 20 | } 21 | } 22 | 23 | Paragraph.propTypes = { 24 | size: PropTypes.oneOf(['normal', 'small']), 25 | nomargin: PropTypes.bool, 26 | center: PropTypes.bool, 27 | color: PropTypes.oneOf(['soft', 'medium', 'dark', 'primary']), 28 | children: PropTypes.node, 29 | } 30 | 31 | Paragraph.defaultProps = { 32 | size: 'normal', 33 | center: false, 34 | color: undefined, 35 | children: undefined, 36 | nomargin: false, 37 | } 38 | 39 | export default Paragraph 40 | -------------------------------------------------------------------------------- /src/routes/Scoreboard/containers/selector.js: -------------------------------------------------------------------------------- 1 | import { createSelector, createStructuredSelector } from 'reselect' 2 | import { getCurrentAccount, getRegisteredMainnetAddress } from 'integrations/store/selectors' 3 | import { rankSelector } from 'routes/Scoreboard/store/selectors' 4 | import { hasClaimedReward } from 'containers/Modals/ModalClaimReward/selectors' 5 | import { firstTournamentUsersSelectorAsList, meSelector } from '../store/selectors' 6 | 7 | const usersSelector = createSelector(firstTournamentUsersSelectorAsList, meSelector, (firstUsers, me) => { 8 | if (!me) { 9 | return firstUsers 10 | } 11 | 12 | if (!firstUsers) { 13 | return undefined 14 | } 15 | 16 | const foundUser = firstUsers ? firstUsers.find(user => user.account === me.account) : undefined 17 | const dataTable = foundUser ? firstUsers : firstUsers.push(me) 18 | 19 | return dataTable 20 | }) 21 | 22 | export default createStructuredSelector({ 23 | data: usersSelector, 24 | mainnetAddress: getRegisteredMainnetAddress, 25 | myAccount: getCurrentAccount, 26 | rank: rankSelector, 27 | hasClaimedReward, 28 | }) 29 | -------------------------------------------------------------------------------- /src/components/TransactionFloater/Notifications/Notifications.scss: -------------------------------------------------------------------------------- 1 | @import '~style/vars.scss'; 2 | 3 | @keyframes slideInFromRight { 4 | 0% { 5 | transform: translateX(400px); 6 | } 7 | 8 | 100% { 9 | transform: translateX(0); 10 | } 11 | } 12 | 13 | .notification { 14 | animation: slideInFromRight 1s ease-out 0s 1; 15 | background-color: $bg-color; 16 | 17 | padding: 4px; 18 | width: 100%; 19 | position: relative; 20 | 21 | color: $font-color-dark; 22 | border: none; 23 | 24 | &:hover { 25 | color: $active-highlight; 26 | } 27 | 28 | .notificationHeaderContainer { 29 | display: flex; 30 | align-items: center; 31 | 32 | .iconContainer { 33 | height: 100%; 34 | vertical-align: middle; 35 | margin-left: 4px; 36 | display: inline-block; 37 | } 38 | 39 | .title { 40 | text-transform: uppercase; 41 | font-weight: 500; 42 | margin-bottom: 8px; 43 | color: inherit; 44 | display: inline-block; 45 | } 46 | } 47 | 48 | .message { 49 | color: inherit; 50 | padding-left: 24px; 51 | } 52 | } 53 | -------------------------------------------------------------------------------- /src/components/Header/ProviderIcon.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import PropTypes from 'prop-types' 3 | import Tooltip from 'rc-tooltip' 4 | import { withNamespaces } from 'react-i18next' 5 | 6 | import Icon from 'components/Icon' 7 | 8 | import { providerPropType } from 'utils/shapes' 9 | import { upperFirst } from 'lodash' 10 | 11 | import { WALLET_PROVIDER } from 'integrations/constants' 12 | 13 | const PROVIDER_ICONS = { 14 | ...WALLET_PROVIDER, 15 | [WALLET_PROVIDER.REMOTE]: 'etherTokens', 16 | } 17 | 18 | const providerIconStyle = { 19 | marginLeft: 10, 20 | } 21 | 22 | const ProviderIcon = ({ provider, t }) => ( 23 |
15 | 
16 | {isLoading ? (
17 |
25 | )
26 |
27 | Metric.propTypes = {
28 | src: PropTypes.string.isRequired,
29 | explanation: PropTypes.string,
30 | children: PropTypes.node,
31 | isLoading: PropTypes.bool,
32 | }
33 |
34 | Metric.defaultProps = {
35 | explanation: 'N/A',
36 | children: ,
37 | isLoading: false,
38 | }
39 |
40 | export default Metric
41 |
--------------------------------------------------------------------------------
/src/assets/img/icons/gno_token.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/components/Header/Layouts/MobileHeader/assets/icon_copy.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
41 |
--------------------------------------------------------------------------------
/.eslintrc:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "airbnb",
3 | "parser": "babel-eslint",
4 | "plugins": ["jest"],
5 | "rules": {
6 | "react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"] }],
7 | "react/forbid-prop-types": [1, { "forbid": ["object", "any"] }],
8 | "class-methods-use-this": 0,
9 | "semi": ["error", "never"],
10 | "max-len": [
11 | "error",
12 | 120,
13 | 2,
14 | {
15 | "ignoreUrls": true,
16 | "ignoreComments": false,
17 | "ignoreRegExpLiterals": true,
18 | "ignoreStrings": true,
19 | "ignoreTemplateLiterals": true
20 | }
21 | ],
22 | "import/no-unresolved": 0,
23 | "import/no-extraneous-dependencies": 0,
24 | "import/extensions": 0,
25 | "import/prefer-default-export": 0,
26 | "react/jsx-one-expression-per-line": "off",
27 | "jsx-a11y/label-has-for": 0,
28 | "jsx-a11y/anchor-is-valid": ["error", {
29 | "components": []
30 | }],
31 | "indent": ["error", 2],
32 | "no-console": ["error", { "allow": ["warn", "error"] }]
33 | },
34 | "env": {
35 | "jest/globals": true,
36 | "browser": true
37 | }
38 | }
39 |
--------------------------------------------------------------------------------
/src/integrations/uport/uportNotifications.js:
--------------------------------------------------------------------------------
1 | import { decodeToken } from 'jsontokens'
2 |
3 | export const isValid = (cred) => {
4 | if (cred === null) {
5 | return false
6 | }
7 |
8 | const pushToken = decodeToken(cred.pushToken)
9 | if (!pushToken) {
10 | return false
11 | }
12 |
13 | const expiration = pushToken.payload.exp // When the uPort credential will expire
14 | const oneDay = 24 * 60 * 6 // one day in seconds
15 | const now = new Date() / 1000 // in seconds
16 | const valid = expiration - oneDay > now
17 |
18 | return valid
19 | }
20 |
21 | const assignSessionProps = (uport, cred) => {
22 | /* eslint-disable */
23 | uport.address = cred.address
24 | uport.pushToken = cred.pushToken
25 | uport.publicEncKey = cred.publicEncKey
26 | /* eslint-enable */
27 | }
28 |
29 | const init = async (uport, requestCredentials, getCredential) => {
30 | let credential = getCredential()
31 | if (!isValid(credential)) {
32 | credential = await requestCredentials()
33 | }
34 |
35 | if (credential) {
36 | assignSessionProps(uport, credential)
37 | }
38 |
39 | return uport
40 | }
41 |
42 | export default init
43 |
--------------------------------------------------------------------------------
/src/containers/TransactionFloaterContainer/index.js:
--------------------------------------------------------------------------------
1 | import { connect } from 'react-redux'
2 | import TransactionFloater from 'components/TransactionFloater'
3 | import { showTransactionLog, hideTransactionLog } from 'routes/Transactions/store/actions/transactions'
4 | import {
5 | getRunningTransactions,
6 | getCompletedTransactions,
7 | getRunningTransactionsProgress,
8 | areLogsVisible,
9 | } from 'routes/Transactions/store/selectors/transactions'
10 | import { getVisibleNotifications } from 'store/selectors/notifications'
11 |
12 | const LIMIT_COUNT_RUNNING_TRANSACTIONS = 3
13 | const LIMIT_COUNT_COMPLETED_TRANSACTIONS = 3
14 |
15 | const mapStateToProps = state => ({
16 | runningTransactions: getRunningTransactions(state).takeLast(LIMIT_COUNT_RUNNING_TRANSACTIONS),
17 | completedTransactions: getCompletedTransactions(state).takeLast(LIMIT_COUNT_COMPLETED_TRANSACTIONS),
18 | progress: getRunningTransactionsProgress(state),
19 | notifications: getVisibleNotifications(state),
20 | showLogs: areLogsVisible(state),
21 | })
22 |
23 | export default connect(mapStateToProps, {
24 | showTransactionLog,
25 | hideTransactionLog,
26 | })(TransactionFloater)
27 |
--------------------------------------------------------------------------------
/src/components/Spinner/Transaction.js:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import PropTypes from 'prop-types'
3 | import Icon from 'components/Icon'
4 | import { TRANSACTION_COMPLETE_STATUS } from 'utils/constants'
5 |
6 | import IndefiniteSpinner from './Indefinite'
7 |
8 | const ProgressIndicator = ({ completed, completionStatus, progress }) => {
9 | const iconType = completionStatus === TRANSACTION_COMPLETE_STATUS.NO_ERROR ? 'checkmark' : 'cross'
10 | const iconStyle = {
11 | top: '50%',
12 | marginTop: -24,
13 | }
14 |
15 | return completed ? (
16 |
20 | {children}
21 | {explanation}
22 |
23 | )}
24 |