1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-12 12:47:14 +01:00
metamask-extension/app/scripts/ui.js

145 lines
4.5 KiB
JavaScript
Raw Normal View History

// polyfills
import '@formatjs/intl-relativetimeformat/polyfill';
Build - refactor for bundle factoring and swappable runtime (#11080) * wip * build - breakout sentry-install bundle * deps - move new build sys deps to published versions * chore: lint fix * clean - remove unused file * clean - remove unsused package script * lavamoat - update build system policy * build - render html to all platforms * development - improve sourcemap debugger output * deps - update lavapack * lint - fix * deps - update lavapack for bugfix * deps - update lavapack for bugfix * deps - bump lavapack for line ending normalization * sourcemap explorer - disable boundary validation * ci - reset normal ci flow * build - re-enable minification on prod * build - remove noisy log about html dest * build - update terser and remove gulp wrapper for sourcemap fix * Revert "sourcemap explorer - disable boundary validation" This reverts commit 94112209ed880a6ebf4ee2ded411e59db6908162. * build - reenable react-devtools in dev mode * wip * build - breakout sentry-install bundle * deps - move new build sys deps to published versions * chore: lint fix * clean - remove unused file * clean - remove unsused package script * lavamoat - update build system policy * build - render html to all platforms * development - improve sourcemap debugger output * deps - update lavapack * lint - fix * deps - update lavapack for bugfix * deps - update lavapack for bugfix * deps - bump lavapack for line ending normalization * sourcemap explorer - disable boundary validation * ci - reset normal ci flow * build - re-enable minification on prod * build - remove noisy log about html dest * build - update terser and remove gulp wrapper for sourcemap fix * Revert "sourcemap explorer - disable boundary validation" This reverts commit 94112209ed880a6ebf4ee2ded411e59db6908162. * build - reenable react-devtools in dev mode * Updating lockfile * lint fix * build/dev - patch watchifys incompatible binary stats output * ui - add comment about conditional import * build - improve comment * Update development/stream-flat-map.js Co-authored-by: Brad Decker <git@braddecker.dev> * Outputting all bundle file links (metamaskbot) Co-authored-by: ryanml <ryanlanese@gmail.com> Co-authored-by: Brad Decker <git@braddecker.dev>
2021-07-15 19:59:34 +02:00
// dev only, "react-devtools" import is skipped in prod builds
import 'react-devtools';
import PortStream from 'extension-port-stream';
import extension from 'extensionizer';
import Eth from 'ethjs';
import EthQuery from 'eth-query';
import StreamProvider from 'web3-stream-provider';
import log from 'loglevel';
import launchMetaMaskUi from '../../ui';
import {
ENVIRONMENT_TYPE_FULLSCREEN,
ENVIRONMENT_TYPE_POPUP,
} from '../../shared/constants/app';
import ExtensionPlatform from './platforms/extension';
import { setupMultiplex } from './lib/stream-utils';
import { getEnvironmentType } from './lib/util';
import metaRPCClientFactory from './lib/metaRPCClientFactory';
2016-01-15 03:26:54 +01:00
start().catch(log.error);
2018-03-15 00:31:45 +01:00
2020-11-03 00:41:28 +01:00
async function start() {
2018-03-15 00:31:45 +01:00
// create platform global
global.platform = new ExtensionPlatform();
2018-03-15 00:31:45 +01:00
// identify window type (popup, notification)
const windowType = getEnvironmentType();
2018-03-15 00:31:45 +01:00
// setup stream to background
const extensionPort = extension.runtime.connect({ name: windowType });
const connectionStream = new PortStream(extensionPort);
2018-03-15 00:31:45 +01:00
const activeTab = await queryCurrentActiveTab(windowType);
initializeUiWithTab(activeTab);
2016-08-17 01:46:44 +02:00
2020-11-03 00:41:28 +01:00
function displayCriticalError(container, err) {
container.innerHTML =
'<div class="critical-error">The MetaMask app failed to load: please open and close MetaMask again to restart.</div>';
container.style.height = '80px';
log.error(err.stack);
throw err;
2016-08-24 00:44:50 +02:00
}
2020-11-03 00:41:28 +01:00
function initializeUiWithTab(tab) {
const container = document.getElementById('app-content');
initializeUi(tab, container, connectionStream, (err, store) => {
if (err) {
displayCriticalError(container, err);
return;
}
const state = store.getState();
const { metamask: { completedOnboarding } = {} } = state;
if (!completedOnboarding && windowType !== ENVIRONMENT_TYPE_FULLSCREEN) {
global.platform.openExtensionInBrowser();
}
});
}
}
2020-11-03 00:41:28 +01:00
async function queryCurrentActiveTab(windowType) {
return new Promise((resolve) => {
// At the time of writing we only have the `activeTab` permission which means
// that this query will only succeed in the popup context (i.e. after a "browserAction")
if (windowType !== ENVIRONMENT_TYPE_POPUP) {
resolve({});
return;
}
2019-12-03 21:50:55 +01:00
extension.tabs.query({ active: true, currentWindow: true }, (tabs) => {
const [activeTab] = tabs;
const { id, title, url } = activeTab;
const { origin, protocol } = url ? new URL(url) : {};
if (!origin || origin === 'null') {
resolve({});
return;
}
resolve({ id, title, origin, protocol, url });
});
});
}
2020-11-03 00:41:28 +01:00
function initializeUi(activeTab, container, connectionStream, cb) {
connectToAccountManager(connectionStream, (err, backgroundConnection) => {
if (err) {
cb(err);
return;
}
2020-11-03 00:41:28 +01:00
launchMetaMaskUi(
{
activeTab,
container,
backgroundConnection,
},
cb,
);
});
}
/**
* Establishes a connection to the background and a Web3 provider
*
* @param {PortDuplexStream} connectionStream - PortStream instance establishing a background connection
* @param {Function} cb - Called when controller connection is established
*/
2020-11-03 00:41:28 +01:00
function connectToAccountManager(connectionStream, cb) {
const mx = setupMultiplex(connectionStream);
setupControllerConnection(mx.createStream('controller'), cb);
setupWeb3Connection(mx.createStream('provider'));
}
/**
* Establishes a streamed connection to a Web3 provider
*
* @param {PortDuplexStream} connectionStream - PortStream instance establishing a background connection
*/
2020-11-03 00:41:28 +01:00
function setupWeb3Connection(connectionStream) {
const providerStream = new StreamProvider();
providerStream.pipe(connectionStream).pipe(providerStream);
connectionStream.on('error', console.error.bind(console));
providerStream.on('error', console.error.bind(console));
global.ethereumProvider = providerStream;
global.ethQuery = new EthQuery(providerStream);
global.eth = new Eth(providerStream);
}
/**
* Establishes a streamed connection to the background account manager
*
* @param {PortDuplexStream} connectionStream - PortStream instance establishing a background connection
* @param {Function} cb - Called when the remote account manager connection is established
*/
2020-11-03 00:41:28 +01:00
function setupControllerConnection(connectionStream, cb) {
const backgroundRPC = metaRPCClientFactory(connectionStream);
cb(null, backgroundRPC);
}