ghost-portal/packages/app-explorer/src/Events.tsx
Jaco Greeff 0e2265ff70
Some initial pre-eslint cleanups (#1383)
* Some initial cleanups

* Make it lint

* Small s/type/interface/ additions

* Small minor s/type/interface/

* More type -> interface

* Add lint:new rule

* Some small updates

* Cleanup dangling tslint  issues

* Small updates

* ui-signer cleanups

* ui-reactive updated

* Make lint:new run

* Mini ui-params cleanups

* Some additions

* Tiny... and done for now.

* 1950 problems (1241 errors, 709 warnings)

* 1829 problems (1181 errors, 648 warnings)

* 1674 problems (1181 errors, 493 warnings) (no any... for now)

* Small additions.

* Array<T> -> T[] (all)
2019-07-14 22:27:12 +02:00

75 lines
2.0 KiB
TypeScript

// Copyright 2017-2019 @polkadot/app-explorer 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 { I18nProps } from '@polkadot/ui-app/types';
import { KeyedEvent } from './types';
import React from 'react';
import { Event as EventDisplay } from '@polkadot/ui-app';
import { formatNumber } from '@polkadot/util';
import translate from './translate';
interface Props extends I18nProps {
emptyLabel?: React.ReactNode;
events: KeyedEvent[];
eventClassName?: string;
withoutIndex?: boolean;
}
class Events extends React.PureComponent<Props> {
public render (): React.ReactNode {
const { emptyLabel, events, t } = this.props;
if (!events || events.length === 0) {
return <article>{emptyLabel || t('no events available')}</article>;
}
return events.map(this.renderEvent);
}
private renderEvent = ({ key, record: { event, phase } }: KeyedEvent): React.ReactNode => {
const { eventClassName, withoutIndex } = this.props;
const extIndex = !withoutIndex && phase.type === 'ApplyExtrinsic'
? phase.asApplyExtrinsic
: -1;
if (!event.method || !event.section) {
return null;
}
return (
<article
className={`explorer--Container ${eventClassName}`}
key={key}
>
<div className='header'>
<h3>
{event.section}.{event.method}&nbsp;{
extIndex !== -1
? `(#${formatNumber(extIndex)})`
: ''
}
</h3>
</div>
<details>
<summary>
{
event.meta && event.meta.documentation
? event.meta.documentation.join(' ')
: 'Details'
}
</summary>
<EventDisplay
className='details'
value={event}
/>
</details>
</article>
);
}
}
export default translate(Events);