-
Notifications
You must be signed in to change notification settings - Fork 36
/
TransactionFail.tsx
47 lines (44 loc) · 1.77 KB
/
TransactionFail.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
import React, { useEffect } from 'react';
import { useTranslation } from 'react-i18next';
import { ResultMessage } from '@components/ResultMessage';
import { useAnalyticsContext } from '@providers';
import { PostHogAction, TX_CREATION_TYPE_KEY, TxCreationType } from '@providers/AnalyticsProvider/analyticsTracker';
import styles from './TransactionSuccessView.module.scss';
import { useAnalyticsSendFlowTriggerPoint } from '../store';
import { CustomSubmitApiWarningBanner } from '@views/browser/components/CustomSubmitApiWarningBanner';
export const TransactionFail = (): React.ReactElement => {
const { t } = useTranslation();
const analytics = useAnalyticsContext();
const { triggerPoint } = useAnalyticsSendFlowTriggerPoint();
useEffect(() => {
analytics.sendEventToPostHog(PostHogAction.SendSomethingWentWrongView, {
// eslint-disable-next-line camelcase
trigger_point: triggerPoint,
[TX_CREATION_TYPE_KEY]: TxCreationType.Internal
});
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
return (
<div data-testid="tx-fail-container" className={styles.successTxContainer}>
<ResultMessage
status="error"
title={
<>
<div data-testid="send-error-title">{t('browserView.transaction.fail.oopsSomethingWentWrong')}</div>
</>
}
description={
<>
<div data-testid="send-error-description">
{t('browserView.transaction.fail.problemSubmittingYourTransaction')}
</div>
<div data-testid="send-error-description2" className={styles.message}>
{t('browserView.transaction.fail.clickBackAndTryAgain')}
</div>
<CustomSubmitApiWarningBanner />
</>
}
/>
</div>
);
};