m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00
Code

feature: convert ui/ducks/app/app.ts to typescript (#17454)

Browse Source 
Co-authored-by: Pedro Figueiredo <pedro.figueiredo@consensys.net>
This commit is contained in:
Danica Shen 2023-02-03 14:59:07 +00:00 committed by GitHub
parent 8fa45c5454
commit 6b076fa346
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 193 additions and 100 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

290
ui/ducks/app/app.js → ui/ducks/app/app.ts
View File

@ -1,64 +1,142 @@
import { AnyAction, Action } from 'redux';
import { PayloadAction } from '@reduxjs/toolkit';
import { import {
WebHIDConnectedStatuses, WebHIDConnectedStatuses,
HardwareTransportStates, HardwareTransportStates,
} from '../../../shared/constants/hardware-wallets'; } from '../../../shared/constants/hardware-wallets';
import { RPCDefinition } from '../../../shared/constants/network';
import * as actionConstants from '../../store/actionConstants'; import * as actionConstants from '../../store/actionConstants';
export default function reduceApp(state = {}, action) { interface AppState {
// default state shouldClose: boolean;
const appState = { menuOpen: boolean;
shouldClose: false, modal: {
menuOpen: false, open: boolean;
modal: { modalState: {
open: false, name: string | null;
modalState: { props: Record<string, any>;
name: null, };
props: {}, previousModalState: {
}, name: string | null;
previousModalState: { };
name: null, };
}, alertOpen: boolean;
alertMessage: string | null;
qrCodeData: {
type?: string | null;
values?: { address?: string | null };
} | null;
networkDropdownOpen: boolean;
accountDetail: {
subview?: string;
accountExport?: string;
privateKey?: string;
};
isLoading: boolean;
loadingMessage: string | null;
scrollToBottom: boolean;
warning: string | null | undefined;
buyView: Record<string, any>;
isMouseUser: boolean;
defaultHdPaths: {
trezor: string;
ledger: string;
lattice: string;
};
networksTabSelectedRpcUrl: string | null;
requestAccountTabs: Record<string, number>; // [url.origin]: tab.id
openMetaMaskTabs: Record<string, boolean>; // openMetamaskTabsIDs[tab.id]): true/false
currentWindowTab: Record<string, any>; // tabs.tab https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/tabs/Tab
showWhatsNewPopup: boolean;
singleExceptions: {
testKey: string | null;
};
gasLoadingAnimationIsShowing: boolean;
smartTransactionsError: string | null;
smartTransactionsErrorMessageDismissed: boolean;
ledgerWebHidConnectedStatus: WebHIDConnectedStatuses;
ledgerTransportStatus: HardwareTransportStates;
newNetworkAdded: string;
newCollectibleAddedMessage: string;
removeCollectibleMessage: string;
portfolioTooltipWasShownInThisSession: boolean;
sendInputCurrencySwitched: boolean;
newTokensImported: string;
newCustomNetworkAdded: RPCDefinition | Record<string, any>;
onboardedInThisUISession: boolean;
customTokenAmount: string;
txId: number | null;
}
interface AppSliceState {
appState: AppState;
}
// default state
const initialState: AppState = {
shouldClose: false,
menuOpen: false,
modal: {
open: false,
modalState: {
name: null,
props: {},
}, },
alertOpen: false, previousModalState: {
alertMessage: null, name: null,
qrCodeData: null,
networkDropdownOpen: false,
accountDetail: {
privateKey: '',
}, },
// Used to display loading indicator },
isLoading: false, alertOpen: false,
// Used to display error text alertMessage: null,
warning: null, qrCodeData: null,
buyView: {}, networkDropdownOpen: false,
isMouseUser: false, accountDetail: {
defaultHdPaths: { privateKey: '',
trezor: `m/44'/60'/0'/0`, },
ledger: `m/44'/60'/0'/0/0`, // Used to display loading indicator
lattice: `m/44'/60'/0'/0`, isLoading: false,
}, loadingMessage: null,
networksTabSelectedRpcUrl: '', // Used to display error text
requestAccountTabs: {}, warning: null,
openMetaMaskTabs: {}, buyView: {},
currentWindowTab: {}, isMouseUser: false,
showWhatsNewPopup: true, defaultHdPaths: {
singleExceptions: { trezor: `m/44'/60'/0'/0`,
testKey: null, ledger: `m/44'/60'/0'/0/0`,
}, lattice: `m/44'/60'/0'/0`,
gasLoadingAnimationIsShowing: false, },
smartTransactionsError: null, networksTabSelectedRpcUrl: '',
smartTransactionsErrorMessageDismissed: false, requestAccountTabs: {},
ledgerWebHidConnectedStatus: WebHIDConnectedStatuses.unknown, openMetaMaskTabs: {},
ledgerTransportStatus: HardwareTransportStates.none, currentWindowTab: {},
newNetworkAdded: '', showWhatsNewPopup: true,
newCollectibleAddedMessage: '', singleExceptions: {
removeCollectibleMessage: '', testKey: null,
portfolioTooltipWasShownInThisSession: false, },
sendInputCurrencySwitched: false, gasLoadingAnimationIsShowing: false,
newTokensImported: '', smartTransactionsError: null,
newCustomNetworkAdded: {}, smartTransactionsErrorMessageDismissed: false,
onboardedInThisUISession: false, ledgerWebHidConnectedStatus: WebHIDConnectedStatuses.unknown,
customTokenAmount: '', ledgerTransportStatus: HardwareTransportStates.none,
newNetworkAdded: '',
newCollectibleAddedMessage: '',
removeCollectibleMessage: '',
portfolioTooltipWasShownInThisSession: false,
sendInputCurrencySwitched: false,
newTokensImported: '',
newCustomNetworkAdded: {},
onboardedInThisUISession: false,
customTokenAmount: '',
scrollToBottom: true,
txId: null,
};
export default function reduceApp(
state: AppState,
action: AnyAction,
): AppState {
const appState: AppState = {
...initialState,
...state, ...state,
}; };
@ -146,7 +224,6 @@ export default function reduceApp(state = {}, action) {
privateKey: '', privateKey: '',
}, },
}; };
case actionConstants.SHOW_SEND_TOKEN_PAGE: case actionConstants.SHOW_SEND_TOKEN_PAGE:
return { return {
...appState, ...appState,
@ -160,7 +237,6 @@ export default function reduceApp(state = {}, action) {
}; };
// accounts // accounts
case actionConstants.GO_HOME: case actionConstants.GO_HOME:
return { return {
...appState, ...appState,
@ -224,7 +300,7 @@ export default function reduceApp(state = {}, action) {
case actionConstants.SET_HARDWARE_WALLET_DEFAULT_HD_PATH: { case actionConstants.SET_HARDWARE_WALLET_DEFAULT_HD_PATH: {
const { device, path } = action.value; const { device, path } = action.value;
const newDefaults = { ...appState.defaultHdPaths }; const newDefaults = { ...appState.defaultHdPaths } as any;
newDefaults[device] = path; newDefaults[device] = path;
return { return {
@ -347,19 +423,19 @@ export default function reduceApp(state = {}, action) {
case actionConstants.TOGGLE_GAS_LOADING_ANIMATION: case actionConstants.TOGGLE_GAS_LOADING_ANIMATION:
return { return {
...appState, ...appState,
gasLoadingAnimationIsShowing: action.value, gasLoadingAnimationIsShowing: action.payload,
}; };
case actionConstants.SET_WEBHID_CONNECTED_STATUS: case actionConstants.SET_WEBHID_CONNECTED_STATUS:
return { return {
...appState, ...appState,
ledgerWebHidConnectedStatus: action.value, ledgerWebHidConnectedStatus: action.payload,
}; };
case actionConstants.SET_LEDGER_TRANSPORT_STATUS: case actionConstants.SET_LEDGER_TRANSPORT_STATUS:
return { return {
...appState, ...appState,
ledgerTransportStatus: action.value, ledgerTransportStatus: action.payload,
}; };
case actionConstants.TOGGLE_CURRENCY_INPUT_SWITCH: case actionConstants.TOGGLE_CURRENCY_INPUT_SWITCH:
return { return {
@ -369,17 +445,17 @@ export default function reduceApp(state = {}, action) {
case actionConstants.SET_NEW_CUSTOM_NETWORK_ADDED: case actionConstants.SET_NEW_CUSTOM_NETWORK_ADDED:
return { return {
...appState, ...appState,
newCustomNetworkAdded: action.value, newCustomNetworkAdded: action.payload,
}; };
case actionConstants.ONBOARDED_IN_THIS_UI_SESSION: case actionConstants.ONBOARDED_IN_THIS_UI_SESSION:
return { return {
...appState, ...appState,
onboardedInThisUISession: action.value, onboardedInThisUISession: action.payload,
}; };
case actionConstants.SET_CUSTOM_TOKEN_AMOUNT: case actionConstants.SET_CUSTOM_TOKEN_AMOUNT:
return { return {
...appState, ...appState,
customTokenAmount: action.value, customTokenAmount: action.payload,
}; };
default: default:
return appState; return appState;
@ -387,63 +463,81 @@ export default function reduceApp(state = {}, action) {
} }
// Action Creators // Action Creators
export function hideWhatsNewPopup() { export function hideWhatsNewPopup(): Action {
return { return {
type: actionConstants.HIDE_WHATS_NEW_POPUP, type: actionConstants.HIDE_WHATS_NEW_POPUP,
}; };
} }
export function setPortfolioTooltipWasShownInThisSession() { export function setPortfolioTooltipWasShownInThisSession(): Action {
return { return {
type: actionConstants.PORTFOLIO_TOOLTIP_WAS_SHOWN_IN_THIS_SESSION, type: actionConstants.PORTFOLIO_TOOLTIP_WAS_SHOWN_IN_THIS_SESSION,
}; };
} }
export function toggleGasLoadingAnimation(value) { export function toggleGasLoadingAnimation(
return { type: actionConstants.TOGGLE_GAS_LOADING_ANIMATION, value }; payload: boolean,
): PayloadAction<boolean> {
return { type: actionConstants.TOGGLE_GAS_LOADING_ANIMATION, payload };
} }
export function setLedgerWebHidConnectedStatus(value) { export function setLedgerWebHidConnectedStatus(
return { type: actionConstants.SET_WEBHID_CONNECTED_STATUS, value }; payload: WebHIDConnectedStatuses,
): PayloadAction<WebHIDConnectedStatuses> {
return { type: actionConstants.SET_WEBHID_CONNECTED_STATUS, payload };
} }
export function setLedgerTransportStatus(value) { export function setLedgerTransportStatus(
return { type: actionConstants.SET_LEDGER_TRANSPORT_STATUS, value }; payload: HardwareTransportStates,
): PayloadAction<HardwareTransportStates> {
return { type: actionConstants.SET_LEDGER_TRANSPORT_STATUS, payload };
} }
// Selectors export function toggleCurrencySwitch(): Action {
export function getQrCodeData(state) {
return state.appState.qrCodeData;
}
export function getGasLoadingAnimationIsShowing(state) {
return state.appState.gasLoadingAnimationIsShowing;
}
export function getLedgerWebHidConnectedStatus(state) {
return state.appState.ledgerWebHidConnectedStatus;
}
export function getLedgerTransportStatus(state) {
return state.appState.ledgerTransportStatus;
}
export function getPortfolioTooltipWasShownInThisSession(state) {
return state.appState.portfolioTooltipWasShownInThisSession;
}
export function toggleCurrencySwitch() {
return { type: actionConstants.TOGGLE_CURRENCY_INPUT_SWITCH }; return { type: actionConstants.TOGGLE_CURRENCY_INPUT_SWITCH };
} }
export function setNewCustomNetworkAdded(value) { export function setNewCustomNetworkAdded(
return { type: actionConstants.SET_NEW_CUSTOM_NETWORK_ADDED, value }; // can pass in a valid network or empty one
payload: RPCDefinition | Record<string, never>,
): PayloadAction<RPCDefinition | Record<string, never>> {
return { type: actionConstants.SET_NEW_CUSTOM_NETWORK_ADDED, payload };
} }
export function setOnBoardedInThisUISession(value) { export function setOnBoardedInThisUISession(
return { type: actionConstants.ONBOARDED_IN_THIS_UI_SESSION, value }; payload: boolean,
): PayloadAction<boolean> {
return { type: actionConstants.ONBOARDED_IN_THIS_UI_SESSION, payload };
} }
export function setCustomTokenAmount(value) { export function setCustomTokenAmount(payload: string): PayloadAction<string> {
return { type: actionConstants.SET_CUSTOM_TOKEN_AMOUNT, value }; return { type: actionConstants.SET_CUSTOM_TOKEN_AMOUNT, payload };
}
// Selectors
export function getQrCodeData(state: AppSliceState): {
type?: string | null;
values?: { address?: string | null };
} | null {
return state.appState.qrCodeData;
}
export function getGasLoadingAnimationIsShowing(state: AppSliceState): boolean {
return state.appState.gasLoadingAnimationIsShowing;
}
export function getLedgerWebHidConnectedStatus(
state: AppSliceState,
): string | null {
return state.appState.ledgerWebHidConnectedStatus;
}
export function getLedgerTransportStatus(state: AppSliceState): string | null {
return state.appState.ledgerTransportStatus;
}
export function getPortfolioTooltipWasShownInThisSession(
state: AppSliceState,
): boolean {
return state.appState.portfolioTooltipWasShownInThisSession;
} }

3
ui/store/actions.js
View File

@ -2239,10 +2239,9 @@ export function showModal(payload) {
}; };
} }
export function hideModal(payload) { export function hideModal() {
return { return {
type: actionConstants.MODAL_CLOSE, type: actionConstants.MODAL_CLOSE,
payload,
}; };
} }