Some suggestions

MetaMask · Mar 1, 2023 · bf6c55a · bf6c55a
1 parent 5059f80
commit bf6c55a
Show file tree

Hide file tree

Showing 4 changed files with 19 additions and 10 deletions.
diff --git a/ui/pages/create-account/import-account/bottom-buttons.js b/ui/pages/create-account/import-account/bottom-buttons.js
@@ -1,13 +1,13 @@
 import PropTypes from 'prop-types';
 import React from 'react';
-import { useDispatch, useSelector } from 'react-redux';
+import { useDispatch } from 'react-redux';
 import {
   BUTTON_SECONDARY_SIZES,
   ButtonPrimary,
   ButtonSecondary,
 } from '../../../components/component-library';
 import Box from '../../../components/ui/box/box';
-import { BLOCK_SIZES, DISPLAY } from '../../../helpers/constants/design-system';
+import { DISPLAY } from '../../../helpers/constants/design-system';
 import { useI18nContext } from '../../../hooks/useI18nContext';
 import * as actions from '../../../store/actions';
 

diff --git a/ui/pages/create-account/import-account/import-account.stories.js b/ui/pages/create-account/import-account/import-account.stories.js
@@ -1,5 +1,5 @@
 import React from 'react';
-import Box from '../../../components/ui/box';
+
 import NewAccountImportForm from '.';
 
 export default {

diff --git a/ui/pages/create-account/import-account/json.js b/ui/pages/create-account/import-account/json.js
@@ -14,6 +14,7 @@ import {
   Size,
   TextVariant,
   TEXT_ALIGN,
+  SEVERITIES,
 } from '../../../helpers/constants/design-system';
 import ZENDESK_URLS from '../../../helpers/constants/zendesk-url';
 import { useI18nContext } from '../../../hooks/useI18nContext';
@@ -32,6 +33,10 @@ export default function JsonImportSubview({ importAccountFunc }) {
 
   const isPrimaryDisabled = password === '' || fileContents === '';
 
+  function handleOnChange(event) {
+    setPassword(event.target.value);
+  }
+
   function handleKeyPress(event) {
     if (!isPrimaryDisabled && event.key === 'Enter') {
       event.preventDefault();
@@ -53,7 +58,7 @@ export default function JsonImportSubview({ importAccountFunc }) {
         {t('usedByClients')}
         <ButtonLink
           size={Size.inherit}
-          href={ZENDESK_URLS}
+          href={ZENDESK_URLS.IMPORTED_ACCOUNTS}
           target="_blank"
           rel="noopener noreferrer"
         >
@@ -74,16 +79,15 @@ export default function JsonImportSubview({ importAccountFunc }) {
       />
 
       <FormTextField
+        id="json-password-box"
         size={TEXT_FIELD_SIZES.LARGE}
         autoFocus
-        id="json-password-box"
         type={TEXT_FIELD_TYPES.PASSWORD}
         helpText={warning}
-        helpTextProps={{ error: true }} // TODO: change to severity={SEVERITIES.ERROR} after rebase
+        helpTextProps={{ severity: SEVERITIES.DANGER }}
         placeholder={t('enterPassword')}
-        id="json-password-box"
         value={password}
-        onChange={setPassword}
+        onChange={handleOnChange}
         inputProps={{
           onKeyPress: handleKeyPress,
         }}

diff --git a/ui/pages/create-account/import-account/private-key.js b/ui/pages/create-account/import-account/private-key.js
@@ -1,6 +1,7 @@
 import PropTypes from 'prop-types';
 import React, { useState } from 'react';
 import { useSelector } from 'react-redux';
+import { SEVERITIES } from '../../../helpers/constants/design-system';
 import {
   FormTextField,
   TEXT_FIELD_TYPES,
@@ -18,6 +19,10 @@ export default function PrivateKeyImportView({ importAccountFunc }) {
 
   const warning = useSelector((state) => state.appState.warning);
 
+  function handleOnChange(event) {
+    setPrivateKey(event.target.value);
+  }
+
   function handleKeyPress(event) {
     if (privateKey !== '' && event.key === 'Enter') {
       event.preventDefault();
@@ -36,10 +41,10 @@ export default function PrivateKeyImportView({ importAccountFunc }) {
         autoFocus
         type={TEXT_FIELD_TYPES.PASSWORD}
         helpText={warning}
-        helpTextProps={{ error: true }} // TODO: change to severity={SEVERITIES.ERROR} after rebase
+        helpTextProps={{ severity: SEVERITIES.DANGER }}
         label={t('pastePrivateKey')}
         value={privateKey}
-        onChange={setPrivateKey}
+        onChange={handleOnChange}
         inputProps={{
           onKeyPress: handleKeyPress,
         }}