Add channel indicator component
This commit is contained in:
parent
af6981c164
commit
3e2b675e7b
3 changed files with 49 additions and 0 deletions
ui
43
ui/js/component/channel-indicator.js
Normal file
43
ui/js/component/channel-indicator.js
Normal file
|
@ -0,0 +1,43 @@
|
||||||
|
import React from 'react';
|
||||||
|
import lbry from '../lbry.js';
|
||||||
|
import uri from '../uri.js';
|
||||||
|
import {Icon} from './common.js';
|
||||||
|
|
||||||
|
const ChannelIndicator = React.createClass({
|
||||||
|
propTypes: {
|
||||||
|
uri: React.PropTypes.string.isRequired,
|
||||||
|
claimInfo: React.PropTypes.object.isRequired,
|
||||||
|
},
|
||||||
|
render: function() {
|
||||||
|
const {name, has_signature, signature_is_valid} = this.props.claimInfo;
|
||||||
|
if (!has_signature) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
const uriObj = uri.parseLbryUri(this.props.uri);
|
||||||
|
if (!uriObj.isChannel) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
const channelUriObj = Object.assign({}, uriObj);
|
||||||
|
delete channelUriObj.path;
|
||||||
|
const channelUri = uri.buildLbryUri(channelUriObj, false);
|
||||||
|
|
||||||
|
let icon, modifier;
|
||||||
|
if (!signature_is_valid) {
|
||||||
|
icon = 'icon-check-circle';
|
||||||
|
modifier = 'valid';
|
||||||
|
} else {
|
||||||
|
icon = 'icon-times-circle';
|
||||||
|
modifier = 'invalid';
|
||||||
|
}
|
||||||
|
return (
|
||||||
|
<span>
|
||||||
|
by <strong>{channelUri}</strong> {' '}
|
||||||
|
<Icon icon={icon} className={`channel-indicator__icon channel-indicator__icon--${modifier}`} />
|
||||||
|
</span>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
export default ChannelIndicator;
|
|
@ -10,5 +10,6 @@
|
||||||
@import "component/_menu.scss";
|
@import "component/_menu.scss";
|
||||||
@import "component/_tooltip.scss";
|
@import "component/_tooltip.scss";
|
||||||
@import "component/_load-screen.scss";
|
@import "component/_load-screen.scss";
|
||||||
|
@import "component/_channel-indicator.scss";
|
||||||
@import "page/_developer.scss";
|
@import "page/_developer.scss";
|
||||||
@import "page/_watch.scss";
|
@import "page/_watch.scss";
|
5
ui/scss/component/_channel-indicator.scss
Normal file
5
ui/scss/component/_channel-indicator.scss
Normal file
|
@ -0,0 +1,5 @@
|
||||||
|
@import "../global";
|
||||||
|
|
||||||
|
.channel-indicator__icon--invalid {
|
||||||
|
color: #b01c2e;
|
||||||
|
}
|
Loading…
Add table
Reference in a new issue