From 814aab0f842c781592c4f2a84a138963076a7183 Mon Sep 17 00:00:00 2001
From: NGUYEN DINH Quoc-Huy <contact@quoc-huy.com>
Date: Fri, 3 Apr 2020 11:30:23 +1100
Subject: [PATCH] Added witness description
---
src/app/components/pages/Witnesses.jsx | 72 +++++++++++++++++++++++--
src/app/components/pages/Witnesses.scss | 12 +++++
2 files changed, 79 insertions(+), 5 deletions(-)
diff --git a/src/app/components/pages/Witnesses.jsx b/src/app/components/pages/Witnesses.jsx
index 61a8f1ab..8500bd3b 100644
--- a/src/app/components/pages/Witnesses.jsx
+++ b/src/app/components/pages/Witnesses.jsx
@@ -1,5 +1,6 @@
import React from 'react';
import Moment from 'moment';
+import { api } from '@steemit/steem-js';
import classnames from 'classnames';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
@@ -13,8 +14,9 @@ import { formatLargeNumber } from 'app/utils/ParsersAndFormatters';
import ByteBuffer from 'bytebuffer';
import { is, Set, List } from 'immutable';
import * as globalActions from 'app/redux/GlobalReducer';
-import { vestsToHpf, numberWithCommas } from 'app/utils/StateFunctions';
+import { vestsToHpf } from 'app/utils/StateFunctions';
import tt from 'counterpart';
+import _ from 'lodash';
const Long = ByteBuffer.Long;
const { string, func, object } = PropTypes;
@@ -49,7 +51,12 @@ class Witnesses extends React.Component {
constructor() {
super();
- this.state = { customUsername: '', proxy: '', proxyFailed: false };
+ this.state = {
+ customUsername: '',
+ proxy: '',
+ proxyFailed: false,
+ witnessAccounts: {},
+ };
this.accountWitnessVote = (accountName, approve, e) => {
e.preventDefault();
const { username, accountWitnessVote } = this.props;
@@ -72,6 +79,8 @@ class Witnesses extends React.Component {
}
componentDidMount() {
+ this.loadWitnessAccounts();
+
if (typeof document !== 'undefined') {
setTimeout(() => {
const highlightedWitnessElement = document.querySelector(
@@ -97,10 +106,51 @@ class Witnesses extends React.Component {
np.username !== this.props.username ||
ns.customUsername !== this.state.customUsername ||
ns.proxy !== this.state.proxy ||
- ns.proxyFailed !== this.state.proxyFailed
+ ns.proxyFailed !== this.state.proxyFailed ||
+ ns.witnessAccounts !== this.state.witnessAccounts
);
}
+ async loadWitnessAccounts() {
+ const witnessAccounts = this.state.witnessAccounts;
+ const { witnesses } = this.props;
+ const witnessOwners = [[]];
+ let chunksCount = 0;
+
+ witnesses.map(item => {
+ if (witnessOwners[chunksCount].length >= 20) {
+ chunksCount += 1;
+ witnessOwners[chunksCount] = [];
+ }
+ witnessOwners[chunksCount].push(item.get('owner'));
+ return true;
+ });
+
+ for (let oi = 0; oi < witnessOwners.length; oi += 1) {
+ const owners = witnessOwners[oi];
+ const res = await api.getAccountsAsync(owners);
+ if (!(res && res.length > 0)) {
+ console.error(tt('g.account_not_found'));
+ return false;
+ }
+
+ for (let ri = 0; ri < res.length; ri += 1) {
+ const witnessAccount = res[ri];
+ let jsonMetadata = { witness_description: '' };
+ if (
+ witnessAccount.hasOwnProperty('json_metadata') &&
+ witnessAccount.json_metadata
+ ) {
+ jsonMetadata = JSON.parse(witnessAccount.json_metadata);
+ }
+ witnessAccounts[witnessAccount.name] = jsonMetadata;
+ }
+ }
+
+ this.setState({ witnessAccounts: { ...witnessAccounts } });
+ return true;
+ }
+
render() {
const {
props: {
@@ -109,7 +159,7 @@ class Witnesses extends React.Component {
current_proxy,
head_block,
},
- state: { customUsername, proxy },
+ state: { customUsername, proxy, witnessAccounts },
accountWitnessVote,
accountWitnessProxy,
onWitnessChange,
@@ -130,6 +180,11 @@ class Witnesses extends React.Component {
if (owner === witnessToHighlight) {
foundWitnessToHighlight = true;
}
+ const witnessDescription = _.get(
+ witnessAccounts[owner],
+ 'profile.witness_description',
+ null
+ );
const totalVotesVests = item.get('votes');
const totalVotesHpf = vestsToHpf(
this.props.state,
@@ -156,7 +211,9 @@ class Witnesses extends React.Component {
const myVote = witness_votes ? witness_votes.has(owner) : null;
const signingKey = item.get('signing_key');
const witnessCreated = item.get('created');
- const accountBirthday = Moment.utc(witnessCreated).format('ll');
+ const accountBirthday = Moment.utc(`${witnessCreated}Z`).format(
+ 'll'
+ );
const now = Moment();
const witnessAgeDays = now.diff(accountBirthday, 'days');
const witnessAgeWeeks = now.diff(accountBirthday, 'weeks');
@@ -261,6 +318,11 @@ class Witnesses extends React.Component {
</div>
<div>
<small>
+ {witnessDescription && (
+ <div className="Witnesses__description">
+ {witnessDescription}
+ </div>
+ )}
Produced block{' '}
<Link
to={`https://hiveblocks.com/b/${lastBlock}`}
diff --git a/src/app/components/pages/Witnesses.scss b/src/app/components/pages/Witnesses.scss
index 5469dad3..732421c9 100644
--- a/src/app/components/pages/Witnesses.scss
+++ b/src/app/components/pages/Witnesses.scss
@@ -53,6 +53,18 @@
div.Witnesses__highlight form input.input-group-field {
box-shadow: 0px 0px 3px 3px pink;
}
+ div.Witnesses__description {
+ display: block;
+ width: calc(100% - 20px);
+ max-width: 660px;
+ font-style: italic;
+ max-height: 5em;
+ overflow-x: hidden;
+ overflow-y: auto;
+ margin-left: 20px;
+ margin-bottom: 10px;
+ border-bottom: 1px dotted #dcdcdc;
+ }
}
--
GitLab