1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00
metamask-extension/shared/lib/error-utils.js
2023-08-03 00:23:00 +02:00

180 lines
5.7 KiB
JavaScript

///: BEGIN:ONLY_INCLUDE_IN(desktop)
import browser from 'webextension-polyfill';
///: END:ONLY_INCLUDE_IN
import { memoize } from 'lodash';
import getFirstPreferredLangCode from '../../app/scripts/lib/get-first-preferred-lang-code';
import { fetchLocale, loadRelativeTimeFormatLocaleData } from '../modules/i18n';
///: BEGIN:ONLY_INCLUDE_IN(desktop)
import { renderDesktopError } from '../../ui/pages/desktop-error/render-desktop-error';
import { EXTENSION_ERROR_PAGE_TYPES } from '../constants/desktop';
import { openCustomProtocol } from './deep-linking';
///: END:ONLY_INCLUDE_IN
import switchDirection from './switch-direction';
const _setupLocale = async (currentLocale) => {
const currentLocaleMessages = currentLocale
? await fetchLocale(currentLocale)
: {};
const enLocaleMessages = await fetchLocale('en');
await loadRelativeTimeFormatLocaleData('en');
if (currentLocale) {
await loadRelativeTimeFormatLocaleData(currentLocale);
}
return { currentLocaleMessages, enLocaleMessages };
};
export const setupLocale = memoize(_setupLocale);
const getLocaleContext = (currentLocaleMessages, enLocaleMessages) => {
return (key) => {
let message = currentLocaleMessages[key]?.message;
if (!message && enLocaleMessages[key]) {
message = enLocaleMessages[key].message;
}
return message;
};
};
export async function getErrorHtml(
errorKey,
supportLink,
metamaskState,
///: BEGIN:ONLY_INCLUDE_IN(desktop)
err,
///: END:ONLY_INCLUDE_IN
) {
let response, preferredLocale;
if (metamaskState?.currentLocale) {
preferredLocale = metamaskState.currentLocale;
response = await setupLocale(metamaskState.currentLocale);
} else {
preferredLocale = await getFirstPreferredLangCode();
response = await setupLocale(preferredLocale);
}
const textDirection = ['ar', 'dv', 'fa', 'he', 'ku'].includes(preferredLocale)
? 'rtl'
: 'auto';
switchDirection(textDirection);
const { currentLocaleMessages, enLocaleMessages } = response;
const t = getLocaleContext(currentLocaleMessages, enLocaleMessages);
///: BEGIN:ONLY_INCLUDE_IN(desktop)
const isDesktopEnabled = metamaskState?.desktopEnabled === true;
if (isDesktopEnabled) {
let errorType = EXTENSION_ERROR_PAGE_TYPES.CRITICAL_ERROR;
if (err?.message.includes('No response from RPC')) {
errorType = EXTENSION_ERROR_PAGE_TYPES.CONNECTION_LOST;
}
return renderDesktopError({
type: errorType,
t,
isHtmlError: true,
});
}
///: END:ONLY_INCLUDE_IN
/**
* The pattern ${errorKey === 'troubleStarting' ? t('troubleStarting') : ''}
* is neccessary because we we need linter to see the string
* of the locale keys. If we use the variable directly, the linter will not
* see the string and will not be able to check if the locale key exists.
*/
return `
<div class="critical-error__container">
<div class="critical-error">
<div class="critical-error__icon">
<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<path d="m443 342l-126-241c-16-32-40-50-65-50-26 0-50 18-66 50l-126 241c-16 30-18 60-5 83 13 23 38 36 71 36l251 0c33 0 58-13 71-36 13-23 11-53-5-83z m-206-145c0-8 6-15 15-15 8 0 14 7 14 15l0 105c0 8-6 15-14 15-9 0-15-7-15-15z m28 182c-1 1-2 2-3 3-1 0-2 1-3 1-1 1-2 1-4 2-1 0-2 0-3 0-2 0-3 0-4 0-2-1-3-1-4-2-1 0-2-1-3-1-1-1-2-2-3-3-4-4-6-9-6-15 0-5 2-11 6-15 1 0 2-1 3-2 1-1 2-2 3-2 1-1 2-1 4-1 2-1 5-1 7 0 2 0 3 0 4 1 1 0 2 1 3 2 1 1 2 2 3 2 4 4 6 10 6 15 0 6-2 11-6 15z"/>
</svg>
</div>
<div>
<p>
${errorKey === 'troubleStarting' ? t('troubleStarting') : ''}
${errorKey === 'somethingIsWrong' ? t('somethingIsWrong') : ''}
</p>
<div id="critical-error-button" class="critical-error__link critical-error__link-restart">
${t('restartMetamask')}
</div>
<p class="critical-error__footer">
<span>${t('stillGettingMessage')}</span>
<a
href=${supportLink}
class="critical-error__link"
target="_blank"
rel="noopener noreferrer">
${t('sendBugReport')}
</a>
</p>
</div>
</div>
</div>
`;
}
///: BEGIN:ONLY_INCLUDE_IN(desktop)
export const MMD_DOWNLOAD_LINK =
'https://github.com/MetaMask/metamask-desktop/releases';
function disableDesktop(backgroundConnection) {
backgroundConnection.disableDesktopError();
}
export function downloadDesktopApp() {
global.platform.openTab({
url: MMD_DOWNLOAD_LINK,
});
}
export function downloadExtension() {
global.platform.openTab({ url: 'https://metamask.io/' });
}
export function restartExtension() {
browser.runtime.reload();
}
export function openOrDownloadMMD() {
openCustomProtocol('metamask-desktop://pair').catch(() => {
window.open(MMD_DOWNLOAD_LINK, '_blank').focus();
});
}
export function registerDesktopErrorActions(backgroundConnection) {
const disableDesktopButton = document.getElementById(
'desktop-error-button-disable-mmd',
);
const restartMMButton = document.getElementById(
'desktop-error-button-restart-mm',
);
const downloadMMDButton = document.getElementById(
'desktop-error-button-download-mmd',
);
const openOrDownloadMMDButton = document.getElementById(
'desktop-error-button-open-or-download-mmd',
);
disableDesktopButton?.addEventListener('click', (_) => {
disableDesktop(backgroundConnection);
});
restartMMButton?.addEventListener('click', (_) => {
restartExtension();
});
downloadMMDButton?.addEventListener('click', (_) => {
downloadDesktopApp();
});
openOrDownloadMMDButton?.addEventListener('click', (_) => {
openOrDownloadMMD();
});
}
///: END:ONLY_INCLUDE_IN