Merge pull request #6419 from MetaMask/develop
Merge develop into masterfeature/default_network_editable
Thomas Huang
6 years ago
committed by
GitHub
commit
8c98e89e61
@ -1,17 +0,0 @@ |
||||
const MessageManager = require('./lib/message-manager') |
||||
const PersonalMessageManager = require('./lib/personal-message-manager') |
||||
const TypedMessageManager = require('./lib/typed-message-manager') |
||||
|
||||
class UserActionController { |
||||
|
||||
constructor (opts = {}) { |
||||
|
||||
this.messageManager = new MessageManager() |
||||
this.personalMessageManager = new PersonalMessageManager() |
||||
this.typedMessageManager = new TypedMessageManager() |
||||
|
||||
} |
||||
|
||||
} |
||||
|
||||
module.exports = UserActionController |
||||
@ -1,16 +0,0 @@ |
||||
module.exports = createProviderMiddleware |
||||
|
||||
/** |
||||
* Forwards an HTTP request to the current Web3 provider |
||||
* |
||||
* @param {{ provider: Object }} config Configuration containing current Web3 provider |
||||
*/ |
||||
function createProviderMiddleware ({ provider }) { |
||||
return (req, res, next, end) => { |
||||
provider.sendAsync(req, (err, _res) => { |
||||
if (err) return end(err) |
||||
res.result = _res.result |
||||
end() |
||||
}) |
||||
} |
||||
} |
||||
@ -0,0 +1,32 @@ |
||||
// next version number
|
||||
const version = 33 |
||||
|
||||
/* |
||||
|
||||
Cleans up notices and assocated notice controller code |
||||
|
||||
*/ |
||||
|
||||
const clone = require('clone') |
||||
|
||||
module.exports = { |
||||
version, |
||||
|
||||
migrate: async function (originalVersionedData) { |
||||
const versionedData = clone(originalVersionedData) |
||||
versionedData.meta.version = version |
||||
const state = versionedData.data |
||||
const newState = transformState(state) |
||||
versionedData.data = newState |
||||
return versionedData |
||||
}, |
||||
} |
||||
|
||||
function transformState (state) { |
||||
const newState = state |
||||
// transform state here
|
||||
if (state.NoticeController) { |
||||
delete newState.NoticeController |
||||
} |
||||
return newState |
||||
} |
||||
@ -1,112 +0,0 @@ |
||||
const {EventEmitter} = require('events') |
||||
const semver = require('semver') |
||||
const extend = require('xtend') |
||||
const ObservableStore = require('obs-store') |
||||
const hardCodedNotices = require('../../notices/notices.js') |
||||
const uniqBy = require('lodash.uniqby') |
||||
|
||||
module.exports = class NoticeController extends EventEmitter { |
||||
|
||||
constructor (opts = {}) { |
||||
super() |
||||
this.noticePoller = null |
||||
this.firstVersion = opts.firstVersion |
||||
this.version = opts.version |
||||
const initState = extend({ |
||||
noticesList: [], |
||||
}, opts.initState) |
||||
this.store = new ObservableStore(initState) |
||||
// setup memStore
|
||||
this.memStore = new ObservableStore({}) |
||||
this.store.subscribe(() => this._updateMemstore()) |
||||
this._updateMemstore() |
||||
// pull in latest notices
|
||||
this.updateNoticesList() |
||||
} |
||||
|
||||
getNoticesList () { |
||||
return this.store.getState().noticesList |
||||
} |
||||
|
||||
getUnreadNotices () { |
||||
const notices = this.getNoticesList() |
||||
return notices.filter((notice) => notice.read === false) |
||||
} |
||||
|
||||
getNextUnreadNotice () { |
||||
const unreadNotices = this.getUnreadNotices() |
||||
return unreadNotices[0] |
||||
} |
||||
|
||||
async setNoticesList (noticesList) { |
||||
this.store.updateState({ noticesList }) |
||||
return true |
||||
} |
||||
|
||||
markNoticeRead (noticeToMark, cb) { |
||||
cb = cb || function (err) { if (err) throw err } |
||||
try { |
||||
const notices = this.getNoticesList() |
||||
const index = notices.findIndex((currentNotice) => currentNotice.id === noticeToMark.id) |
||||
notices[index].read = true |
||||
notices[index].body = '' |
||||
this.setNoticesList(notices) |
||||
const latestNotice = this.getNextUnreadNotice() |
||||
cb(null, latestNotice) |
||||
} catch (err) { |
||||
cb(err) |
||||
} |
||||
} |
||||
|
||||
markAllNoticesRead () { |
||||
const noticeList = this.getNoticesList() |
||||
noticeList.forEach(notice => { |
||||
notice.read = true |
||||
notice.body = '' |
||||
}) |
||||
this.setNoticesList(noticeList) |
||||
const latestNotice = this.getNextUnreadNotice() |
||||
return latestNotice |
||||
} |
||||
|
||||
|
||||
async updateNoticesList () { |
||||
const newNotices = await this._retrieveNoticeData() |
||||
const oldNotices = this.getNoticesList() |
||||
const combinedNotices = this._mergeNotices(oldNotices, newNotices) |
||||
const filteredNotices = this._filterNotices(combinedNotices) |
||||
const result = this.setNoticesList(filteredNotices) |
||||
this._updateMemstore() |
||||
return result |
||||
} |
||||
|
||||
_mergeNotices (oldNotices, newNotices) { |
||||
return uniqBy(oldNotices.concat(newNotices), 'id') |
||||
} |
||||
|
||||
_filterNotices (notices) { |
||||
return notices.filter((newNotice) => { |
||||
if ('version' in newNotice) { |
||||
const satisfied = semver.satisfies(this.version, newNotice.version) |
||||
return satisfied |
||||
} |
||||
if ('firstVersion' in newNotice) { |
||||
const satisfied = semver.satisfies(this.firstVersion, newNotice.firstVersion) |
||||
return satisfied |
||||
} |
||||
return true |
||||
}) |
||||
} |
||||
|
||||
async _retrieveNoticeData () { |
||||
// Placeholder for remote notice API.
|
||||
return hardCodedNotices |
||||
} |
||||
|
||||
_updateMemstore () { |
||||
const nextUnreadNotice = this.getNextUnreadNotice() |
||||
const noActiveNotices = !nextUnreadNotice |
||||
this.memStore.updateState({ nextUnreadNotice, noActiveNotices }) |
||||
} |
||||
|
||||
} |
||||
@ -1,198 +0,0 @@ |
||||
import React, { Component } from 'react' |
||||
import PropTypes from 'prop-types' |
||||
import classnames from 'classnames' |
||||
import {connect} from 'react-redux' |
||||
import {qrcode} from 'qrcode-generator' |
||||
import copyToClipboard from 'copy-to-clipboard' |
||||
import ShapeShiftForm from '../shapeshift-form' |
||||
import {buyEth, showAccountDetail} from '../../../../ui/app/store/actions' |
||||
|
||||
const OPTION_VALUES = { |
||||
COINBASE: 'coinbase', |
||||
SHAPESHIFT: 'shapeshift', |
||||
QR_CODE: 'qr_code', |
||||
} |
||||
|
||||
const OPTIONS = [ |
||||
{ |
||||
name: 'Direct Deposit', |
||||
value: OPTION_VALUES.QR_CODE, |
||||
}, |
||||
{ |
||||
name: 'Buy with Dollars', |
||||
value: OPTION_VALUES.COINBASE, |
||||
}, |
||||
{ |
||||
name: 'Buy with Cryptos', |
||||
value: OPTION_VALUES.SHAPESHIFT, |
||||
}, |
||||
] |
||||
|
||||
class BuyEtherWidget extends Component { |
||||
|
||||
static propTypes = { |
||||
address: PropTypes.string, |
||||
skipText: PropTypes.string, |
||||
className: PropTypes.string, |
||||
onSkip: PropTypes.func, |
||||
goToCoinbase: PropTypes.func, |
||||
showAccountDetail: PropTypes.func, |
||||
}; |
||||
|
||||
state = { |
||||
selectedOption: OPTION_VALUES.QR_CODE, |
||||
}; |
||||
|
||||
|
||||
copyToClipboard = () => { |
||||
const { address } = this.props |
||||
|
||||
this.setState({ justCopied: true }, () => copyToClipboard(address)) |
||||
|
||||
setTimeout(() => this.setState({ justCopied: false }), 1000) |
||||
} |
||||
|
||||
renderSkip () { |
||||
const {showAccountDetail, address, skipText, onSkip} = this.props |
||||
|
||||
return ( |
||||
<div |
||||
className="buy-ether__do-it-later" |
||||
onClick={() => { |
||||
if (onSkip) return onSkip() |
||||
showAccountDetail(address) |
||||
}} |
||||
> |
||||
{skipText || 'Do it later'} |
||||
</div> |
||||
) |
||||
} |
||||
|
||||
renderCoinbaseLogo () { |
||||
return ( |
||||
<svg width="140px" height="49px" viewBox="0 0 579 126" version="1.1"> |
||||
<g id="Page-1" stroke="none" strokeWidth={1} fill="none" fillRule="evenodd"> |
||||
<g id="Imported-Layers" fill="#0081C9"> |
||||
<path d="M37.752,125.873 C18.824,125.873 0.369,112.307 0.369,81.549 C0.369,50.79 18.824,37.382 37.752,37.382 C47.059,37.382 54.315,39.749 59.52,43.219 L53.841,55.68 C50.371,53.156 45.166,51.579 39.961,51.579 C28.604,51.579 18.193,60.57 18.193,81.391 C18.193,102.212 28.919,111.361 39.961,111.361 C45.166,111.361 50.371,109.783 53.841,107.26 L59.52,120.036 C54.157,123.664 47.059,125.873 37.752,125.873" id="Fill-1" /> |
||||
<path d="M102.898,125.873 C78.765,125.873 65.515,106.786 65.515,81.549 C65.515,56.311 78.765,37.382 102.898,37.382 C127.032,37.382 140.282,56.311 140.282,81.549 C140.282,106.786 127.032,125.873 102.898,125.873 L102.898,125.873 Z M102.898,51.105 C89.491,51.105 82.866,63.093 82.866,81.391 C82.866,99.688 89.491,111.834 102.898,111.834 C116.306,111.834 122.931,99.688 122.931,81.391 C122.931,63.093 116.306,51.105 102.898,51.105 L102.898,51.105 Z" id="Fill-2" /> |
||||
<path d="M163.468,23.659 C157.79,23.659 153.215,19.243 153.215,13.88 C153.215,8.517 157.79,4.1 163.468,4.1 C169.146,4.1 173.721,8.517 173.721,13.88 C173.721,19.243 169.146,23.659 163.468,23.659 L163.468,23.659 Z M154.793,39.118 L172.144,39.118 L172.144,124.138 L154.793,124.138 L154.793,39.118 Z" id="Fill-3" /> |
||||
<path d="M240.443,124.137 L240.443,67.352 C240.443,57.415 234.449,51.263 222.619,51.263 C216.31,51.263 210.473,52.367 207.003,53.787 L207.003,124.137 L189.81,124.137 L189.81,43.376 C198.328,39.906 209.212,37.382 222.461,37.382 C246.28,37.382 257.794,47.793 257.794,65.775 L257.794,124.137 L240.443,124.137" id="Fill-4" /> |
||||
<path d="M303.536,125.873 C292.494,125.873 281.611,123.191 274.986,119.879 L274.986,0.314 L292.179,0.314 L292.179,41.326 C296.28,39.433 302.905,37.856 308.741,37.856 C330.667,37.856 345.494,53.629 345.494,79.656 C345.494,111.676 328.931,125.873 303.536,125.873 L303.536,125.873 Z M305.744,51.263 C301.012,51.263 295.491,52.367 292.179,54.103 L292.179,109.941 C294.703,111.045 299.593,112.149 304.482,112.149 C318.205,112.149 328.301,102.685 328.301,80.918 C328.301,62.305 319.467,51.263 305.744,51.263 L305.744,51.263 Z" id="Fill-5" /> |
||||
<path d="M392.341,125.873 C367.892,125.873 355.589,115.935 355.589,99.215 C355.589,75.555 380.826,71.296 406.537,69.876 L406.537,64.513 C406.537,53.787 399.439,50.001 388.555,50.001 C380.511,50.001 370.731,52.525 365.053,55.207 L360.636,43.376 C367.419,40.379 378.933,37.382 390.29,37.382 C410.638,37.382 422.942,45.269 422.942,66.248 L422.942,119.879 C416.79,123.191 404.329,125.873 392.341,125.873 L392.341,125.873 Z M406.537,81.391 C389.186,82.337 371.835,83.757 371.835,98.9 C371.835,107.89 378.776,113.411 391.868,113.411 C397.389,113.411 403.856,112.465 406.537,111.203 L406.537,81.391 L406.537,81.391 Z" id="Fill-6" /> |
||||
<path d="M461.743,125.873 C451.806,125.873 441.395,123.191 435.244,119.879 L441.08,106.629 C445.496,109.31 454.803,112.149 461.27,112.149 C470.576,112.149 476.728,107.575 476.728,100.477 C476.728,92.748 470.261,89.751 461.586,86.596 C450.228,82.337 437.452,77.132 437.452,61.201 C437.452,47.162 448.336,37.382 467.264,37.382 C477.517,37.382 486.035,39.906 492.029,43.376 L486.665,55.364 C482.88,52.998 475.309,50.317 469.157,50.317 C460.166,50.317 455.118,55.049 455.118,61.201 C455.118,68.93 461.428,71.611 469.788,74.766 C481.618,79.183 494.71,84.072 494.71,100.635 C494.71,115.935 483.038,125.873 461.743,125.873" id="Fill-7" /> |
||||
<path d="M578.625,81.233 L522.155,89.12 C523.89,104.42 533.828,112.149 548.182,112.149 C556.699,112.149 565.848,110.099 571.684,106.944 L576.732,119.879 C570.107,123.349 558.75,125.873 547.078,125.873 C520.262,125.873 505.277,108.679 505.277,81.549 C505.277,55.522 519.789,37.382 543.607,37.382 C565.69,37.382 578.782,51.894 578.782,74.766 C578.782,76.816 578.782,79.025 578.625,81.233 L578.625,81.233 Z M543.292,50.001 C530.042,50.001 521.367,60.097 521.051,77.763 L562.22,72.084 C562.062,57.257 554.649,50.001 543.292,50.001 L543.292,50.001 Z" id="Fill-8" /> |
||||
</g> |
||||
</g> |
||||
</svg> |
||||
) |
||||
} |
||||
|
||||
renderCoinbaseForm () { |
||||
const {goToCoinbase, address} = this.props |
||||
|
||||
return ( |
||||
<div className="buy-ether__action-content-wrapper"> |
||||
<div>{this.renderCoinbaseLogo()}</div> |
||||
<div className="buy-ether__body-text">Coinbase is the world’s most popular way to buy and sell bitcoin, ethereum, and litecoin.</div> |
||||
<a className="first-time-flow__link buy-ether__faq-link">What is Ethereum?</a> |
||||
<div className="buy-ether__buttons"> |
||||
<button |
||||
className="first-time-flow__button" |
||||
onClick={() => goToCoinbase(address)} |
||||
> |
||||
Buy |
||||
</button> |
||||
</div> |
||||
</div> |
||||
) |
||||
} |
||||
|
||||
renderContent () { |
||||
const { address } = this.props |
||||
const { justCopied } = this.state |
||||
const qrImage = qrcode(4, 'M') |
||||
qrImage.addData(address) |
||||
qrImage.make() |
||||
|
||||
switch (this.state.selectedOption) { |
||||
case OPTION_VALUES.COINBASE: |
||||
return this.renderCoinbaseForm() |
||||
case OPTION_VALUES.SHAPESHIFT: |
||||
return ( |
||||
<div className="buy-ether__action-content-wrapper"> |
||||
<div className="shapeshift-logo" /> |
||||
<div className="buy-ether__body-text"> |
||||
Trade any leading blockchain asset for any other. Protection by Design. No Account Needed. |
||||
</div> |
||||
<ShapeShiftForm btnClass="first-time-flow__button" /> |
||||
</div> |
||||
) |
||||
case OPTION_VALUES.QR_CODE: |
||||
return ( |
||||
<div className="buy-ether__action-content-wrapper"> |
||||
<div dangerouslySetInnerHTML={{ __html: qrImage.createTableTag(4) }} /> |
||||
<div className="buy-ether__body-text">Deposit Ether directly into your account.</div> |
||||
<div className="buy-ether__small-body-text">(This is the account address that MetaMask created for you to recieve funds.)</div> |
||||
<div className="buy-ether__buttons"> |
||||
<button |
||||
className="first-time-flow__button" |
||||
onClick={this.copyToClipboard} |
||||
disabled={justCopied} |
||||
> |
||||
{ justCopied ? 'Copied' : 'Copy' } |
||||
</button> |
||||
</div> |
||||
</div> |
||||
) |
||||
default: |
||||
return null |
||||
} |
||||
} |
||||
|
||||
render () { |
||||
const { className = '' } = this.props |
||||
const { selectedOption } = this.state |
||||
|
||||
return ( |
||||
<div className={`${className} buy-ether__content-wrapper`}> |
||||
<div className="buy-ether__content-headline-wrapper"> |
||||
<div className="buy-ether__content-headline">Deposit Options</div> |
||||
{this.renderSkip()} |
||||
</div> |
||||
<div className="buy-ether__content"> |
||||
<div className="buy-ether__side-panel"> |
||||
{OPTIONS.map(({ name, value }) => ( |
||||
<div |
||||
key={value} |
||||
className={classnames('buy-ether__side-panel-item', { |
||||
'buy-ether__side-panel-item--selected': value === selectedOption, |
||||
})} |
||||
onClick={() => this.setState({ selectedOption: value })} |
||||
> |
||||
<div className="buy-ether__side-panel-item-name">{name}</div> |
||||
{value === selectedOption && ( |
||||
<svg viewBox="0 0 574 1024" id="si-ant-right" width="15px" height="15px"> |
||||
<path d="M10 9Q0 19 0 32t10 23l482 457L10 969Q0 979 0 992t10 23q10 9 24 9t24-9l506-480q10-10 10-23t-10-23L58 9Q48 0 34 0T10 9z" /> |
||||
</svg> |
||||
)} |
||||
</div> |
||||
))} |
||||
</div> |
||||
<div className="buy-ether__action-content"> |
||||
{this.renderContent()} |
||||
</div> |
||||
</div> |
||||
</div> |
||||
) |
||||
} |
||||
} |
||||
|
||||
export default connect( |
||||
({ metamask: { selectedAddress } }) => ({ |
||||
address: selectedAddress, |
||||
}), |
||||
dispatch => ({ |
||||
goToCoinbase: address => dispatch(buyEth({ network: '1', address, amount: 0 })), |
||||
showAccountDetail: address => dispatch(showAccountDetail(address)), |
||||
}) |
||||
)(BuyEtherWidget) |
||||
@ -1,218 +0,0 @@ |
||||
import React, { Component } from 'react' |
||||
import PropTypes from 'prop-types' |
||||
import classnames from 'classnames' |
||||
import qrcode from 'qrcode-generator' |
||||
import {connect} from 'react-redux' |
||||
import {shapeShiftSubview, pairUpdate, buyWithShapeShift} from '../../../../ui/app/store/actions' |
||||
import {isValidAddress} from '../../../../ui/app/helpers/utils/util' |
||||
|
||||
export class ShapeShiftForm extends Component { |
||||
static propTypes = { |
||||
selectedAddress: PropTypes.string.isRequired, |
||||
btnClass: PropTypes.string.isRequired, |
||||
tokenExchangeRates: PropTypes.object.isRequired, |
||||
coinOptions: PropTypes.object.isRequired, |
||||
shapeShiftSubview: PropTypes.func.isRequired, |
||||
pairUpdate: PropTypes.func.isRequired, |
||||
buyWithShapeShift: PropTypes.func.isRequired, |
||||
}; |
||||
|
||||
state = { |
||||
depositCoin: 'btc', |
||||
refundAddress: '', |
||||
showQrCode: false, |
||||
depositAddress: '', |
||||
errorMessage: '', |
||||
isLoading: false, |
||||
}; |
||||
|
||||
componentWillMount () { |
||||
this.props.shapeShiftSubview() |
||||
} |
||||
|
||||
onCoinChange = e => { |
||||
const coin = e.target.value |
||||
this.setState({ |
||||
depositCoin: coin, |
||||
errorMessage: '', |
||||
}) |
||||
this.props.pairUpdate(coin) |
||||
} |
||||
|
||||
onBuyWithShapeShift = () => { |
||||
this.setState({ |
||||
isLoading: true, |
||||
showQrCode: true, |
||||
}) |
||||
|
||||
const { |
||||
buyWithShapeShift, |
||||
selectedAddress: withdrawal, |
||||
} = this.props |
||||
const { |
||||
refundAddress: returnAddress, |
||||
depositCoin, |
||||
} = this.state |
||||
const pair = `${depositCoin}_eth` |
||||
const data = { |
||||
withdrawal, |
||||
pair, |
||||
returnAddress, |
||||
// Public api key
|
||||
'apiKey': '803d1f5df2ed1b1476e4b9e6bcd089e34d8874595dda6a23b67d93c56ea9cc2445e98a6748b219b2b6ad654d9f075f1f1db139abfa93158c04e825db122c14b6', |
||||
} |
||||
|
||||
if (isValidAddress(withdrawal)) { |
||||
buyWithShapeShift(data) |
||||
.then(d => this.setState({ |
||||
showQrCode: true, |
||||
depositAddress: d.deposit, |
||||
isLoading: false, |
||||
})) |
||||
.catch(() => this.setState({ |
||||
showQrCode: false, |
||||
errorMessage: 'Invalid Request', |
||||
isLoading: false, |
||||
})) |
||||
} |
||||
} |
||||
|
||||
renderMetadata (label, value) { |
||||
return ( |
||||
<div className="shapeshift-form__metadata-wrapper"> |
||||
<div className="shapeshift-form__metadata-label"> |
||||
{label}: |
||||
</div> |
||||
<div className="shapeshift-form__metadata-value"> |
||||
{value} |
||||
</div> |
||||
</div> |
||||
) |
||||
} |
||||
|
||||
renderMarketInfo () { |
||||
const { depositCoin } = this.state |
||||
const coinPair = `${depositCoin}_eth` |
||||
const { tokenExchangeRates } = this.props |
||||
const { |
||||
limit, |
||||
rate, |
||||
minimum, |
||||
} = tokenExchangeRates[coinPair] || {} |
||||
|
||||
return ( |
||||
<div className="shapeshift-form__metadata"> |
||||
{this.renderMetadata('Status', limit ? 'Available' : 'Unavailable')} |
||||
{this.renderMetadata('Limit', limit)} |
||||
{this.renderMetadata('Exchange Rate', rate)} |
||||
{this.renderMetadata('Minimum', minimum)} |
||||
</div> |
||||
) |
||||
} |
||||
|
||||
renderQrCode () { |
||||
const { depositAddress, isLoading } = this.state |
||||
const qrImage = qrcode(4, 'M') |
||||
qrImage.addData(depositAddress) |
||||
qrImage.make() |
||||
|
||||
return ( |
||||
<div className="shapeshift-form"> |
||||
<div className="shapeshift-form__deposit-instruction"> |
||||
Deposit your BTC to the address bellow: |
||||
</div> |
||||
<div className="shapeshift-form__qr-code"> |
||||
{isLoading |
||||
? <img src="images/loading.svg" style={{ width: '60px' }} /> |
||||
: <div dangerouslySetInnerHTML={{ __html: qrImage.createTableTag(4) }} /> |
||||
} |
||||
</div> |
||||
{this.renderMarketInfo()} |
||||
</div> |
||||
) |
||||
} |
||||
|
||||
render () { |
||||
const { coinOptions, btnClass } = this.props |
||||
const { depositCoin, errorMessage, showQrCode } = this.state |
||||
const coinPair = `${depositCoin}_eth` |
||||
const { tokenExchangeRates } = this.props |
||||
const token = tokenExchangeRates[coinPair] |
||||
|
||||
return showQrCode ? this.renderQrCode() : ( |
||||
<div> |
||||
<div className="shapeshift-form"> |
||||
<div className="shapeshift-form__selectors"> |
||||
<div className="shapeshift-form__selector"> |
||||
<div className="shapeshift-form__selector-label"> |
||||
Deposit |
||||
</div> |
||||
<select |
||||
className="shapeshift-form__selector-input" |
||||
value={this.state.depositCoin} |
||||
onChange={this.onCoinChange} |
||||
> |
||||
{Object.entries(coinOptions).map(([coin]) => ( |
||||
<option key={coin} value={coin.toLowerCase()}> |
||||
{coin} |
||||
</option> |
||||
))} |
||||
</select> |
||||
</div> |
||||
<div |
||||
className="icon shapeshift-form__caret" |
||||
style={{ backgroundImage: 'url(images/caret-right.svg)'}} |
||||
/> |
||||
<div className="shapeshift-form__selector"> |
||||
<div className="shapeshift-form__selector-label"> |
||||
Receive |
||||
</div> |
||||
<div className="shapeshift-form__selector-input"> |
||||
ETH |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<div |
||||
className={classnames('shapeshift-form__address-input-wrapper', { |
||||
'shapeshift-form__address-input-wrapper--error': errorMessage, |
||||
})} |
||||
> |
||||
<div className="shapeshift-form__address-input-label"> |
||||
Your Refund Address |
||||
</div> |
||||
<input |
||||
type="text" |
||||
className="shapeshift-form__address-input" |
||||
onChange={e => this.setState({ |
||||
refundAddress: e.target.value, |
||||
errorMessage: '', |
||||
})} |
||||
/> |
||||
<div className="shapeshift-form__address-input-error-message"> |
||||
{errorMessage} |
||||
</div> |
||||
</div> |
||||
{this.renderMarketInfo()} |
||||
</div> |
||||
<button |
||||
className={btnClass} |
||||
disabled={!token} |
||||
onClick={this.onBuyWithShapeShift} |
||||
> |
||||
Buy |
||||
</button> |
||||
</div> |
||||
) |
||||
} |
||||
} |
||||
|
||||
export default connect( |
||||
({ metamask: { coinOptions, tokenExchangeRates, selectedAddress } }) => ({ |
||||
coinOptions, tokenExchangeRates, selectedAddress, |
||||
}), |
||||
dispatch => ({ |
||||
shapeShiftSubview: () => dispatch(shapeShiftSubview()), |
||||
pairUpdate: coin => dispatch(pairUpdate(coin)), |
||||
buyWithShapeShift: data => dispatch(buyWithShapeShift(data)), |
||||
}) |
||||
)(ShapeShiftForm) |
||||
@ -1,5 +0,0 @@ |
||||
# Notices |
||||
|
||||
Those notices are of legal nature. They are displayed to the users of MetaMask. |
||||
|
||||
Any changes or additions must be reviewed by the product management. |
||||
@ -1,179 +0,0 @@ |
||||
# Terms of Use # |
||||
|
||||
**THIS AGREEMENT IS SUBJECT TO BINDING ARBITRATION AND A WAIVER OF CLASS ACTION RIGHTS AS DETAILED IN SECTION 13. PLEASE READ THE AGREEMENT CAREFULLY.** |
||||
|
||||
_Our Terms of Use have been updated as of September 5, 2016_ |
||||
|
||||
## 1. Acceptance of Terms ## |
||||
|
||||
MetaMask provides a platform for managing Ethereum (or "ETH") accounts, and allowing ordinary websites to interact with the Ethereum blockchain, while keeping the user in control over what transactions they approve, through our website located at[ ](http://metamask.io)[https://metamask.io/](https://metamask.io/) and browser plugin (the "Site") — which includes text, images, audio, code and other materials (collectively, the “Content”) and all of the features, and services provided. The Site, and any other features, tools, materials, or other services offered from time to time by MetaMask are referred to here as the “Service.” Please read these Terms of Use (the “Terms” or “Terms of Use”) carefully before using the Service. By using or otherwise accessing the Services, or clicking to accept or agree to these Terms where that option is made available, you (1) accept and agree to these Terms (2) consent to the collection, use, disclosure and other handling of information as described in our Privacy Policy and (3) any additional terms, rules and conditions of participation issued by MetaMask from time to time. If you do not agree to the Terms, then you may not access or use the Content or Services. |
||||
|
||||
## 2. Modification of Terms of Use ## |
||||
|
||||
Except for Section 13, providing for binding arbitration and waiver of class action rights, MetaMask reserves the right, at its sole discretion, to modify or replace the Terms of Use at any time. The most current version of these Terms will be posted on our Site. You shall be responsible for reviewing and becoming familiar with any such modifications. Use of the Services by you after any modification to the Terms constitutes your acceptance of the Terms of Use as modified. |
||||
|
||||
|
||||
|
||||
## 3. Eligibility ## |
||||
|
||||
You hereby represent and warrant that you are fully able and competent to enter into the terms, conditions, obligations, affirmations, representations and warranties set forth in these Terms and to abide by and comply with these Terms. |
||||
|
||||
MetaMask is a global platform and by accessing the Content or Services, you are representing and warranting that, you are of the legal age of majority in your jurisdiction as is required to access such Services and Content and enter into arrangements as provided by the Service. You further represent that you are otherwise legally permitted to use the service in your jurisdiction including owning cryptographic tokens of value, and interacting with the Services or Content in any way. You further represent you are responsible for ensuring compliance with the laws of your jurisdiction and acknowledge that MetaMask is not liable for your compliance with such laws. |
||||
|
||||
## 4 Account Password and Security ## |
||||
|
||||
When setting up an account within MetaMask, you will be responsible for keeping your own account secrets, which may be a twelve-word seed phrase, an account file, or other locally stored secret information. MetaMask encrypts this information locally with a password you provide, that we never send to our servers. You agree to (a) never use the same password for MetaMask that you have ever used outside of this service; (b) keep your secret information and password confidential and do not share them with anyone else; (c) immediately notify MetaMask of any unauthorized use of your account or breach of security. MetaMask cannot and will not be liable for any loss or damage arising from your failure to comply with this section. |
||||
|
||||
## 5. Representations, Warranties, and Risks ## |
||||
|
||||
### 5.1. Warranty Disclaimer ### |
||||
|
||||
You expressly understand and agree that your use of the Service is at your sole risk. The Service (including the Service and the Content) are provided on an "AS IS" and "as available" basis, without warranties of any kind, either express or implied, including, without limitation, implied warranties of merchantability, fitness for a particular purpose or non-infringement. You acknowledge that MetaMask has no control over, and no duty to take any action regarding: which users gain access to or use the Service; what effects the Content may have on you; how you may interpret or use the Content; or what actions you may take as a result of having been exposed to the Content. You release MetaMask from all liability for you having acquired or not acquired Content through the Service. MetaMask makes no representations concerning any Content contained in or accessed through the Service, and MetaMask will not be responsible or liable for the accuracy, copyright compliance, legality or decency of material contained in or accessed through the Service. |
||||
|
||||
### 5.2 Sophistication and Risk of Cryptographic Systems ### |
||||
|
||||
By utilizing the Service or interacting with the Content or platform in any way, you represent that you understand the inherent risks associated with cryptographic systems; and warrant that you have an understanding of the usage and intricacies of native cryptographic tokens, like Ether (ETH) and Bitcoin (BTC), smart contract based tokens such as those that follow the Ethereum Token Standard (https://github.com/ethereum/EIPs/issues/20), and blockchain-based software systems. |
||||
|
||||
### 5.3 Risk of Regulatory Actions in One or More Jurisdictions ### |
||||
|
||||
MetaMask and ETH could be impacted by one or more regulatory inquiries or regulatory action, which could impede or limit the ability of MetaMask to continue to develop, or which could impede or limit your ability to access or use the Service or Ethereum blockchain. |
||||
|
||||
### 5.4 Risk of Weaknesses or Exploits in the Field of Cryptography ### |
||||
|
||||
You acknowledge and understand that Cryptography is a progressing field. Advances in code cracking or technical advances such as the development of quantum computers may present risks to cryptocurrencies and Services of Content, which could result in the theft or loss of your cryptographic tokens or property. To the extent possible, MetaMask intends to update the protocol underlying Services to account for any advances in cryptography and to incorporate additional security measures, but does not guarantee or otherwise represent full security of the system. By using the Service or accessing Content, you acknowledge these inherent risks. |
||||
|
||||
### 5.5 Volatility of Crypto Currencies ### |
||||
|
||||
You understand that Ethereum and other blockchain technologies and associated currencies or tokens are highly volatile due to many factors including but not limited to adoption, speculation, technology and security risks. You also acknowledge that the cost of transacting on such technologies is variable and may increase at any time causing impact to any activities taking place on the Ethereum blockchain. You acknowledge these risks and represent that MetaMask cannot be held liable for such fluctuations or increased costs. |
||||
|
||||
### 5.6 Application Security ### |
||||
|
||||
You acknowledge that Ethereum applications are code subject to flaws and acknowledge that you are solely responsible for evaluating any code provided by the Services or Content and the trustworthiness of any third-party websites, products, smart-contracts, or Content you access or use through the Service. You further expressly acknowledge and represent that Ethereum applications can be written maliciously or negligently, that MetaMask cannot be held liable for your interaction with such applications and that such applications may cause the loss of property or even identity. This warning and others later provided by MetaMask in no way evidence or represent an on-going duty to alert you to all of the potential risks of utilizing the Service or Content. |
||||
|
||||
## 6. Indemnity ## |
||||
|
||||
You agree to release and to indemnify, defend and hold harmless MetaMask and its parents, subsidiaries, affiliates and agencies, as well as the officers, directors, employees, shareholders and representatives of any of the foregoing entities, from and against any and all losses, liabilities, expenses, damages, costs (including attorneys’ fees and court costs) claims or actions of any kind whatsoever arising or resulting from your use of the Service, your violation of these Terms of Use, and any of your acts or omissions that implicate publicity rights, defamation or invasion of privacy. MetaMask reserves the right, at its own expense, to assume exclusive defense and control of any matter otherwise subject to indemnification by you and, in such case, you agree to cooperate with MetaMask in the defense of such matter. |
||||
|
||||
## 7. Limitation on liability ## |
||||
|
||||
YOU ACKNOWLEDGE AND AGREE THAT YOU ASSUME FULL RESPONSIBILITY FOR YOUR USE OF THE SITE AND SERVICE. YOU ACKNOWLEDGE AND AGREE THAT ANY INFORMATION YOU SEND OR RECEIVE DURING YOUR USE OF THE SITE AND SERVICE MAY NOT BE SECURE AND MAY BE INTERCEPTED OR LATER ACQUIRED BY UNAUTHORIZED PARTIES. YOU ACKNOWLEDGE AND AGREE THAT YOUR USE OF THE SITE AND SERVICE IS AT YOUR OWN RISK. RECOGNIZING SUCH, YOU UNDERSTAND AND AGREE THAT, TO THE FULLEST EXTENT PERMITTED BY APPLICABLE LAW, NEITHER METAMASK NOR ITS SUPPLIERS OR LICENSORS WILL BE LIABLE TO YOU FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, CONSEQUENTIAL, PUNITIVE, EXEMPLARY OR OTHER DAMAGES OF ANY KIND, INCLUDING WITHOUT LIMITATION DAMAGES FOR LOSS OF PROFITS, GOODWILL, USE, DATA OR OTHER TANGIBLE OR INTANGIBLE LOSSES OR ANY OTHER DAMAGES BASED ON CONTRACT, TORT, STRICT LIABILITY OR ANY OTHER THEORY (EVEN IF METAMASK HAD BEEN ADVISED OF THE POSSIBILITY OF SUCH DAMAGES), RESULTING FROM THE SITE OR SERVICE; THE USE OR THE INABILITY TO USE THE SITE OR SERVICE; UNAUTHORIZED ACCESS TO OR ALTERATION OF YOUR TRANSMISSIONS OR DATA; STATEMENTS OR CONDUCT OF ANY THIRD PARTY ON THE SITE OR SERVICE; ANY ACTIONS WE TAKE OR FAIL TO TAKE AS A RESULT OF COMMUNICATIONS YOU SEND TO US; HUMAN ERRORS; TECHNICAL MALFUNCTIONS; FAILURES, INCLUDING PUBLIC UTILITY OR TELEPHONE OUTAGES; OMISSIONS, INTERRUPTIONS, LATENCY, DELETIONS OR DEFECTS OF ANY DEVICE OR NETWORK, PROVIDERS, OR SOFTWARE (INCLUDING, BUT NOT LIMITED TO, THOSE THAT DO NOT PERMIT PARTICIPATION IN THE SERVICE); ANY INJURY OR DAMAGE TO COMPUTER EQUIPMENT; INABILITY TO FULLY ACCESS THE SITE OR SERVICE OR ANY OTHER WEBSITE; THEFT, TAMPERING, DESTRUCTION, OR UNAUTHORIZED ACCESS TO, IMAGES OR OTHER CONTENT OF ANY KIND; DATA THAT IS PROCESSED LATE OR INCORRECTLY OR IS INCOMPLETE OR LOST; TYPOGRAPHICAL, PRINTING OR OTHER ERRORS, OR ANY COMBINATION THEREOF; OR ANY OTHER MATTER RELATING TO THE SITE OR SERVICE. |
||||
|
||||
SOME JURISDICTIONS DO NOT ALLOW THE EXCLUSION OF CERTAIN WARRANTIES OR THE LIMITATION OR EXCLUSION OF LIABILITY FOR INCIDENTAL OR CONSEQUENTIAL DAMAGES. ACCORDINGLY, SOME OF THE ABOVE LIMITATIONS MAY NOT APPLY TO YOU. |
||||
|
||||
## 8. Our Proprietary Rights ## |
||||
|
||||
All title, ownership and intellectual property rights in and to the Service are owned by MetaMask or its licensors. You acknowledge and agree that the Service contains proprietary and confidential information that is protected by applicable intellectual property and other laws. Except as expressly authorized by MetaMask, you agree not to copy, modify, rent, lease, loan, sell, distribute, perform, display or create derivative works based on the Service, in whole or in part. MetaMask issues a license for MetaMask, found [here](https://github.com/MetaMask/metamask-plugin/blob/master/LICENSE). For information on other licenses utilized in the development of MetaMask, please see our attribution page at: [https://metamask.io/attributions.html](https://metamask.io/attributions.html) |
||||
|
||||
## 9. Links ## |
||||
|
||||
The Service provides, or third parties may provide, links to other World Wide Web or accessible sites, applications or resources. Because MetaMask has no control over such sites, applications and resources, you acknowledge and agree that MetaMask is not responsible for the availability of such external sites, applications or resources, and does not endorse and is not responsible or liable for any content, advertising, products or other materials on or available from such sites or resources. You further acknowledge and agree that MetaMask shall not be responsible or liable, directly or indirectly, for any damage or loss caused or alleged to be caused by or in connection with use of or reliance on any such content, goods or services available on or through any such site or resource. |
||||
|
||||
## 10. Termination and Suspension ## |
||||
|
||||
MetaMask may terminate or suspend all or part of the Service and your MetaMask access immediately, without prior notice or liability, if you breach any of the terms or conditions of the Terms. Upon termination of your access, your right to use the Service will immediately cease. |
||||
|
||||
The following provisions of the Terms survive any termination of these Terms: INDEMNITY; WARRANTY DISCLAIMERS; LIMITATION ON LIABILITY; OUR PROPRIETARY RIGHTS; LINKS; TERMINATION; NO THIRD PARTY BENEFICIARIES; BINDING ARBITRATION AND CLASS ACTION WAIVER; GENERAL INFORMATION. |
||||
|
||||
## 11. No Third Party Beneficiaries ## |
||||
|
||||
You agree that, except as otherwise expressly provided in these Terms, there shall be no third party beneficiaries to the Terms. |
||||
|
||||
## 12. Notice and Procedure For Making Claims of Copyright Infringement ## |
||||
|
||||
If you believe that your copyright or the copyright of a person on whose behalf you are authorized to act has been infringed, please provide MetaMask’s Copyright Agent a written Notice containing the following information: |
||||
|
||||
· an electronic or physical signature of the person authorized to act on behalf of the owner of the copyright or other intellectual property interest; |
||||
|
||||
· a description of the copyrighted work or other intellectual property that you claim has been infringed; |
||||
|
||||
· a description of where the material that you claim is infringing is located on the Service; |
||||
|
||||
· your address, telephone number, and email address; |
||||
|
||||
· a statement by you that you have a good faith belief that the disputed use is not authorized by the copyright owner, its agent, or the law; |
||||
|
||||
· a statement by you, made under penalty of perjury, that the above information in your Notice is accurate and that you are the copyright or intellectual property owner or authorized to act on the copyright or intellectual property owner's behalf. |
||||
|
||||
MetaMask’s Copyright Agent can be reached at: |
||||
|
||||
Email: copyright [at] metamask [dot] io |
||||
|
||||
Mail: |
||||
|
||||
Attention: |
||||
|
||||
MetaMask Copyright ℅ ConsenSys |
||||
|
||||
49 Bogart Street |
||||
|
||||
Brooklyn, NY 11206 |
||||
|
||||
## 13. Binding Arbitration and Class Action Waiver ## |
||||
|
||||
PLEASE READ THIS SECTION CAREFULLY – IT MAY SIGNIFICANTLY AFFECT YOUR LEGAL RIGHTS, INCLUDING YOUR RIGHT TO FILE A LAWSUIT IN COURT |
||||
|
||||
### 13.1 Initial Dispute Resolution ### |
||||
|
||||
The parties shall use their best efforts to engage directly to settle any dispute, claim, question, or disagreement and engage in good faith negotiations which shall be a condition to either party initiating a lawsuit or arbitration. |
||||
|
||||
### 13.2 Binding Arbitration ### |
||||
|
||||
If the parties do not reach an agreed upon solution within a period of 30 days from the time informal dispute resolution under the Initial Dispute Resolution provision begins, then either party may initiate binding arbitration as the sole means to resolve claims, subject to the terms set forth below. Specifically, all claims arising out of or relating to these Terms (including their formation, performance and breach), the parties’ relationship with each other and/or your use of the Service shall be finally settled by binding arbitration administered by the American Arbitration Association in accordance with the provisions of its Commercial Arbitration Rules and the supplementary procedures for consumer related disputes of the American Arbitration Association (the "AAA"), excluding any rules or procedures governing or permitting class actions. |
||||
|
||||
The arbitrator, and not any federal, state or local court or agency, shall have exclusive authority to resolve all disputes arising out of or relating to the interpretation, applicability, enforceability or formation of these Terms, including, but not limited to any claim that all or any part of these Terms are void or voidable, or whether a claim is subject to arbitration. The arbitrator shall be empowered to grant whatever relief would be available in a court under law or in equity. The arbitrator’s award shall be written, and binding on the parties and may be entered as a judgment in any court of competent jurisdiction. |
||||
|
||||
The parties understand that, absent this mandatory provision, they would have the right to sue in court and have a jury trial. They further understand that, in some instances, the costs of arbitration could exceed the costs of litigation and the right to discovery may be more limited in arbitration than in court. |
||||
|
||||
### 13.3 Location ### |
||||
|
||||
Binding arbitration shall take place in New York. You agree to submit to the personal jurisdiction of any federal or state court in New York County, New York, in order to compel arbitration, to stay proceedings pending arbitration, or to confirm, modify, vacate or enter judgment on the award entered by the arbitrator. |
||||
|
||||
### 13.4 Class Action Waiver ### |
||||
|
||||
The parties further agree that any arbitration shall be conducted in their individual capacities only and not as a class action or other representative action, and the parties expressly waive their right to file a class action or seek relief on a class basis. YOU AND METAMASK AGREE THAT EACH MAY BRING CLAIMS AGAINST THE OTHER ONLY IN YOUR OR ITS INDIVIDUAL CAPACITY, AND NOT AS A PLAINTIFF OR CLASS MEMBER IN ANY PURPORTED CLASS OR REPRESENTATIVE PROCEEDING. If any court or arbitrator determines that the class action waiver set forth in this paragraph is void or unenforceable for any reason or that an arbitration can proceed on a class basis, then the arbitration provision set forth above shall be deemed null and void in its entirety and the parties shall be deemed to have not agreed to arbitrate disputes. |
||||
|
||||
### 13.5 Exception - Litigation of Intellectual Property and Small Claims Court Claims ### |
||||
|
||||
Notwithstanding the parties' decision to resolve all disputes through arbitration, either party may bring an action in state or federal court to protect its intellectual property rights ("intellectual property rights" means patents, copyrights, moral rights, trademarks, and trade secrets, but not privacy or publicity rights). Either party may also seek relief in a small claims court for disputes or claims within the scope of that court’s jurisdiction. |
||||
|
||||
### 13.6 30-Day Right to Opt Out ### |
||||
|
||||
You have the right to opt-out and not be bound by the arbitration and class action waiver provisions set forth above by sending written notice of your decision to opt-out to the following address: MetaMask ℅ ConsenSys, 49 Bogart Street, Brooklyn NY 11206 and via email at support@metamask.io. The notice must be sent within 30 days of September 6, 2016 or your first use of the Service, whichever is later, otherwise you shall be bound to arbitrate disputes in accordance with the terms of those paragraphs. If you opt-out of these arbitration provisions, MetaMask also will not be bound by them. |
||||
|
||||
### 13.7 Changes to This Section ### |
||||
|
||||
MetaMask will provide 60-days’ notice of any changes to this section. Changes will become effective on the 60th day, and will apply prospectively only to any claims arising after the 60th day. |
||||
|
||||
For any dispute not subject to arbitration you and MetaMask agree to submit to the personal and exclusive jurisdiction of and venue in the federal and state courts located in New York, New York. You further agree to accept service of process by mail, and hereby waive any and all jurisdictional and venue defenses otherwise available. |
||||
|
||||
The Terms and the relationship between you and MetaMask shall be governed by the laws of the State of New York without regard to conflict of law provisions. |
||||
|
||||
## 14. General Information ## |
||||
|
||||
### 14.1 Entire Agreement ### |
||||
|
||||
These Terms (and any additional terms, rules and conditions of participation that MetaMask may post on the Service) constitute the entire agreement between you and MetaMask with respect to the Service and supersedes any prior agreements, oral or written, between you and MetaMask. In the event of a conflict between these Terms and the additional terms, rules and conditions of participation, the latter will prevail over the Terms to the extent of the conflict. |
||||
|
||||
### 14.2 Waiver and Severability of Terms ### |
||||
|
||||
The failure of MetaMask to exercise or enforce any right or provision of the Terms shall not constitute a waiver of such right or provision. If any provision of the Terms is found by an arbitrator or court of competent jurisdiction to be invalid, the parties nevertheless agree that the arbitrator or court should endeavor to give effect to the parties' intentions as reflected in the provision, and the other provisions of the Terms remain in full force and effect. |
||||
|
||||
### 14.3 Statute of Limitations ### |
||||
|
||||
You agree that regardless of any statute or law to the contrary, any claim or cause of action arising out of or related to the use of the Service or the Terms must be filed within one (1) year after such claim or cause of action arose or be forever barred. |
||||
|
||||
### 14.4 Section Titles ### |
||||
|
||||
The section titles in the Terms are for convenience only and have no legal or contractual effect. |
||||
|
||||
### 14.5 Communications ### |
||||
|
||||
Users with questions, complaints or claims with respect to the Service may contact us using the relevant contact information set forth above and at communications@metamask.io. |
||||
|
||||
## 15 Related Links ## |
||||
|
||||
**[Terms of Use](https://metamask.io/terms.html)** |
||||
|
||||
**[Privacy](https://metamask.io/privacy.html)** |
||||
|
||||
**[Attributions](https://metamask.io/attributions.html)** |
||||
@ -1,6 +0,0 @@ |
||||
MetaMask is beta software. |
||||
|
||||
When you log in to MetaMask and approve account access, your current account's address is visible to the site you're currently viewing. This can be used to look up your account balances of Ether and other tokens. |
||||
|
||||
For your privacy, take caution when approving account access and sign out of MetaMask when you're done using a site. |
||||
|
||||
@ -1,11 +0,0 @@ |
||||
Please take a moment to [back up your seed phrase again](https://support.metamask.io/kb/article/28-abbu-always-be-backed-up-how-to-make-sure-your-12-word-metamask-seed-phrase-is-backed-up). |
||||
|
||||
MetaMask has become aware of a previous issue where a very small number of users were shown the wrong seed phrase to back up. The only way to protect yourself from this issue, is to back up your seed phrase again now. |
||||
|
||||
You can follow the guide at this link: |
||||
|
||||
[https://support.metamask.io/kb/article/28-abbu-always-be-backed-up-how-to-make-sure-your-12-word-metamask-seed-phrase-is-backed-up](https://support.metamask.io/kb/article/28-abbu-always-be-backed-up-how-to-make-sure-your-12-word-metamask-seed-phrase-is-backed-up) |
||||
|
||||
We have fixed the known issue, but will be issuing ongoing bug bounties to help prevent this kind of problem in the future. |
||||
|
||||
For more information on this issue, [see this blog post](https://medium.com/metamask/seed-phrase-issue-bounty-awarded-e1986e811021) |
||||
@ -1,5 +0,0 @@ |
||||
Dear MetaMask Users, |
||||
|
||||
There have been several instances of high-profile legitimate websites such as BTC Manager and Games Workshop that have had their websites temporarily compromised. This involves showing a fake MetaMask window on the page asking for user's seed phrases. MetaMask will never open itself to ask you for your seed phrase, and users are encouraged to report these instances immediately to either [our phishing blacklist](https://github.com/MetaMask/eth-phishing-detect/issues) or our support email at [support@metamask.io](mailto:support@metamask.io). |
||||
|
||||
[Please read our full article on this ongoing issue over at Medium.](https://medium.com/metamask/new-phishing-strategy-becoming-common-1b1123837168) |
||||
@ -1,35 +0,0 @@ |
||||
// fs.readFileSync is inlined by browserify transform "brfs"
|
||||
const fs = require('fs') |
||||
const path = require('path') |
||||
|
||||
module.exports = [ |
||||
{ |
||||
id: 0, |
||||
read: false, |
||||
date: 'Thu Feb 09 2017', |
||||
title: 'Terms of Use', |
||||
body: fs.readFileSync(path.join(__dirname, '/archive', 'notice_0.md'), 'utf8'), |
||||
}, |
||||
{ |
||||
id: 2, |
||||
read: false, |
||||
date: 'Mon May 08 2017', |
||||
title: 'Privacy Notice', |
||||
body: fs.readFileSync(path.join(__dirname, '/archive', 'notice_2.md'), 'utf8'), |
||||
}, |
||||
{ |
||||
id: 3, |
||||
read: false, |
||||
date: 'Tue Nov 28 2017', |
||||
title: 'Seed Phrase Alert', |
||||
firstVersion: '<=3.12.0', |
||||
body: fs.readFileSync(path.join(__dirname, '/archive', 'notice_3.md'), 'utf8'), |
||||
}, |
||||
{ |
||||
id: 4, |
||||
read: false, |
||||
date: 'Wed Jun 13 2018', |
||||
title: 'Phishing Warning', |
||||
body: fs.readFileSync(path.join(__dirname, '/archive', 'notice_4.md'), 'utf8'), |
||||
}, |
||||
] |
||||
File diff suppressed because it is too large
Load Diff
@ -1,92 +0,0 @@ |
||||
const assert = require('assert') |
||||
const NoticeController = require('../../../../app/scripts/notice-controller') |
||||
|
||||
describe('notice-controller', function () { |
||||
var noticeController |
||||
|
||||
beforeEach(function () { |
||||
noticeController = new NoticeController() |
||||
}) |
||||
|
||||
describe('notices', function () { |
||||
|
||||
describe('#setNoticesList', function () { |
||||
it('should set data appropriately', function (done) { |
||||
var testList = [{ |
||||
id: 0, |
||||
read: false, |
||||
title: 'Futuristic Notice', |
||||
}] |
||||
noticeController.setNoticesList(testList) |
||||
var testListId = noticeController.getNoticesList()[0].id |
||||
assert.equal(testListId, 0) |
||||
done() |
||||
}) |
||||
}) |
||||
|
||||
describe('#markNoticeRead', function () { |
||||
it('should mark a notice as read', function (done) { |
||||
var testList = [{ |
||||
id: 0, |
||||
read: false, |
||||
title: 'Futuristic Notice', |
||||
}] |
||||
noticeController.setNoticesList(testList) |
||||
noticeController.markNoticeRead(testList[0]) |
||||
var newList = noticeController.getNoticesList() |
||||
assert.ok(newList[0].read) |
||||
done() |
||||
}) |
||||
}) |
||||
|
||||
describe('#markAllNoticesRead', () => { |
||||
it('marks all notices read', async () => { |
||||
const testList = [{ |
||||
id: 0, |
||||
read: false, |
||||
title: 'Notice 1', |
||||
}, { |
||||
id: 1, |
||||
read: false, |
||||
title: 'Notice 2', |
||||
}, { |
||||
id: 2, |
||||
read: false, |
||||
title: 'Notice 3', |
||||
}] |
||||
|
||||
noticeController.setNoticesList(testList) |
||||
|
||||
noticeController.markAllNoticesRead() |
||||
|
||||
const unreadNotices = noticeController.getUnreadNotices() |
||||
assert.equal(unreadNotices.length, 0) |
||||
}) |
||||
}) |
||||
|
||||
describe('#getNextUnreadNotice', function () { |
||||
it('should retrieve the latest unread notice', function (done) { |
||||
var testList = [ |
||||
{id: 0, read: true, title: 'Past Notice'}, |
||||
{id: 1, read: false, title: 'Current Notice'}, |
||||
{id: 2, read: false, title: 'Future Notice'}, |
||||
] |
||||
noticeController.setNoticesList(testList) |
||||
var latestUnread = noticeController.getNextUnreadNotice() |
||||
assert.equal(latestUnread.id, 1) |
||||
done() |
||||
}) |
||||
it('should return undefined if no unread notices exist.', function (done) { |
||||
var testList = [ |
||||
{id: 0, read: true, title: 'Past Notice'}, |
||||
{id: 1, read: true, title: 'Current Notice'}, |
||||
{id: 2, read: true, title: 'Future Notice'}, |
||||
] |
||||
noticeController.setNoticesList(testList) |
||||
var latestUnread = noticeController.getNextUnreadNotice() |
||||
assert.ok(!latestUnread) |
||||
done() |
||||
}) |
||||
}) |
||||
}) |
||||
}) |
||||
@ -0,0 +1,40 @@ |
||||
const assert = require('assert') |
||||
const migration33 = require('../../../app/scripts/migrations/033') |
||||
|
||||
describe('Migration to delete notice controller', () => { |
||||
const oldStorage = { |
||||
'meta': {}, |
||||
'data': { |
||||
'NoticeController': { |
||||
'noticesList': [ |
||||
{ |
||||
id: 0, |
||||
read: false, |
||||
date: 'Thu Feb 09 2017', |
||||
title: 'Terms of Use', |
||||
body: 'notice body', |
||||
}, |
||||
{ |
||||
id: 2, |
||||
read: false, |
||||
title: 'Privacy Notice', |
||||
body: 'notice body', |
||||
}, |
||||
{ |
||||
id: 4, |
||||
read: false, |
||||
title: 'Phishing Warning', |
||||
body: 'notice body', |
||||
}, |
||||
], |
||||
}, |
||||
}, |
||||
} |
||||
|
||||
it('removes notice controller from state', () => { |
||||
migration33.migrate(oldStorage) |
||||
.then(newStorage => { |
||||
assert.equal(newStorage.data.NoticeController, undefined) |
||||
}) |
||||
}) |
||||
}) |
||||
@ -1,338 +0,0 @@ |
||||
const Component = require('react').Component |
||||
const PropTypes = require('prop-types') |
||||
const h = require('react-hyperscript') |
||||
const actions = require('../../store/actions') |
||||
const genAccountLink = require('etherscan-link').createAccountLink |
||||
const connect = require('react-redux').connect |
||||
const Dropdown = require('./dropdown').Dropdown |
||||
const DropdownMenuItem = require('./dropdown').DropdownMenuItem |
||||
const copyToClipboard = require('copy-to-clipboard') |
||||
const { checksumAddress } = require('../../helpers/utils/util') |
||||
|
||||
import Identicon from '../ui/identicon' |
||||
|
||||
class AccountDropdowns extends Component { |
||||
constructor (props) { |
||||
super(props) |
||||
this.state = { |
||||
accountSelectorActive: false, |
||||
optionsMenuActive: false, |
||||
} |
||||
this.accountSelectorToggleClassName = 'accounts-selector' |
||||
this.optionsMenuToggleClassName = 'fa-ellipsis-h' |
||||
} |
||||
|
||||
renderAccounts () { |
||||
const { identities, selected, keyrings } = this.props |
||||
|
||||
return Object.keys(identities).map((key, index) => { |
||||
const identity = identities[key] |
||||
const isSelected = identity.address === selected |
||||
|
||||
const simpleAddress = identity.address.substring(2).toLowerCase() |
||||
|
||||
const keyring = keyrings.find((kr) => { |
||||
return kr.accounts.includes(simpleAddress) || |
||||
kr.accounts.includes(identity.address) |
||||
}) |
||||
|
||||
return h( |
||||
DropdownMenuItem, |
||||
{ |
||||
closeMenu: () => {}, |
||||
onClick: () => { |
||||
this.props.actions.showAccountDetail(identity.address) |
||||
}, |
||||
style: { |
||||
marginTop: index === 0 ? '5px' : '', |
||||
fontSize: '24px', |
||||
}, |
||||
}, |
||||
[ |
||||
h( |
||||
Identicon, |
||||
{ |
||||
address: identity.address, |
||||
diameter: 32, |
||||
style: { |
||||
marginLeft: '10px', |
||||
}, |
||||
}, |
||||
), |
||||
this.indicateIfLoose(keyring), |
||||
h('span', { |
||||
style: { |
||||
marginLeft: '20px', |
||||
fontSize: '24px', |
||||
maxWidth: '145px', |
||||
whiteSpace: 'nowrap', |
||||
overflow: 'hidden', |
||||
textOverflow: 'ellipsis', |
||||
}, |
||||
}, identity.name || ''), |
||||
h('span', { style: { marginLeft: '20px', fontSize: '24px' } }, isSelected ? h('.check', '✓') : null), |
||||
] |
||||
) |
||||
}) |
||||
} |
||||
|
||||
indicateIfLoose (keyring) { |
||||
try { // Sometimes keyrings aren't loaded yet:
|
||||
const type = keyring.type |
||||
const isLoose = type !== 'HD Key Tree' |
||||
return isLoose ? h('.keyring-label.allcaps', this.context.t('loose')) : null |
||||
} catch (e) { return } |
||||
} |
||||
|
||||
renderAccountSelector () { |
||||
const { actions } = this.props |
||||
const { accountSelectorActive } = this.state |
||||
|
||||
return h( |
||||
Dropdown, |
||||
{ |
||||
useCssTransition: true, // Hardcoded because account selector is temporarily in app-header
|
||||
style: { |
||||
marginLeft: '-238px', |
||||
marginTop: '38px', |
||||
minWidth: '180px', |
||||
overflowY: 'auto', |
||||
maxHeight: '300px', |
||||
width: '300px', |
||||
}, |
||||
innerStyle: { |
||||
padding: '8px 25px', |
||||
}, |
||||
isOpen: accountSelectorActive, |
||||
onClickOutside: (event) => { |
||||
const { classList } = event.target |
||||
const isNotToggleElement = !classList.contains(this.accountSelectorToggleClassName) |
||||
if (accountSelectorActive && isNotToggleElement) { |
||||
this.setState({ accountSelectorActive: false }) |
||||
} |
||||
}, |
||||
}, |
||||
[ |
||||
...this.renderAccounts(), |
||||
h( |
||||
DropdownMenuItem, |
||||
{ |
||||
closeMenu: () => {}, |
||||
onClick: () => actions.addNewAccount(), |
||||
}, |
||||
[ |
||||
h( |
||||
Identicon, |
||||
{ |
||||
style: { |
||||
marginLeft: '10px', |
||||
}, |
||||
diameter: 32, |
||||
}, |
||||
), |
||||
h('span', { style: { marginLeft: '20px', fontSize: '24px' } }, this.context.t('createAccount')), |
||||
], |
||||
), |
||||
h( |
||||
DropdownMenuItem, |
||||
{ |
||||
closeMenu: () => {}, |
||||
onClick: () => actions.showImportPage(), |
||||
}, |
||||
[ |
||||
h( |
||||
Identicon, |
||||
{ |
||||
style: { |
||||
marginLeft: '10px', |
||||
}, |
||||
diameter: 32, |
||||
}, |
||||
), |
||||
h('span', { |
||||
style: { |
||||
marginLeft: '20px', |
||||
fontSize: '24px', |
||||
marginBottom: '5px', |
||||
}, |
||||
}, this.context.t('importAccount')), |
||||
] |
||||
), |
||||
] |
||||
) |
||||
} |
||||
|
||||
renderAccountOptions () { |
||||
const { actions } = this.props |
||||
const { optionsMenuActive } = this.state |
||||
|
||||
return h( |
||||
Dropdown, |
||||
{ |
||||
style: { |
||||
marginLeft: '-215px', |
||||
minWidth: '180px', |
||||
}, |
||||
isOpen: optionsMenuActive, |
||||
onClickOutside: (event) => { |
||||
const { classList } = event.target |
||||
const isNotToggleElement = !classList.contains(this.optionsMenuToggleClassName) |
||||
if (optionsMenuActive && isNotToggleElement) { |
||||
this.setState({ optionsMenuActive: false }) |
||||
} |
||||
}, |
||||
}, |
||||
[ |
||||
h( |
||||
DropdownMenuItem, |
||||
{ |
||||
closeMenu: () => {}, |
||||
onClick: () => { |
||||
const { selected, network } = this.props |
||||
const url = genAccountLink(selected, network) |
||||
global.platform.openWindow({ url }) |
||||
}, |
||||
}, |
||||
this.context.t('etherscanView'), |
||||
), |
||||
h( |
||||
DropdownMenuItem, |
||||
{ |
||||
closeMenu: () => {}, |
||||
onClick: () => { |
||||
const { selected, identities } = this.props |
||||
var identity = identities[selected] |
||||
actions.showQrView(selected, identity ? identity.name : '') |
||||
}, |
||||
}, |
||||
this.context.t('showQRCode'), |
||||
), |
||||
h( |
||||
DropdownMenuItem, |
||||
{ |
||||
closeMenu: () => {}, |
||||
onClick: () => { |
||||
const { selected } = this.props |
||||
copyToClipboard(checksumAddress(selected)) |
||||
}, |
||||
}, |
||||
this.context.t('copyAddress'), |
||||
), |
||||
h( |
||||
DropdownMenuItem, |
||||
{ |
||||
closeMenu: () => {}, |
||||
onClick: () => { |
||||
actions.requestAccountExport() |
||||
}, |
||||
}, |
||||
this.context.t('exportPrivateKey'), |
||||
), |
||||
] |
||||
) |
||||
} |
||||
|
||||
render () { |
||||
const { metricsEvent } = this.context |
||||
const { style, enableAccountsSelector, enableAccountOptions } = this.props |
||||
const { optionsMenuActive, accountSelectorActive } = this.state |
||||
|
||||
return h( |
||||
'span', |
||||
{ |
||||
style: style, |
||||
}, |
||||
[ |
||||
enableAccountsSelector && h( |
||||
// 'i.fa.fa-angle-down',
|
||||
'div.cursor-pointer.color-orange.accounts-selector', |
||||
{ |
||||
style: { |
||||
// fontSize: '1.8em',
|
||||
background: 'url(images/switch_acc.svg) white center center no-repeat', |
||||
height: '25px', |
||||
width: '25px', |
||||
transform: 'scale(0.75)', |
||||
marginRight: '3px', |
||||
}, |
||||
onClick: (event) => { |
||||
event.stopPropagation() |
||||
this.setState({ |
||||
accountSelectorActive: !accountSelectorActive, |
||||
optionsMenuActive: false, |
||||
}) |
||||
}, |
||||
}, |
||||
this.renderAccountSelector(), |
||||
), |
||||
enableAccountOptions && h( |
||||
'i.fa.fa-ellipsis-h', |
||||
{ |
||||
style: { |
||||
marginRight: '0.5em', |
||||
fontSize: '1.8em', |
||||
}, |
||||
onClick: (event) => { |
||||
metricsEvent({ |
||||
eventOpts: { |
||||
category: 'Accounts', |
||||
action: 'userClick', |
||||
name: 'accountsOpenedMenu', |
||||
}, |
||||
pageOpts: { |
||||
section: 'header', |
||||
component: 'accountDropdownIcon', |
||||
}, |
||||
}) |
||||
event.stopPropagation() |
||||
this.setState({ |
||||
accountSelectorActive: false, |
||||
optionsMenuActive: !optionsMenuActive, |
||||
}) |
||||
}, |
||||
}, |
||||
this.renderAccountOptions() |
||||
), |
||||
] |
||||
) |
||||
} |
||||
} |
||||
|
||||
AccountDropdowns.defaultProps = { |
||||
enableAccountsSelector: false, |
||||
enableAccountOptions: false, |
||||
} |
||||
|
||||
AccountDropdowns.propTypes = { |
||||
identities: PropTypes.objectOf(PropTypes.object), |
||||
selected: PropTypes.string, |
||||
keyrings: PropTypes.array, |
||||
actions: PropTypes.objectOf(PropTypes.func), |
||||
network: PropTypes.string, |
||||
style: PropTypes.object, |
||||
enableAccountOptions: PropTypes.bool, |
||||
enableAccountsSelector: PropTypes.bool, |
||||
t: PropTypes.func, |
||||
} |
||||
|
||||
const mapDispatchToProps = (dispatch) => { |
||||
return { |
||||
actions: { |
||||
showConfigPage: () => dispatch(actions.showConfigPage()), |
||||
requestAccountExport: () => dispatch(actions.requestExportAccount()), |
||||
showAccountDetail: (address) => dispatch(actions.showAccountDetail(address)), |
||||
addNewAccount: () => dispatch(actions.addNewAccount()), |
||||
showImportPage: () => dispatch(actions.showImportPage()), |
||||
showQrView: (selected, identity) => dispatch(actions.showQrView(selected, identity)), |
||||
}, |
||||
} |
||||
} |
||||
|
||||
AccountDropdowns.contextTypes = { |
||||
t: PropTypes.func, |
||||
metricsEvent: PropTypes.func, |
||||
} |
||||
|
||||
module.exports = { |
||||
AccountDropdowns: connect(null, mapDispatchToProps)(AccountDropdowns), |
||||
} |
||||
@ -1,473 +0,0 @@ |
||||
const Component = require('react').Component |
||||
const PropTypes = require('prop-types') |
||||
const h = require('react-hyperscript') |
||||
const actions = require('../../../../store/actions') |
||||
const genAccountLink = require('../../../../../lib/account-link.js') |
||||
const connect = require('react-redux').connect |
||||
const Dropdown = require('./dropdown').Dropdown |
||||
const DropdownMenuItem = require('./dropdown').DropdownMenuItem |
||||
import Identicon from '../../../ui/identicon' |
||||
const { checksumAddress } = require('../../../../helpers/utils/util') |
||||
const copyToClipboard = require('copy-to-clipboard') |
||||
const { formatBalance } = require('../../../../helpers/utils/util') |
||||
|
||||
|
||||
class AccountDropdowns extends Component { |
||||
constructor (props) { |
||||
super(props) |
||||
this.state = { |
||||
accountSelectorActive: false, |
||||
optionsMenuActive: false, |
||||
} |
||||
// Used for orangeaccount selector icon
|
||||
// this.accountSelectorToggleClassName = 'accounts-selector'
|
||||
this.accountSelectorToggleClassName = 'fa-angle-down' |
||||
this.optionsMenuToggleClassName = 'fa-ellipsis-h' |
||||
} |
||||
|
||||
renderAccounts () { |
||||
const { identities, accounts, selected, menuItemStyles, actions, keyrings, ticker } = this.props |
||||
|
||||
return Object.keys(identities).map((key, index) => { |
||||
const identity = identities[key] |
||||
const isSelected = identity.address === selected |
||||
|
||||
const balanceValue = accounts[key].balance |
||||
const formattedBalance = balanceValue ? formatBalance(balanceValue, 6, true, ticker) : '...' |
||||
const simpleAddress = identity.address.substring(2).toLowerCase() |
||||
|
||||
const keyring = keyrings.find((kr) => { |
||||
return kr.accounts.includes(simpleAddress) || |
||||
kr.accounts.includes(identity.address) |
||||
}) |
||||
|
||||
return h( |
||||
DropdownMenuItem, |
||||
{ |
||||
closeMenu: () => {}, |
||||
onClick: () => { |
||||
this.props.actions.showAccountDetail(identity.address) |
||||
}, |
||||
style: Object.assign( |
||||
{ |
||||
marginTop: index === 0 ? '5px' : '', |
||||
fontSize: '24px', |
||||
width: '260px', |
||||
}, |
||||
menuItemStyles, |
||||
), |
||||
}, |
||||
[ |
||||
h('div.flex-row.flex-center', {}, [ |
||||
|
||||
h('span', { |
||||
style: { |
||||
flex: '1 1 0', |
||||
minWidth: '20px', |
||||
minHeight: '30px', |
||||
}, |
||||
}, [ |
||||
h('span', { |
||||
style: { |
||||
flex: '1 1 auto', |
||||
fontSize: '14px', |
||||
}, |
||||
}, isSelected ? h('i.fa.fa-check') : null), |
||||
]), |
||||
|
||||
h( |
||||
Identicon, |
||||
{ |
||||
address: identity.address, |
||||
diameter: 24, |
||||
style: { |
||||
flex: '1 1 auto', |
||||
marginLeft: '10px', |
||||
}, |
||||
}, |
||||
), |
||||
|
||||
h('span.flex-column', { |
||||
style: { |
||||
flex: '10 10 auto', |
||||
width: '175px', |
||||
alignItems: 'flex-start', |
||||
justifyContent: 'center', |
||||
marginLeft: '10px', |
||||
position: 'relative', |
||||
}, |
||||
}, [ |
||||
this.indicateIfLoose(keyring), |
||||
h('span.account-dropdown-name', { |
||||
style: { |
||||
fontSize: '18px', |
||||
maxWidth: '145px', |
||||
whiteSpace: 'nowrap', |
||||
overflow: 'hidden', |
||||
textOverflow: 'ellipsis', |
||||
}, |
||||
}, identity.name || ''), |
||||
|
||||
h('span.account-dropdown-balance', { |
||||
style: { |
||||
fontSize: '14px', |
||||
fontFamily: 'Avenir', |
||||
fontWeight: 500, |
||||
}, |
||||
}, formattedBalance), |
||||
]), |
||||
|
||||
h('span', { |
||||
style: { |
||||
flex: '3 3 auto', |
||||
}, |
||||
}, [ |
||||
h('span.account-dropdown-edit-button.allcaps', { |
||||
style: { |
||||
fontSize: '16px', |
||||
}, |
||||
onClick: () => { |
||||
actions.showEditAccountModal(identity) |
||||
}, |
||||
}, [ |
||||
this.context.t('edit'), |
||||
]), |
||||
]), |
||||
|
||||
]), |
||||
] |
||||
) |
||||
}) |
||||
} |
||||
|
||||
indicateIfLoose (keyring) { |
||||
try { // Sometimes keyrings aren't loaded yet:
|
||||
const type = keyring.type |
||||
const isLoose = type !== 'HD Key Tree' |
||||
return isLoose ? h('.keyring-label.allcaps', this.context.t('loose')) : null |
||||
} catch (e) { return } |
||||
} |
||||
|
||||
renderAccountSelector () { |
||||
const { actions, useCssTransition, innerStyle, sidebarOpen } = this.props |
||||
const { accountSelectorActive, menuItemStyles } = this.state |
||||
|
||||
return h( |
||||
Dropdown, |
||||
{ |
||||
useCssTransition, |
||||
style: { |
||||
marginLeft: '-185px', |
||||
marginTop: '50px', |
||||
minWidth: '180px', |
||||
overflowY: 'auto', |
||||
maxHeight: '300px', |
||||
width: '300px', |
||||
}, |
||||
innerStyle, |
||||
isOpen: accountSelectorActive, |
||||
onClickOutside: (event) => { |
||||
const { classList } = event.target |
||||
const isNotToggleElement = !classList.contains(this.accountSelectorToggleClassName) |
||||
if (accountSelectorActive && isNotToggleElement) { |
||||
this.setState({ accountSelectorActive: false }) |
||||
} |
||||
}, |
||||
}, |
||||
[ |
||||
...this.renderAccounts(), |
||||
h( |
||||
DropdownMenuItem, |
||||
{ |
||||
closeMenu: () => {}, |
||||
style: Object.assign( |
||||
{}, |
||||
menuItemStyles, |
||||
), |
||||
onClick: () => actions.showNewAccountPageCreateForm(), |
||||
}, |
||||
[ |
||||
h( |
||||
'i.fa.fa-plus.fa-lg', |
||||
{ |
||||
style: { |
||||
marginLeft: '8px', |
||||
}, |
||||
} |
||||
), |
||||
h('span', { |
||||
style: { |
||||
marginLeft: '14px', |
||||
fontFamily: 'DIN OT', |
||||
fontSize: '16px', |
||||
lineHeight: '23px', |
||||
}, |
||||
}, this.context.t('createAccount')), |
||||
], |
||||
), |
||||
h( |
||||
DropdownMenuItem, |
||||
{ |
||||
closeMenu: () => { |
||||
if (sidebarOpen) { |
||||
actions.hideSidebar() |
||||
} |
||||
}, |
||||
onClick: () => actions.showNewAccountPageImportForm(), |
||||
style: Object.assign( |
||||
{}, |
||||
menuItemStyles, |
||||
), |
||||
}, |
||||
[ |
||||
h( |
||||
'i.fa.fa-download.fa-lg', |
||||
{ |
||||
style: { |
||||
marginLeft: '8px', |
||||
}, |
||||
} |
||||
), |
||||
h('span', { |
||||
style: { |
||||
marginLeft: '20px', |
||||
marginBottom: '5px', |
||||
fontFamily: 'DIN OT', |
||||
fontSize: '16px', |
||||
lineHeight: '23px', |
||||
}, |
||||
}, this.context.t('importAccount')), |
||||
] |
||||
), |
||||
] |
||||
) |
||||
} |
||||
|
||||
renderAccountOptions () { |
||||
const { actions, dropdownWrapperStyle, useCssTransition } = this.props |
||||
const { optionsMenuActive, menuItemStyles } = this.state |
||||
const dropdownMenuItemStyle = { |
||||
fontFamily: 'DIN OT', |
||||
fontSize: 16, |
||||
lineHeight: '24px', |
||||
padding: '8px', |
||||
} |
||||
|
||||
return h( |
||||
Dropdown, |
||||
{ |
||||
useCssTransition, |
||||
style: Object.assign( |
||||
{ |
||||
marginLeft: '-10px', |
||||
position: 'absolute', |
||||
width: '29vh', // affects both mobile and laptop views
|
||||
}, |
||||
dropdownWrapperStyle, |
||||
), |
||||
isOpen: optionsMenuActive, |
||||
onClickOutside: (event) => { |
||||
const { classList } = event.target |
||||
const isNotToggleElement = !classList.contains(this.optionsMenuToggleClassName) |
||||
if (optionsMenuActive && isNotToggleElement) { |
||||
this.setState({ optionsMenuActive: false }) |
||||
} |
||||
}, |
||||
}, |
||||
[ |
||||
h( |
||||
DropdownMenuItem, |
||||
{ |
||||
closeMenu: () => {}, |
||||
onClick: () => { |
||||
this.props.actions.showAccountDetailModal() |
||||
}, |
||||
style: Object.assign( |
||||
dropdownMenuItemStyle, |
||||
menuItemStyles, |
||||
), |
||||
}, |
||||
this.context.t('accountDetails'), |
||||
), |
||||
h( |
||||
DropdownMenuItem, |
||||
{ |
||||
closeMenu: () => {}, |
||||
onClick: () => { |
||||
const { selected, network } = this.props |
||||
const url = genAccountLink(selected, network) |
||||
global.platform.openWindow({ url }) |
||||
}, |
||||
style: Object.assign( |
||||
dropdownMenuItemStyle, |
||||
menuItemStyles, |
||||
), |
||||
}, |
||||
this.context.t('etherscanView'), |
||||
), |
||||
h( |
||||
DropdownMenuItem, |
||||
{ |
||||
closeMenu: () => {}, |
||||
onClick: () => { |
||||
const { selected } = this.props |
||||
copyToClipboard(checksumAddress(selected)) |
||||
}, |
||||
style: Object.assign( |
||||
dropdownMenuItemStyle, |
||||
menuItemStyles, |
||||
), |
||||
}, |
||||
this.context.t('copyAddress'), |
||||
), |
||||
h( |
||||
DropdownMenuItem, |
||||
{ |
||||
closeMenu: () => {}, |
||||
onClick: () => this.props.actions.showExportPrivateKeyModal(), |
||||
style: Object.assign( |
||||
dropdownMenuItemStyle, |
||||
menuItemStyles, |
||||
), |
||||
}, |
||||
this.context.t('exportPrivateKey'), |
||||
), |
||||
h( |
||||
DropdownMenuItem, |
||||
{ |
||||
closeMenu: () => {}, |
||||
onClick: () => { |
||||
actions.hideSidebar() |
||||
actions.showAddTokenPage() |
||||
}, |
||||
style: Object.assign( |
||||
dropdownMenuItemStyle, |
||||
menuItemStyles, |
||||
), |
||||
}, |
||||
this.context.t('addToken'), |
||||
), |
||||
|
||||
] |
||||
) |
||||
} |
||||
|
||||
render () { |
||||
const { style, enableAccountsSelector, enableAccountOptions } = this.props |
||||
const { optionsMenuActive, accountSelectorActive } = this.state |
||||
|
||||
return h( |
||||
'span', |
||||
{ |
||||
style: style, |
||||
}, |
||||
[ |
||||
enableAccountsSelector && h( |
||||
'i.fa.fa-angle-down', |
||||
{ |
||||
style: { |
||||
cursor: 'pointer', |
||||
}, |
||||
onClick: (event) => { |
||||
event.stopPropagation() |
||||
this.setState({ |
||||
accountSelectorActive: !accountSelectorActive, |
||||
optionsMenuActive: false, |
||||
}) |
||||
}, |
||||
}, |
||||
this.renderAccountSelector(), |
||||
), |
||||
enableAccountOptions && h( |
||||
'i.fa.fa-ellipsis-h', |
||||
{ |
||||
style: { |
||||
fontSize: '135%', |
||||
cursor: 'pointer', |
||||
}, |
||||
onClick: (event) => { |
||||
event.stopPropagation() |
||||
this.setState({ |
||||
accountSelectorActive: false, |
||||
optionsMenuActive: !optionsMenuActive, |
||||
}) |
||||
}, |
||||
}, |
||||
this.renderAccountOptions() |
||||
), |
||||
] |
||||
) |
||||
} |
||||
} |
||||
|
||||
AccountDropdowns.defaultProps = { |
||||
enableAccountsSelector: false, |
||||
enableAccountOptions: false, |
||||
} |
||||
|
||||
AccountDropdowns.propTypes = { |
||||
identities: PropTypes.objectOf(PropTypes.object), |
||||
selected: PropTypes.string, |
||||
keyrings: PropTypes.array, |
||||
accounts: PropTypes.object, |
||||
menuItemStyles: PropTypes.object, |
||||
actions: PropTypes.object, |
||||
// actions.showAccountDetail: ,
|
||||
useCssTransition: PropTypes.bool, |
||||
innerStyle: PropTypes.object, |
||||
sidebarOpen: PropTypes.bool, |
||||
dropdownWrapperStyle: PropTypes.string, |
||||
// actions.showAccountDetailModal: ,
|
||||
network: PropTypes.number, |
||||
// actions.showExportPrivateKeyModal: ,
|
||||
style: PropTypes.object, |
||||
ticker: PropTypes.string, |
||||
enableAccountsSelector: PropTypes.bool, |
||||
enableAccountOption: PropTypes.bool, |
||||
enableAccountOptions: PropTypes.bool, |
||||
t: PropTypes.func, |
||||
} |
||||
|
||||
const mapDispatchToProps = (dispatch) => { |
||||
return { |
||||
actions: { |
||||
hideSidebar: () => dispatch(actions.hideSidebar()), |
||||
showConfigPage: () => dispatch(actions.showConfigPage()), |
||||
showAccountDetail: (address) => dispatch(actions.showAccountDetail(address)), |
||||
showAccountDetailModal: () => { |
||||
dispatch(actions.showModal({ name: 'ACCOUNT_DETAILS' })) |
||||
}, |
||||
showEditAccountModal: (identity) => { |
||||
dispatch(actions.showModal({ |
||||
name: 'EDIT_ACCOUNT_NAME', |
||||
identity, |
||||
})) |
||||
}, |
||||
showNewAccountPageCreateForm: () => dispatch(actions.showNewAccountPage({ form: 'CREATE' })), |
||||
showExportPrivateKeyModal: () => { |
||||
dispatch(actions.showModal({ name: 'EXPORT_PRIVATE_KEY' })) |
||||
}, |
||||
showAddTokenPage: () => { |
||||
dispatch(actions.showAddTokenPage()) |
||||
}, |
||||
addNewAccount: () => dispatch(actions.addNewAccount()), |
||||
showNewAccountPageImportForm: () => dispatch(actions.showNewAccountPage({ form: 'IMPORT' })), |
||||
showQrView: (selected, identity) => dispatch(actions.showQrView(selected, identity)), |
||||
}, |
||||
} |
||||
} |
||||
|
||||
function mapStateToProps (state) { |
||||
return { |
||||
ticker: state.metamask.ticker, |
||||
keyrings: state.metamask.keyrings, |
||||
sidebarOpen: state.appState.sidebar.isOpen, |
||||
} |
||||
} |
||||
|
||||
AccountDropdowns.contextTypes = { |
||||
t: PropTypes.func, |
||||
} |
||||
|
||||
module.exports = connect(mapStateToProps, mapDispatchToProps)(AccountDropdowns) |
||||
|
||||
@ -1,138 +0,0 @@ |
||||
const inherits = require('util').inherits |
||||
const Component = require('react').Component |
||||
const PropTypes = require('prop-types') |
||||
const h = require('react-hyperscript') |
||||
const ReactMarkdown = require('react-markdown') |
||||
const linker = require('extension-link-enabler') |
||||
const findDOMNode = require('react-dom').findDOMNode |
||||
const connect = require('react-redux').connect |
||||
|
||||
Notice.contextTypes = { |
||||
t: PropTypes.func, |
||||
} |
||||
|
||||
module.exports = connect()(Notice) |
||||
|
||||
|
||||
inherits(Notice, Component) |
||||
function Notice () { |
||||
Component.call(this) |
||||
} |
||||
|
||||
Notice.prototype.render = function () { |
||||
const { notice, onConfirm } = this.props |
||||
const { title, date, body } = notice |
||||
const state = this.state || { disclaimerDisabled: true } |
||||
const disabled = state.disclaimerDisabled |
||||
|
||||
return ( |
||||
h('.flex-column.flex-center.flex-grow', { |
||||
style: { |
||||
width: '100%', |
||||
}, |
||||
}, [ |
||||
h('h3.flex-center.text-transform-uppercase.terms-header', { |
||||
style: { |
||||
background: '#EBEBEB', |
||||
color: '#AEAEAE', |
||||
width: '100%', |
||||
fontSize: '20px', |
||||
textAlign: 'center', |
||||
padding: 6, |
||||
}, |
||||
}, [ |
||||
title, |
||||
]), |
||||
|
||||
h('h5.flex-center.text-transform-uppercase.terms-header', { |
||||
style: { |
||||
background: '#EBEBEB', |
||||
color: '#AEAEAE', |
||||
marginBottom: 24, |
||||
width: '100%', |
||||
fontSize: '20px', |
||||
textAlign: 'center', |
||||
padding: 6, |
||||
}, |
||||
}, [ |
||||
date, |
||||
]), |
||||
|
||||
h('style', ` |
||||
|
||||
.markdown { |
||||
overflow-x: hidden; |
||||
} |
||||
|
||||
.markdown h1, .markdown h2, .markdown h3 { |
||||
margin: 10px 0; |
||||
font-weight: bold; |
||||
} |
||||
|
||||
.markdown strong { |
||||
font-weight: bold; |
||||
} |
||||
.markdown em { |
||||
font-style: italic; |
||||
} |
||||
|
||||
.markdown p { |
||||
margin: 10px 0; |
||||
} |
||||
|
||||
.markdown a { |
||||
color: #df6b0e; |
||||
} |
||||
|
||||
`),
|
||||
|
||||
h('div.markdown', { |
||||
onScroll: (e) => { |
||||
var object = e.currentTarget |
||||
if (object.offsetHeight + object.scrollTop + 100 >= object.scrollHeight) { |
||||
this.setState({disclaimerDisabled: false}) |
||||
} |
||||
}, |
||||
style: { |
||||
background: 'rgb(235, 235, 235)', |
||||
height: '310px', |
||||
padding: '6px', |
||||
width: '90%', |
||||
overflowY: 'scroll', |
||||
scroll: 'auto', |
||||
}, |
||||
}, [ |
||||
h(ReactMarkdown, { |
||||
className: 'notice-box', |
||||
source: body, |
||||
skipHtml: true, |
||||
}), |
||||
]), |
||||
|
||||
h('button.primary', { |
||||
disabled, |
||||
onClick: () => { |
||||
this.setState({disclaimerDisabled: true}, () => onConfirm()) |
||||
}, |
||||
style: { |
||||
marginTop: '18px', |
||||
}, |
||||
}, this.context.t('accept')), |
||||
]) |
||||
) |
||||
} |
||||
|
||||
Notice.prototype.componentDidMount = function () { |
||||
// eslint-disable-next-line react/no-find-dom-node
|
||||
var node = findDOMNode(this) |
||||
linker.setupListener(node) |
||||
if (document.getElementsByClassName('notice-box')[0].clientHeight < 310) { |
||||
this.setState({disclaimerDisabled: false}) |
||||
} |
||||
} |
||||
|
||||
Notice.prototype.componentWillUnmount = function () { |
||||
// eslint-disable-next-line react/no-find-dom-node
|
||||
var node = findDOMNode(this) |
||||
linker.teardownListener(node) |
||||
} |
||||
@ -1,203 +0,0 @@ |
||||
const { Component } = require('react') |
||||
const h = require('react-hyperscript') |
||||
const { connect } = require('react-redux') |
||||
const PropTypes = require('prop-types') |
||||
const ReactMarkdown = require('react-markdown') |
||||
const linker = require('extension-link-enabler') |
||||
const generateLostAccountsNotice = require('../../../lib/lost-accounts-notice') |
||||
const findDOMNode = require('react-dom').findDOMNode |
||||
const actions = require('../../store/actions') |
||||
const { DEFAULT_ROUTE } = require('../../helpers/constants/routes') |
||||
|
||||
class Notice extends Component { |
||||
constructor (props) { |
||||
super(props) |
||||
|
||||
this.state = { |
||||
disclaimerDisabled: true, |
||||
} |
||||
} |
||||
|
||||
componentWillMount () { |
||||
if (!this.props.notice) { |
||||
this.props.history.push(DEFAULT_ROUTE) |
||||
} |
||||
} |
||||
|
||||
componentDidMount () { |
||||
// eslint-disable-next-line react/no-find-dom-node
|
||||
var node = findDOMNode(this) |
||||
linker.setupListener(node) |
||||
if (document.getElementsByClassName('notice-box')[0].clientHeight < 310) { |
||||
this.setState({ disclaimerDisabled: false }) |
||||
} |
||||
} |
||||
|
||||
componentWillReceiveProps (nextProps) { |
||||
if (!nextProps.notice) { |
||||
this.props.history.push(DEFAULT_ROUTE) |
||||
} |
||||
} |
||||
|
||||
componentWillUnmount () { |
||||
// eslint-disable-next-line react/no-find-dom-node
|
||||
var node = findDOMNode(this) |
||||
linker.teardownListener(node) |
||||
} |
||||
|
||||
handleAccept () { |
||||
this.setState({ disclaimerDisabled: true }) |
||||
this.props.onConfirm() |
||||
} |
||||
|
||||
render () { |
||||
const { notice = {} } = this.props |
||||
const { title, date, body } = notice |
||||
const { disclaimerDisabled } = this.state |
||||
|
||||
return ( |
||||
h('.flex-column.flex-center.flex-grow', { |
||||
style: { |
||||
width: '100%', |
||||
}, |
||||
}, [ |
||||
h('h3.flex-center.text-transform-uppercase.terms-header', { |
||||
style: { |
||||
background: '#EBEBEB', |
||||
color: '#AEAEAE', |
||||
width: '100%', |
||||
fontSize: '20px', |
||||
textAlign: 'center', |
||||
padding: 6, |
||||
}, |
||||
}, [ |
||||
title, |
||||
]), |
||||
|
||||
h('h5.flex-center.text-transform-uppercase.terms-header', { |
||||
style: { |
||||
background: '#EBEBEB', |
||||
color: '#AEAEAE', |
||||
marginBottom: 24, |
||||
width: '100%', |
||||
fontSize: '20px', |
||||
textAlign: 'center', |
||||
padding: 6, |
||||
}, |
||||
}, [ |
||||
date, |
||||
]), |
||||
|
||||
h('style', ` |
||||
|
||||
.markdown { |
||||
overflow-x: hidden; |
||||
} |
||||
|
||||
.markdown h1, .markdown h2, .markdown h3 { |
||||
margin: 10px 0; |
||||
font-weight: bold; |
||||
} |
||||
|
||||
.markdown strong { |
||||
font-weight: bold; |
||||
} |
||||
.markdown em { |
||||
font-style: italic; |
||||
} |
||||
|
||||
.markdown p { |
||||
margin: 10px 0; |
||||
} |
||||
|
||||
.markdown a { |
||||
color: #df6b0e; |
||||
} |
||||
|
||||
`),
|
||||
|
||||
h('div.markdown', { |
||||
onScroll: (e) => { |
||||
var object = e.currentTarget |
||||
if (object.offsetHeight + object.scrollTop + 100 >= object.scrollHeight) { |
||||
this.setState({ disclaimerDisabled: false }) |
||||
} |
||||
}, |
||||
style: { |
||||
background: 'rgb(235, 235, 235)', |
||||
height: '310px', |
||||
padding: '6px', |
||||
width: '90%', |
||||
overflowY: 'scroll', |
||||
scroll: 'auto', |
||||
}, |
||||
}, [ |
||||
h(ReactMarkdown, { |
||||
className: 'notice-box', |
||||
source: body, |
||||
skipHtml: true, |
||||
}), |
||||
]), |
||||
|
||||
h('button.primary', { |
||||
disabled: disclaimerDisabled, |
||||
onClick: () => this.handleAccept(), |
||||
style: { |
||||
marginTop: '18px', |
||||
}, |
||||
}, 'Accept'), |
||||
]) |
||||
) |
||||
} |
||||
|
||||
} |
||||
|
||||
const mapStateToProps = state => { |
||||
const { metamask } = state |
||||
const { noActiveNotices, nextUnreadNotice, lostAccounts } = metamask |
||||
|
||||
return { |
||||
noActiveNotices, |
||||
nextUnreadNotice, |
||||
lostAccounts, |
||||
} |
||||
} |
||||
|
||||
Notice.propTypes = { |
||||
notice: PropTypes.object, |
||||
onConfirm: PropTypes.func, |
||||
history: PropTypes.object, |
||||
} |
||||
|
||||
const mapDispatchToProps = dispatch => { |
||||
return { |
||||
markNoticeRead: nextUnreadNotice => dispatch(actions.markNoticeRead(nextUnreadNotice)), |
||||
markAccountsFound: () => dispatch(actions.markAccountsFound()), |
||||
} |
||||
} |
||||
|
||||
const mergeProps = (stateProps, dispatchProps, ownProps) => { |
||||
const { noActiveNotices, nextUnreadNotice, lostAccounts } = stateProps |
||||
const { markNoticeRead, markAccountsFound } = dispatchProps |
||||
|
||||
let notice |
||||
let onConfirm |
||||
|
||||
if (!noActiveNotices) { |
||||
notice = nextUnreadNotice |
||||
onConfirm = () => markNoticeRead(nextUnreadNotice) |
||||
} else if (lostAccounts && lostAccounts.length > 0) { |
||||
notice = generateLostAccountsNotice(lostAccounts) |
||||
onConfirm = () => markAccountsFound() |
||||
} |
||||
|
||||
return { |
||||
...stateProps, |
||||
...dispatchProps, |
||||
...ownProps, |
||||
notice, |
||||
onConfirm, |
||||
} |
||||
} |
||||
|
||||
module.exports = connect(mapStateToProps, mapDispatchToProps, mergeProps)(Notice) |
||||
Loading…
Reference in new issue