77 lines
No EOL
2.1 KiB
JavaScript
77 lines
No EOL
2.1 KiB
JavaScript
import React from 'react';
|
|
import { getIn, get } from 'immutable';
|
|
import cn from 'classnames';
|
|
import { withRequest } from 'HOCs';
|
|
import { Loader, Icon, JSONTree } from 'UI';
|
|
import { Accordion } from 'semantic-ui-react'
|
|
import stl from './sentry.module.css';
|
|
|
|
@withRequest({
|
|
endpoint: props => `/integrations/sentry/events/${ props.event.id }`,
|
|
dataName: "detailedEvent",
|
|
loadOnInitialize: true
|
|
})
|
|
export default class SentryEventInfo extends React.PureComponent {
|
|
|
|
makePanelsFromStackTrace(stacktrace) {
|
|
return get(stacktrace, 'frames', []).map(({ filename, function: method, lineNo, context = [] }) => ({
|
|
key: `${ filename }_${ method }_${ lineNo }`,
|
|
title: {
|
|
content: (
|
|
<span className={ stl.accordionTitle }>
|
|
<b>{ filename }</b>
|
|
{ ' in ' }
|
|
<b>{ method }</b>
|
|
{ ' at line '}
|
|
<b>{ lineNo }</b>
|
|
</span>
|
|
),
|
|
},
|
|
content: {
|
|
content: (
|
|
<ol start={ getIn(context, [ 0, 0 ], 0) } className={ stl.lineList }>
|
|
{ context.map(([ ctxLineNo, codeText ]) => (
|
|
<li className={ cn(stl.codeLine, { [ stl.highlighted ]: ctxLineNo === lineNo }) }>
|
|
{ codeText }
|
|
</li>
|
|
))}
|
|
</ol>
|
|
)}
|
|
}));
|
|
}
|
|
|
|
renderBody() {
|
|
const { detailedEvent, requestError, event } = this.props;
|
|
|
|
const exceptionEntry = get(detailedEvent, ['entries'], []).find(({ type }) => type === "exception");
|
|
const stacktraces = getIn(exceptionEntry, ['data', 'values']);
|
|
if (!stacktraces) {
|
|
return <JSONTree src={ requestError ? event : detailedEvent } sortKeys={ false } enableClipboard />
|
|
}
|
|
return stacktraces.map(({ type, value, stacktrace }) => (
|
|
<div key={ type } className={ stl.stacktrace } >
|
|
<h6>{ type }</h6>
|
|
<p>
|
|
{ value }
|
|
</p>
|
|
<Accordion styled panels={ this.makePanelsFromStackTrace(stacktrace) }/>
|
|
</div>
|
|
));
|
|
}
|
|
|
|
render() {
|
|
const {
|
|
open,
|
|
toggleOpen,
|
|
loading,
|
|
} = this.props;
|
|
return (
|
|
<div className={ stl.wrapper }>
|
|
<Icon className={ stl.icon } name="integrations/sentry-text" height="25" width="70" color="gray-medium"/>
|
|
<Loader loading={ loading } >
|
|
{ this.renderBody() }
|
|
</Loader>
|
|
</div>
|
|
);
|
|
}
|
|
} |