Flatten recurring events (same block) (#3201)

* Flattn recurring events (same block)

* Same-height event filter

* Display adjust

* Filter {balances, treasury}.Deposit
This commit is contained in:
Jaco Greeff 2020-07-15 16:11:21 +02:00 committed by GitHub
parent bbb7912848
commit 927c1d02f9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
9 changed files with 55 additions and 51 deletions

View File

@ -3,7 +3,7 @@
// of the Apache-2.0 license. See the LICENSE file for details.
import { EventRecord, SignedBlock } from '@polkadot/types/interfaces';
import { KeyedEvent } from '../types';
import { KeyedEvent } from '@polkadot/react-query/types';
import React from 'react';
import { Link } from 'react-router-dom';
@ -29,6 +29,7 @@ function BlockByHash ({ className = '', value }: Props): React.ReactElement<Prop
isSingle: true,
transform: (events: EventRecord[]): KeyedEvent[] =>
events.map((record, index) => ({
indexes: [index],
key: `${Date.now()}-${index}-${record.hash.toHex()}`,
record
}))

View File

@ -3,7 +3,7 @@
// of the Apache-2.0 license. See the LICENSE file for details.
import { BlockNumber, Extrinsic } from '@polkadot/types/interfaces';
import { KeyedEvent } from '../types';
import { KeyedEvent } from '@polkadot/react-query/types';
import React from 'react';
import styled from 'styled-components';

View File

@ -3,7 +3,7 @@
// of the Apache-2.0 license. See the LICENSE file for details.
import { BlockNumber, Extrinsic } from '@polkadot/types/interfaces';
import { KeyedEvent } from '../types';
import { KeyedEvent } from '@polkadot/react-query/types';
import React, { useMemo } from 'react';
import { Table } from '@polkadot/react-components';

View File

@ -2,7 +2,7 @@
// This software may be modified and distributed under the terms
// of the Apache-2.0 license. See the LICENSE file for details.
import { KeyedEvent } from './types';
import { KeyedEvent } from '@polkadot/react-query/types';
import React, { useMemo } from 'react';
import { Link } from 'react-router-dom';
@ -34,24 +34,22 @@ function Events ({ className = '', emptyLabel, eventClassName, events, label }:
empty={emptyLabel || t<string>('No events available')}
header={header}
>
{events && events
.filter(({ record: { event: { method, section } } }) => !!method && !!section)
.map(({ blockHash, blockNumber, index, key, record }): React.ReactNode => (
<tr
className={eventClassName}
key={key}
>
<td className='overflow'>
<Event value={record} />
{blockNumber && (
<Link
className='event-link'
to={`/explorer/query/${blockHash || ''}`}>{formatNumber(blockNumber)}-{index}</Link>
)}
</td>
</tr>
))
}
{events && events.map(({ blockHash, blockNumber, indexes, key, record }): React.ReactNode => (
<tr
className={eventClassName}
key={key}
>
<td className='overflow'>
<Event value={record} />
{blockNumber && (
<div className='event-link'>
{indexes.length !== 1 && <span>({formatNumber(indexes.length)}x)&nbsp;</span>}
<Link to={`/explorer/query/${blockHash || ''}`}>{formatNumber(blockNumber)}-{indexes[0]}</Link>
</div>
)}
</td>
</tr>
))}
</Table>
);
}

View File

@ -2,7 +2,7 @@
// This software may be modified and distributed under the terms
// of the Apache-2.0 license. See the LICENSE file for details.
import { KeyedEvent } from './types';
import { KeyedEvent } from '@polkadot/react-query/types';
import React from 'react';
import { HeaderExtended } from '@polkadot/api-derive';

View File

@ -2,7 +2,7 @@
// This software may be modified and distributed under the terms
// of the Apache-2.0 license. See the LICENSE file for details.
import { KeyedEvent } from './types';
import { KeyedEvent } from '@polkadot/react-query/types';
import React, { useContext, useMemo } from 'react';
import { Route, Switch } from 'react-router';

View File

@ -22,7 +22,7 @@ interface Props {
children: React.ReactNode;
}
const MAX_HEADERS = 50;
const MAX_HEADERS = 75;
const byAuthor: Record<string, string> = {};
const eraPoints: Record<string, string> = {};
@ -66,7 +66,7 @@ function BlockAuthorsBase ({ children }: Props): React.ReactElement<Props> {
}
lastHeaders = lastHeaders
.filter((old, index): boolean => index < MAX_HEADERS && old.number.unwrap().lt(blockNumber))
.filter((old, index) => index < MAX_HEADERS && old.number.unwrap().lt(blockNumber))
.reduce((next, header): HeaderExtended[] => {
next.push(header);

View File

@ -2,31 +2,20 @@
// This software may be modified and distributed under the terms
// of the Apache-2.0 license. See the LICENSE file for details.
import { BlockNumber, EventRecord } from '@polkadot/types/interfaces';
import { IndexedEvent, KeyedEvent } from './types';
import React, { useEffect, useState } from 'react';
import { useApi } from '@polkadot/react-hooks';
import { stringToU8a } from '@polkadot/util';
import { xxhashAsHex } from '@polkadot/util-crypto';
interface IndexedEvent {
index: number;
record: EventRecord;
}
interface KeyedEvent extends IndexedEvent {
blockHash: string;
blockNumber: BlockNumber;
key: string;
}
type Events = KeyedEvent[];
interface Props {
children: React.ReactNode;
}
const MAX_EVENTS = 50;
const MAX_EVENTS = 75;
const EventsContext: React.Context<Events> = React.createContext<Events>([]);
@ -42,8 +31,20 @@ function EventsBase ({ children }: Props): React.ReactElement<Props> {
api.query.system.events((records): void => {
const newEvents: IndexedEvent[] = records
.map((record, index) => ({ index, record }))
.filter(({ record: { event: { section } } }) => section !== 'system');
.map((record, index) => ({ indexes: [index], record }))
.filter(({ record: { event: { method, section } } }) => section !== 'system' && (method !== 'Deposit' || !['balances', 'treasury'].includes(section)))
.reduce((combined: IndexedEvent[], e): IndexedEvent[] => {
const prev = combined.find(({ record: { event: { method, section } } }) => e.record.event.section === section && e.record.event.method === method);
if (prev) {
prev.indexes.push(...e.indexes);
} else {
combined.push(e);
}
return combined;
}, [])
.reverse();
const newEventHash = xxhashAsHex(stringToU8a(JSON.stringify(newEvents)));
if (newEventHash !== prevEventHash && newEvents.length) {
@ -58,14 +59,15 @@ function EventsBase ({ children }: Props): React.ReactElement<Props> {
prevBlockHash = blockHash;
setState((events) => [
...newEvents.map(({ index, record }): KeyedEvent => ({
...newEvents.map(({ indexes, record }): KeyedEvent => ({
blockHash,
blockNumber,
index,
key: `${blockNumber.toNumber()}-${blockHash}-${index}`,
indexes,
key: `${blockNumber.toNumber()}-${blockHash}-${indexes.join('.')}`,
record
})),
...events
// remove all events for the previous same-height blockNumber
...events.filter((p) => !p.blockNumber?.eq(blockNumber))
].slice(0, MAX_EVENTS));
}
}).catch(console.error);

View File

@ -1,13 +1,16 @@
// Copyright 2017-2020 @polkadot/app-explorer authors & contributors
// Copyright 2017-2020 @polkadot/react-query authors & contributors
// This software may be modified and distributed under the terms
// of the Apache-2.0 license. See the LICENSE file for details.
import { BlockNumber, EventRecord } from '@polkadot/types/interfaces';
export interface KeyedEvent {
blockHash?: string;
blockNumber?: BlockNumber;
index?: number;
key: string;
export interface IndexedEvent {
indexes: number[];
record: EventRecord;
}
export interface KeyedEvent extends IndexedEvent {
blockHash?: string;
blockNumber?: BlockNumber;
key: string;
}