diff --git a/frontend/app/components/Dashboard/components/Errors/ErrorDetailsModal/ErrorDetailsModal.tsx b/frontend/app/components/Dashboard/components/Errors/ErrorDetailsModal/ErrorDetailsModal.tsx index 214dfd168..38f86af66 100644 --- a/frontend/app/components/Dashboard/components/Errors/ErrorDetailsModal/ErrorDetailsModal.tsx +++ b/frontend/app/components/Dashboard/components/Errors/ErrorDetailsModal/ErrorDetailsModal.tsx @@ -10,7 +10,7 @@ function ErrorDetailsModal(props: Props) { style={{ width: '85vw', maxWidth: '1200px' }} className="bg-white h-screen p-4 overflow-y-auto" > - + ); } diff --git a/frontend/app/components/Errors/Error/ErrorInfo.js b/frontend/app/components/Errors/Error/ErrorInfo.js index 8407826de..4b941d2de 100644 --- a/frontend/app/components/Errors/Error/ErrorInfo.js +++ b/frontend/app/components/Errors/Error/ErrorInfo.js @@ -11,6 +11,7 @@ import AnimatedSVG, { ICONS } from 'Shared/AnimatedSVG/AnimatedSVG'; @connect( (state) => ({ errorIdInStore: state.getIn(['errors', 'instance']).errorId, + list: state.getIn(['errors', 'instanceTrace']), loading: state.getIn(['errors', 'fetch', 'loading']) || state.getIn(['errors', 'fetchTrace', 'loading']), errorOnFetch: state.getIn(['errors', 'fetch', 'errors']) || state.getIn(['errors', 'fetchTrace', 'errors']), }), diff --git a/frontend/app/components/Errors/Error/MainSection.js b/frontend/app/components/Errors/Error/MainSection.js index 534f417f8..35b1fef7e 100644 --- a/frontend/app/components/Errors/Error/MainSection.js +++ b/frontend/app/components/Errors/Error/MainSection.js @@ -63,6 +63,7 @@ export default class MainSection extends React.PureComponent { render() { const { error, trace, sourcemapUploaded, ignoreLoading, resolveToggleLoading, toggleFavoriteLoading, className, traceLoading } = this.props; + const isPlayer = window.location.pathname.includes('/session/') return (
@@ -143,15 +144,17 @@ export default class MainSection extends React.PureComponent { />
*/} -
-

Last session with this error

- {resentOrDate(error.lastOccurrence)} - - -
+ {!isPlayer && ( +
+

Last session with this error

+ {resentOrDate(error.lastOccurrence)} + + +
+ )}
diff --git a/frontend/app/components/Session_/Exceptions/Exceptions.js b/frontend/app/components/Session_/Exceptions/Exceptions.js index 16371d110..b6c65b5ba 100644 --- a/frontend/app/components/Session_/Exceptions/Exceptions.js +++ b/frontend/app/components/Session_/Exceptions/Exceptions.js @@ -140,7 +140,7 @@ export default class Exceptions extends React.PureComponent { error={e} key={e.key} selected={lastIndex === index} - inactive={index > lastIndex} + // inactive={index > lastIndex} onErrorClick={(jsEvent) => { jsEvent.stopPropagation(); jsEvent.preventDefault(); diff --git a/frontend/app/components/ui/ErrorDetails/ErrorDetails.tsx b/frontend/app/components/ui/ErrorDetails/ErrorDetails.tsx index 8f8ba65b4..4acd355c2 100644 --- a/frontend/app/components/ui/ErrorDetails/ErrorDetails.tsx +++ b/frontend/app/components/ui/ErrorDetails/ErrorDetails.tsx @@ -18,6 +18,7 @@ function ErrorDetails(props: Props) { const { error, sessionId, message = '', errorStack = [], sourcemapUploaded = false } = props; const [showRaw, setShowRaw] = useState(false); const firstFunc = errorStack.first() && errorStack.first().function; + const openDocs = () => { window.open(docLink, '_blank'); @@ -77,7 +78,8 @@ function ErrorDetails(props: Props) { ErrorDetails.displayName = 'ErrorDetails'; export default connect( (state: any) => ({ - errorStack: state.getIn(['sessions', 'errorStack']), + // errorStack: state.getIn(['sessions', 'errorStack']), + errorStack: state.getIn(['errors', 'instanceTrace']), sessionId: state.getIn(['sessions', 'current', 'sessionId']), }), { fetchErrorStackList } diff --git a/frontend/app/components/ui/ErrorItem/ErrorItem.js b/frontend/app/components/ui/ErrorItem/ErrorItem.js index c74dfbc36..db6a7e6e8 100644 --- a/frontend/app/components/ui/ErrorItem/ErrorItem.js +++ b/frontend/app/components/ui/ErrorItem/ErrorItem.js @@ -3,8 +3,15 @@ import cn from 'classnames'; import { IconButton } from 'UI'; import stl from './errorItem.module.css'; import { Duration } from 'luxon'; +import { useModal } from 'App/components/Modal'; +import ErrorDetailsModal from 'App/components/Dashboard/components/Errors/ErrorDetailsModal'; -function ErrorItem({ error = {}, onErrorClick, onJump, inactive, selected }) { +function ErrorItem({ error = {}, onJump, inactive, selected }) { + const { showModal } = useModal(); + + const onErrorClick = () => { + showModal(, { right: true }); + } return (