blockchain_view.js 21 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421
  1. const { div, h2, h3, p, section, button, form, a, input, span, pre, table, tr, td, strong } = require("../server/node_modules/hyperaxe");
  2. const { template, i18n } = require("../views/main_views");
  3. const moment = require("../server/node_modules/moment");
  4. const FILTER_LABELS = {
  5. votes: i18n.typeVotes, vote: i18n.typeVote, recent: i18n.recent, all: i18n.all,
  6. mine: i18n.mine, tombstone: i18n.typeTombstone, logs: i18n.typeLog || 'LOGS', pixelia: i18n.typePixelia,
  7. curriculum: i18n.typeCurriculum, document: i18n.typeDocument, bookmark: i18n.typeBookmark,
  8. feed: i18n.typeFeed, event: i18n.typeEvent, task: i18n.typeTask, report: i18n.typeReport,
  9. image: i18n.typeImage, audio: i18n.typeAudio, video: i18n.typeVideo, post: i18n.typePost,
  10. forum: i18n.typeForum, about: i18n.typeAbout, contact: i18n.typeContact, pub: i18n.typePub,
  11. transfer: i18n.typeTransfer, market: i18n.typeMarket, job: i18n.typeJob, tribe: i18n.typeTribe,
  12. project: i18n.typeProject, banking: i18n.typeBanking, bankWallet: i18n.typeBankWallet, bankClaim: i18n.typeBankClaim,
  13. aiExchange: i18n.typeAiExchange, parliament: i18n.typeParliament, courts: i18n.typeCourts,
  14. map: i18n.typeMap, shop: i18n.typeShop, shopProduct: i18n.typeShopProduct || 'Shop Product',
  15. pad: i18n.typePad || 'PAD', chat: i18n.typeChat || 'CHAT', gameScore: i18n.typeGameScore || 'GAME SCORE',
  16. calendar: i18n.typeCalendar || 'CALENDAR', torrent: i18n.typeTorrent
  17. };
  18. const BASE_FILTERS = ['recent', 'all', 'mine', 'tombstone', 'logs'];
  19. const CAT_BLOCK1 = ['votes', 'event', 'task', 'report', 'calendar', 'parliament', 'courts'];
  20. const CAT_BLOCK2 = ['pub', 'tribe', 'about', 'contact', 'curriculum', 'vote', 'aiExchange'];
  21. const CAT_BLOCK3 = ['banking', 'job', 'market', 'project', 'transfer', 'feed', 'post', 'pixelia', 'shop', 'gameScore'];
  22. const CAT_BLOCK4 = ['forum', 'pad', 'chat', 'bookmark', 'image', 'video', 'audio', 'document', 'map', 'torrent'];
  23. const SEARCH_FIELDS = ['author','id','from','to'];
  24. const hiddenSearchInputs = (search) =>
  25. SEARCH_FIELDS.map(k => {
  26. const v = String(search?.[k] ?? '').trim();
  27. return v ? input({ type: 'hidden', name: k, value: v }) : null;
  28. }).filter(Boolean);
  29. const toDatetimeLocal = (s) => {
  30. const raw = String(s || '').trim();
  31. if (!raw) return '';
  32. const ts = new Date(raw).getTime();
  33. if (!Number.isFinite(ts)) return '';
  34. return moment(ts).format('YYYY-MM-DDTHH:mm');
  35. };
  36. const toQueryString = (filter, search = {}) => {
  37. const parts = [];
  38. const f = String(filter || '').trim();
  39. if (f) parts.push(`filter=${encodeURIComponent(f)}`);
  40. for (const k of SEARCH_FIELDS) {
  41. const v = String(search?.[k] ?? '').trim();
  42. if (v) parts.push(`${encodeURIComponent(k)}=${encodeURIComponent(v)}`);
  43. }
  44. return parts.length ? `?${parts.join('&')}` : '';
  45. };
  46. const filterBlocks = (blocks, filter, userId) => {
  47. if (filter === 'recent') return blocks.filter(b => Date.now() - b.ts < 24*60*60*1000);
  48. if (filter === 'mine') return blocks.filter(b => b.author === userId);
  49. if (filter === 'all') return blocks;
  50. if (filter === 'banking') return blocks.filter(b => b.type === 'bankWallet' || b.type === 'bankClaim');
  51. if (filter === 'parliament') {
  52. const pset = new Set(['parliamentTerm','parliamentProposal','parliamentLaw','parliamentCandidature','parliamentRevocation']);
  53. return blocks.filter(b => pset.has(b.type));
  54. }
  55. if (filter === 'courts') {
  56. const cset = new Set(['courtsCase','courtsEvidence','courtsAnswer','courtsVerdict','courtsSettlement','courtsSettlementProposal','courtsSettlementAccepted','courtsNomination','courtsNominationVote']);
  57. return blocks.filter(b => cset.has(b.type));
  58. }
  59. if (filter === 'shop') return blocks.filter(b => b.type === 'shop' || b.type === 'shopProduct');
  60. if (filter === 'logs') return blocks.filter(b => b.type === 'log' && b.author === userId);
  61. return blocks.filter(b => b.type === filter);
  62. };
  63. const generateFilterButtons = (filters, currentFilter, action, search = {}) =>
  64. div({ class: 'mode-buttons-cols' },
  65. filters.map(mode =>
  66. form({ method: 'GET', action },
  67. input({ type: 'hidden', name: 'filter', value: mode }),
  68. ...hiddenSearchInputs(search),
  69. button({
  70. type: 'submit',
  71. class: currentFilter === mode ? 'filter-btn active' : 'filter-btn'
  72. }, (FILTER_LABELS[mode]||mode).toUpperCase())
  73. )
  74. )
  75. );
  76. const getViewDetailsAction = (type, block) => {
  77. switch (type) {
  78. case 'votes': return `/votes/${encodeURIComponent(block.id)}`;
  79. case 'transfer': return `/transfers/${encodeURIComponent(block.id)}`;
  80. case 'pixelia': return `/pixelia`;
  81. case 'tribe': return `/tribe/${encodeURIComponent(block.id)}`;
  82. case 'curriculum': return `/inhabitant/${encodeURIComponent(block.author)}`;
  83. case 'image': return `/images/${encodeURIComponent(block.id)}`;
  84. case 'audio': return `/audios/${encodeURIComponent(block.id)}`;
  85. case 'video': return `/videos/${encodeURIComponent(block.id)}`;
  86. case 'forum': return `/forum/${encodeURIComponent(block.content?.key||block.id)}`;
  87. case 'document': return `/documents/${encodeURIComponent(block.id)}`;
  88. case 'bookmark': return `/bookmarks/${encodeURIComponent(block.id)}`;
  89. case 'event': return `/events/${encodeURIComponent(block.id)}`;
  90. case 'task': return `/tasks/${encodeURIComponent(block.id)}`;
  91. case 'about': return `/author/${encodeURIComponent(block.author)}`;
  92. case 'post': return `/thread/${encodeURIComponent(block.id)}#${encodeURIComponent(block.id)}`;
  93. case 'vote': return `/thread/${encodeURIComponent(block.content.vote.link)}#${encodeURIComponent(block.content.vote.link)}`;
  94. case 'contact': return `/inhabitants`;
  95. case 'pub': return `/invites`;
  96. case 'market': return `/market/${encodeURIComponent(block.id)}`;
  97. case 'job': return `/jobs/${encodeURIComponent(block.id)}`;
  98. case 'project': return `/projects/${encodeURIComponent(block.id)}`;
  99. case 'report': return `/reports/${encodeURIComponent(block.id)}`;
  100. case 'calendar': return `/calendars/${encodeURIComponent(block.id)}`;
  101. case 'bankWallet': return `/wallet`;
  102. case 'bankClaim': return `/banking${block.content?.epochId ? `/epoch/${encodeURIComponent(block.content.epochId)}` : ''}`;
  103. case 'parliamentTerm': return `/parliament`;
  104. case 'parliamentProposal': return `/parliament`;
  105. case 'parliamentLaw': return `/parliament`;
  106. case 'parliamentCandidature': return `/parliament`;
  107. case 'parliamentRevocation': return `/parliament`;
  108. case 'courtsCase': return `/courts`;
  109. case 'courtsEvidence': return `/courts`;
  110. case 'courtsAnswer': return `/courts`;
  111. case 'courtsVerdict': return `/courts`;
  112. case 'courtsSettlement': return `/courts`;
  113. case 'courtsSettlementProposal': return `/courts`;
  114. case 'courtsSettlementAccepted': return `/courts`;
  115. case 'courtsNomination': return `/courts`;
  116. case 'courtsNominationVote': return `/courts`;
  117. case 'map': return `/maps/${encodeURIComponent(block.id)}`;
  118. case 'torrent': return `/torrents/${encodeURIComponent(block.id)}`;
  119. case 'mapMarker': return block.content?.mapId ? `/maps/${encodeURIComponent(block.content.mapId)}` : `/maps`;
  120. case 'shop': return `/shops/${encodeURIComponent(block.id)}`;
  121. case 'shopProduct': return `/shops/product/${encodeURIComponent(block.id)}`;
  122. case 'pad': return `/pads/${encodeURIComponent(block.id)}`;
  123. case 'chat': return `/chats/${encodeURIComponent(block.id)}`;
  124. case 'gameScore': return `/games?filter=scoring`;
  125. case 'log': return `/logs/view/${encodeURIComponent(block.id)}`;
  126. default: return null;
  127. }
  128. };
  129. const TYPE_COLORS = {
  130. post:'#3498db', vote:'#9b59b6', votes:'#9b59b6', about:'#1abc9c', contact:'#16a085',
  131. pub:'#2ecc71', tribe:'#e67e22', event:'#e74c3c', task:'#f39c12', report:'#c0392b',
  132. image:'#2980b9', audio:'#8e44ad', video:'#d35400', document:'#27ae60', bookmark:'#f1c40f',
  133. forum:'#1abc9c', feed:'#95a5a6', transfer:'#e74c3c', market:'#e67e22', job:'#3498db',
  134. project:'#2ecc71', banking:'#f39c12', bankWallet:'#f39c12', bankClaim:'#f39c12',
  135. pixelia:'#9b59b6', curriculum:'#1abc9c', aiExchange:'#3498db', tombstone:'#7f8c8d',
  136. parliamentTerm:'#8e44ad', parliamentProposal:'#8e44ad', parliamentLaw:'#8e44ad',
  137. parliamentCandidature:'#8e44ad', parliamentRevocation:'#8e44ad',
  138. courtsCase:'#c0392b', courtsEvidence:'#c0392b', courtsAnswer:'#c0392b',
  139. courtsVerdict:'#c0392b', courtsSettlement:'#c0392b', courtsNomination:'#c0392b',
  140. map:'#27ae60', mapMarker:'#27ae60',
  141. shop:'#e67e22', shopProduct:'#e67e22',
  142. pad:'#2ecc71', chat:'#3498db', gameScore:'#f39c12',
  143. calendar:'#e74c3c'
  144. };
  145. const renderBlockDiagram = (blocks, qs) => {
  146. const last2 = blocks.slice(0, 2);
  147. if (!last2.length) return null;
  148. return div({ class: 'block-diagram-section' },
  149. h3({ class: 'block-diagram-title' }, i18n.blockchainLatestDatagram || 'Latest Datagram'),
  150. ...last2.map(block => {
  151. const ts = moment(block.ts).format('YYYY-MM-DD HH:mm:ss');
  152. const typeLabel = (FILTER_LABELS[block.type] || block.type).toUpperCase();
  153. const color = TYPE_COLORS[block.type] || '#95a5a6';
  154. const shortId = block.id.length > 20 ? block.id.slice(0, 10) + '…' + block.id.slice(-8) : block.id;
  155. const shortAuthor = block.author.length > 20 ? block.author.slice(0, 10) + '…' + block.author.slice(-8) : block.author;
  156. const contentKeys = Object.keys(block.content || {}).filter(k => k !== 'type').join(', ');
  157. const flags = [
  158. block.isTombstoned ? 'TOMBSTONED' : null,
  159. block.isReplaced ? 'REPLACED' : null,
  160. block.content?.replaces ? 'EDIT' : null
  161. ].filter(Boolean).join(' | ') || '—';
  162. const datagramQs = qs ? `${qs}&view=datagram` : '?view=datagram';
  163. return a({ href: `/blockexplorer/block/${encodeURIComponent(block.id)}${datagramQs}`, class: 'block-diagram-link' },
  164. div({ class: 'block-diagram', style: `border-color:${color};` },
  165. div({ class: 'block-diagram-ruler', style: `border-bottom-color:${color};` },
  166. span('0'), span('4'), span('8'), span('16'), span('24'), span('31')
  167. ),
  168. div({ class: 'block-diagram-grid' },
  169. div({ class: 'block-diagram-cell bd-seq' },
  170. span({ class: 'bd-label' }, 'SEQ:'),
  171. span({ class: 'bd-value' }, String(block.content?.sequence || '—'))
  172. ),
  173. div({ class: 'block-diagram-cell bd-type' },
  174. span({ class: 'bd-label' }, 'TYPE:'),
  175. span({ class: 'bd-value' }, typeLabel)
  176. ),
  177. div({ class: 'block-diagram-cell bd-ts' },
  178. span({ class: 'bd-label' }, 'TIMESTAMP:'),
  179. span({ class: 'bd-value' }, ts)
  180. ),
  181. div({ class: 'block-diagram-cell bd-id' },
  182. span({ class: 'bd-label' }, 'BLOCK ID:'),
  183. span({ class: 'bd-value' }, shortId)
  184. ),
  185. div({ class: 'block-diagram-cell bd-author' },
  186. span({ class: 'bd-label' }, 'AUTHOR:'),
  187. span({ class: 'bd-value' }, shortAuthor)
  188. ),
  189. div({ class: 'block-diagram-cell bd-flags' },
  190. span({ class: 'bd-label' }, 'FLAGS:'),
  191. span({ class: 'bd-value' }, flags)
  192. ),
  193. div({ class: 'block-diagram-cell bd-ctype' },
  194. span({ class: 'bd-label' }, 'CONTENT.TYPE:'),
  195. span({ class: 'bd-value' }, block.content?.type || '—')
  196. ),
  197. div({ class: 'block-diagram-cell bd-data' },
  198. span({ class: 'bd-label' }, 'CONTENT:'),
  199. span({ class: 'bd-value' }, contentKeys || '—')
  200. )
  201. )
  202. )
  203. );
  204. })
  205. );
  206. };
  207. const renderSingleBlockView = (block, filter = 'recent', userId, search = {}, viewMode = 'block', restricted = false) => {
  208. if (!block) {
  209. return template(
  210. i18n.blockchain,
  211. section(
  212. div({ class: 'tags-header' },
  213. h2(i18n.blockchain),
  214. p(i18n.blockchainDescription)
  215. ),
  216. p(i18n.blockchainNoBlocks || 'No blocks')
  217. )
  218. );
  219. }
  220. const qs = toQueryString(filter, search);
  221. const isDatagram = viewMode === 'datagram';
  222. const blockContent = restricted
  223. ? div(
  224. div({ class: 'block-single' },
  225. div({ class: 'block-row block-row--meta' },
  226. span({ class: 'blockchain-card-label' }, `${i18n.blockchainBlockID}:`),
  227. span({ class: 'blockchain-card-value' }, block.id)
  228. ),
  229. div({ class: 'block-row block-row--meta' },
  230. span({ class: 'blockchain-card-label' }, `${i18n.blockchainBlockTimestamp}:`),
  231. span({ class: 'blockchain-card-value' }, moment(block.ts).format('YYYY-MM-DDTHH:mm:ss.SSSZ')),
  232. span({ class: 'blockchain-card-label' }, `${i18n.blockchainBlockType}:`),
  233. span({ class: 'blockchain-card-value' }, (FILTER_LABELS[block.type]||block.type).toUpperCase())
  234. )
  235. ),
  236. div({ class: 'block-row block-row--content' },
  237. p({ class: 'access-denied-msg' }, i18n.blockAccessRestricted)
  238. )
  239. )
  240. : isDatagram
  241. ? renderBlockDiagram([block], qs)
  242. : div(
  243. div({ class: 'block-single' },
  244. div({ class: 'block-row block-row--meta' },
  245. span({ class: 'blockchain-card-label' }, `${i18n.blockchainBlockID}:`),
  246. span({ class: 'blockchain-card-value' }, block.id)
  247. ),
  248. div({ class: 'block-row block-row--meta' },
  249. span({ class: 'blockchain-card-label' }, `${i18n.blockchainBlockTimestamp}:`),
  250. span({ class: 'blockchain-card-value' }, moment(block.ts).format('YYYY-MM-DDTHH:mm:ss.SSSZ')),
  251. span({ class: 'blockchain-card-label' }, `${i18n.blockchainBlockType}:`),
  252. span({ class: 'blockchain-card-value' }, (FILTER_LABELS[block.type]||block.type).toUpperCase())
  253. ),
  254. div({ class: 'block-row block-row--meta block-row--meta-spaced' },
  255. a({ href:`/author/${encodeURIComponent(block.author)}`, class:'block-author user-link' }, block.author)
  256. )
  257. ),
  258. div({ class:'block-row block-row--content' },
  259. div({ class:'block-content-preview' },
  260. block.content && typeof block.content.encryptedPayload === 'string'
  261. ? div({ class: 'encrypted-payload-box' },
  262. p({ class: 'encrypted-label' }, `[${i18n.bxEncrypted || 'ENCRYPTED'}]`),
  263. p({ class: 'encrypted-hex-label' }, i18n.bxEncryptedHexLabel || 'Ciphertext (preview)'),
  264. pre({ class: 'json-content' }, String(block.content.encryptedPayload).slice(0, 128) + (String(block.content.encryptedPayload).length > 128 ? '…' : ''))
  265. )
  266. : pre({ class:'json-content' }, JSON.stringify(block.content,null,2))
  267. )
  268. )
  269. );
  270. return template(
  271. i18n.blockchain,
  272. section(
  273. div({ class: 'tags-header' },
  274. h2(i18n.blockchain),
  275. p(i18n.blockchainDescription)
  276. ),
  277. div({ class: 'mode-buttons-row' },
  278. div({ class: 'filter-column' },
  279. generateFilterButtons(BASE_FILTERS, filter, '/blockexplorer', search)
  280. ),
  281. div({ class: 'filter-column' },
  282. generateFilterButtons(CAT_BLOCK1, filter, '/blockexplorer', search),
  283. generateFilterButtons(CAT_BLOCK2, filter, '/blockexplorer', search)
  284. ),
  285. div({ class: 'filter-column' },
  286. generateFilterButtons(CAT_BLOCK3, filter, '/blockexplorer', search),
  287. generateFilterButtons(CAT_BLOCK4, filter, '/blockexplorer', search)
  288. )
  289. ),
  290. blockContent,
  291. div({ class:'block-row block-row--back' },
  292. form({ method:'GET', action:'/blockexplorer' },
  293. input({ type: 'hidden', name: 'filter', value: filter }),
  294. ...hiddenSearchInputs(search),
  295. button({ type:'submit', class:'filter-btn' }, `← ${i18n.blockchainBack}`)
  296. ),
  297. !block.isTombstoned && !block.isReplaced && getViewDetailsAction(block.type, block) ?
  298. form({ method:'GET', action:getViewDetailsAction(block.type, block) },
  299. button({ type:'submit', class:'filter-btn' }, i18n.visitContent)
  300. )
  301. : (block.isTombstoned || block.isReplaced) ?
  302. div({ class: 'deleted-label' },
  303. i18n.blockchainContentDeleted || "This content has been deleted."
  304. )
  305. : null
  306. )
  307. )
  308. );
  309. };
  310. const renderBlockchainView = (blocks, filter, userId, search = {}) => {
  311. const s = search || {};
  312. const authorVal = String(s.author || '');
  313. const idVal = String(s.id || '');
  314. const fromVal = toDatetimeLocal(s.from);
  315. const toVal = toDatetimeLocal(s.to);
  316. const shown = filterBlocks(blocks, filter, userId);
  317. const qs = toQueryString(filter, s);
  318. return template(
  319. i18n.blockchain,
  320. section(
  321. div({ class:'tags-header' },
  322. h2(i18n.blockchain),
  323. p(i18n.blockchainDescription)
  324. ),
  325. div({ class:'mode-buttons-row' },
  326. div({ class: 'filter-column' },
  327. generateFilterButtons(BASE_FILTERS, filter, '/blockexplorer', s)
  328. ),
  329. div({ class: 'filter-column' },
  330. generateFilterButtons(CAT_BLOCK1, filter, '/blockexplorer', s),
  331. generateFilterButtons(CAT_BLOCK2, filter, '/blockexplorer', s)
  332. ),
  333. div({ class: 'filter-column' },
  334. generateFilterButtons(CAT_BLOCK3, filter, '/blockexplorer', s),
  335. generateFilterButtons(CAT_BLOCK4, filter, '/blockexplorer', s)
  336. )
  337. ),
  338. div({ class: 'blockexplorer-search' },
  339. form({ method: 'GET', action: '/blockexplorer', class: 'blockexplorer-search-form' },
  340. input({ type: 'hidden', name: 'filter', value: filter }),
  341. div({ class: 'blockexplorer-search-row' },
  342. div({ class: 'blockexplorer-search-pair' },
  343. input({ type: 'text', name: 'id', value: idVal, placeholder: i18n.blockchainBlockID, class: 'blockexplorer-search-input' }),
  344. input({ type: 'text', name: 'author', value: authorVal, placeholder: i18n.courtsJudgeIdPh, class: 'blockexplorer-search-input' })
  345. ),
  346. div({ class: 'blockexplorer-search-dates' },
  347. input({ type: 'datetime-local', name: 'from', value: fromVal, class: 'blockexplorer-search-input' }),
  348. input({ type: 'datetime-local', name: 'to', value: toVal, class: 'blockexplorer-search-input' })
  349. ),
  350. div({ class: 'blockexplorer-search-actions' },
  351. button({ type: 'submit', class: 'filter-box__button' }, i18n.searchSubmit)
  352. )
  353. )
  354. )
  355. ),
  356. renderBlockDiagram(shown, qs),
  357. h2({ class: 'block-diagram-title' }, 'Blockchain Blocks'),
  358. shown.length === 0
  359. ? div(p(i18n.blockchainNoBlocks))
  360. : shown
  361. .sort((a,b)=>{
  362. const ta = a.type==='market'&&a.content.updatedAt
  363. ? new Date(a.content.updatedAt).getTime()
  364. : a.ts;
  365. const tb = b.type==='market'&&b.content.updatedAt
  366. ? new Date(b.content.updatedAt).getTime()
  367. : b.ts;
  368. return tb - ta;
  369. })
  370. .map(block=>
  371. div({ class:'block' },
  372. div({ class:'block-buttons' },
  373. block.restricted ? null : a({ href:`/blockexplorer/block/${encodeURIComponent(block.id)}${qs}`, class:'btn-singleview', title:i18n.blockchainDetails }, '⦿'),
  374. block.restricted ? null : a({ href:`/blockexplorer/block/${encodeURIComponent(block.id)}${qs}&view=datagram`, class:'btn-singleview btn-datagram', title:i18n.blockchainDatagram || 'Datagram' }, '⊞'),
  375. !block.isTombstoned && !block.isReplaced && getViewDetailsAction(block.type, block) ?
  376. form({ method:'GET', action:getViewDetailsAction(block.type, block) },
  377. button({ type:'submit', class:'filter-btn' }, i18n.visitContent)
  378. )
  379. : (block.isTombstoned || block.isReplaced) ?
  380. div({ class: 'deleted-label' },
  381. i18n.blockchainContentDeleted || "This content has been deleted."
  382. )
  383. : null
  384. ),
  385. div({ class:'block-row block-row--meta' },
  386. table({ class:'block-info-table' },
  387. tr(td({ class:'card-label' }, i18n.blockchainBlockTimestamp), td({ class:'card-value' }, moment(block.ts).format('YYYY-MM-DDTHH:mm:ss.SSSZ'))),
  388. tr(td({ class:'card-label' }, i18n.blockchainBlockID), td({ class:'card-value' }, block.id)),
  389. tr(td({ class:'card-label' }, i18n.blockchainBlockType), td({ class:'card-value' }, (FILTER_LABELS[block.type]||block.type).toUpperCase())),
  390. tr(td({ class:'card-label' }, i18n.blockchainBlockAuthor), td({ class:'card-value' }, a({ href:`/author/${encodeURIComponent(block.author)}`, class:'block-author user-link' }, block.author)))
  391. )
  392. )
  393. )
  394. )
  395. )
  396. );
  397. };
  398. module.exports = { renderBlockchainView, renderSingleBlockView };