Add warning to web browser and fix links. (#6232)
This commit is contained in:
parent
b21932687a
commit
30be0972b9
@ -47,6 +47,7 @@
|
|||||||
color: rgb(0, 151, 167);
|
color: rgb(0, 151, 167);
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
.timestamp {
|
.timestamp {
|
||||||
|
@ -127,7 +127,7 @@ export default class Urls extends Component {
|
|||||||
this.props.store.gotoUrl(url);
|
this.props.store.gotoUrl(url);
|
||||||
|
|
||||||
if (extensionStore.hasExtension) {
|
if (extensionStore.hasExtension) {
|
||||||
window.open(this.props.store.currentUrl, '_blank');
|
window.open(url, '_blank');
|
||||||
} else {
|
} else {
|
||||||
router.push('/web');
|
router.push('/web');
|
||||||
}
|
}
|
||||||
|
@ -64,12 +64,9 @@ export default class Store {
|
|||||||
if (!hasProtocol.test(url)) {
|
if (!hasProtocol.test(url)) {
|
||||||
url = `https://${url}`;
|
url = `https://${url}`;
|
||||||
}
|
}
|
||||||
|
this.setNextUrl(url);
|
||||||
return this.generateToken(url).then(() => {
|
return this.generateToken(url).then(() => {
|
||||||
transaction(() => {
|
this.setCurrentUrl(this.nextUrl);
|
||||||
this.setNextUrl(url);
|
|
||||||
this.setCurrentUrl(this.nextUrl);
|
|
||||||
});
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -21,10 +21,39 @@
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
:root .warningClose {
|
||||||
|
text-align: right;
|
||||||
|
a {
|
||||||
|
color: #fff;
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.warning {
|
||||||
|
color: #fff;
|
||||||
|
background: #f80;
|
||||||
|
position: fixed;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 50%;
|
||||||
|
padding: 1.5em;
|
||||||
|
z-index: 100;
|
||||||
|
animation: fadein 0.3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes fadein {
|
||||||
|
from {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
to {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.loading {
|
.loading {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
margin-top: 5em;
|
margin-top: 5em;
|
||||||
color: #999;
|
color: #444;
|
||||||
font-size: 2em;
|
font-size: 2em;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -35,6 +35,10 @@ export default class Web extends Component {
|
|||||||
|
|
||||||
store = Store.get(this.context.api);
|
store = Store.get(this.context.api);
|
||||||
|
|
||||||
|
state = {
|
||||||
|
isWarningDismissed: false
|
||||||
|
}
|
||||||
|
|
||||||
componentDidMount () {
|
componentDidMount () {
|
||||||
this.store.gotoUrl(this.props.params.url);
|
this.store.gotoUrl(this.props.params.url);
|
||||||
}
|
}
|
||||||
@ -83,10 +87,36 @@ export default class Web extends Component {
|
|||||||
scrolling='auto'
|
scrolling='auto'
|
||||||
src={ encodedPath }
|
src={ encodedPath }
|
||||||
/>
|
/>
|
||||||
|
{ this.renderWarning() }
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
renderWarning () {
|
||||||
|
if (this.state.isWarningDismissed) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className={ styles.warning }>
|
||||||
|
<p>
|
||||||
|
WARNING: The web browser dapp is not safe as a general purpose browser.
|
||||||
|
Make sure to only visit web3-enabled sites that you trust.
|
||||||
|
Do not use it to browse web2.0 and never log in to any service - web3 dapps should not require that.
|
||||||
|
</p>
|
||||||
|
<div className={ styles.warningClose }>
|
||||||
|
<a onClick={ this.dismissWarning }>Okay!</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
dismissWarning = () => {
|
||||||
|
this.setState({
|
||||||
|
isWarningDismissed: true
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
iframeOnLoad = () => {
|
iframeOnLoad = () => {
|
||||||
this.store.setLoading(false);
|
this.store.setLoading(false);
|
||||||
};
|
};
|
||||||
|
Loading…
Reference in New Issue
Block a user