@@ -30,13 +44,13 @@ function TransactionIndex ({ className, index, onNextClick, onPreviousClick, tot
{ previousClickActive && onPreviousClick(); }}
+ onClick={prevClick}
size='sm'
/>
{ nextClickActive && onNextClick(); }}
+ onClick={nextClick}
size='sm'
/>
diff --git a/packages/extension-ui/src/Popup/Welcome.tsx b/packages/extension-ui/src/Popup/Welcome.tsx
index 02888cfb..efc9aa15 100644
--- a/packages/extension-ui/src/Popup/Welcome.tsx
+++ b/packages/extension-ui/src/Popup/Welcome.tsx
@@ -3,7 +3,7 @@
import type { ThemeProps } from '../types';
-import React, { useContext } from 'react';
+import React, { useCallback, useContext } from 'react';
import styled from 'styled-components';
import { ActionContext, Box, Button, ButtonArea, List, VerticalSpace } from '../components';
@@ -18,10 +18,13 @@ const Welcome = function ({ className }: Props): React.ReactElement
{
const { t } = useTranslation();
const onAction = useContext(ActionContext);
- const _onClick = (): void => {
- window.localStorage.setItem('welcome_read', 'ok');
- onAction();
- };
+ const _onClick = useCallback(
+ (): void => {
+ window.localStorage.setItem('welcome_read', 'ok');
+ onAction();
+ },
+ [onAction]
+ );
return (
<>
diff --git a/packages/extension-ui/src/Popup/index.tsx b/packages/extension-ui/src/Popup/index.tsx
index a6946231..11e87a02 100644
--- a/packages/extension-ui/src/Popup/index.tsx
+++ b/packages/extension-ui/src/Popup/index.tsx
@@ -4,7 +4,7 @@
import type { AccountJson, AccountsContext, AuthorizeRequest, MetadataRequest, SigningRequest } from '@polkadot/extension-base/background/types';
import type { SettingsStruct } from '@polkadot/ui-settings/types';
-import React, { useEffect, useState } from 'react';
+import React, { useCallback, useEffect, useState } from 'react';
import { Route, Switch } from 'react-router';
import { PHISHING_PAGE_REDIRECT } from '@polkadot/extension-base/defaults';
@@ -74,13 +74,16 @@ export default function Popup (): React.ReactElement {
const [isWelcomeDone, setWelcomeDone] = useState(false);
const [settingsCtx, setSettingsCtx] = useState(startSettings);
- const _onAction = (to?: string): void => {
- setWelcomeDone(window.localStorage.getItem('welcome_read') === 'ok');
+ const _onAction = useCallback(
+ (to?: string): void => {
+ setWelcomeDone(window.localStorage.getItem('welcome_read') === 'ok');
- if (to) {
- window.location.hash = to;
- }
- };
+ if (to) {
+ window.location.hash = to;
+ }
+ },
+ []
+ );
useEffect((): void => {
Promise.all([
@@ -96,6 +99,7 @@ export default function Popup (): React.ReactElement {
});
_onAction();
+ // eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
useEffect((): void => {
diff --git a/packages/extension-ui/src/components/Address.test.tsx b/packages/extension-ui/src/components/Address.test.tsx
index 6c2c20a6..376d0bd8 100644
--- a/packages/extension-ui/src/components/Address.test.tsx
+++ b/packages/extension-ui/src/components/Address.test.tsx
@@ -106,10 +106,12 @@ const mountComponent = async (addressComponentProps: AddressComponentProps, cont
const { actions = actionStub } = addressComponentProps;
const wrapper = mount(
-
+
{!!accountName && (account?.isExternal || isExternal) && (
(account?.isHardware || isHardware)
- ?
- :
+ ? (
+
+ )
+ : (
+
+ )
)}
{displayName}
);
diff --git a/packages/extension-ui/src/components/Button.tsx b/packages/extension-ui/src/components/Button.tsx
index 6e8ddbb4..a3cb3cca 100644
--- a/packages/extension-ui/src/components/Button.tsx
+++ b/packages/extension-ui/src/components/Button.tsx
@@ -3,7 +3,7 @@
import type { ThemeProps } from '../types';
-import React from 'react';
+import React, { useCallback } from 'react';
import styled from 'styled-components';
import Spinner from './Spinner';
@@ -19,17 +19,20 @@ interface Props extends ThemeProps {
}
function Button ({ children, className = '', isBusy, isDisabled, onClick, to }: Props): React.ReactElement {
- const _onClick = (): void => {
- if (isBusy || isDisabled) {
- return;
- }
+ const _onClick = useCallback(
+ (): void => {
+ if (isBusy || isDisabled) {
+ return;
+ }
- onClick && onClick();
+ onClick && onClick();
- if (to) {
- window.location.hash = to;
- }
- };
+ if (to) {
+ window.location.hash = to;
+ }
+ },
+ [isBusy, isDisabled, onClick, to]
+ );
return (