Merge pull request #866 from Keith-CY/enable-importing-keystore

refactor(neuron-ui): disable submit button when the wallet name is used
nervosnetwork · Aug 14, 2019 · 7d2b5b8 · 7d2b5b8
2 parents c520dc7 + 0529ff8
commit 7d2b5b8
Showing 1 changed file with 6 additions and 2 deletions.
diff --git a/packages/neuron-ui/src/components/ImportKeystore/index.tsx b/packages/neuron-ui/src/components/ImportKeystore/index.tsx
@@ -27,6 +27,10 @@ const ImportKeystore = (props: React.PropsWithoutRef<StateWithDispatch & RouteCo
     return wallets.map(w => w.name)
   }, [wallets])
 
+  const isNameUsed = useMemo(() => {
+    return exsitingNames.includes(fields.name || '')
+  }, [exsitingNames, fields.name])
+
   const onFileClick = useCallback(() => {
     showOpenDialog({
       title: 'import keystore',
@@ -71,7 +75,7 @@ const ImportKeystore = (props: React.PropsWithoutRef<StateWithDispatch & RouteCo
                 if (text === '') {
                   return t('messages.is-required', { field: t(`import-keystore.label.${key}`) })
                 }
-                if (key === 'name' && exsitingNames.includes(text || '')) {
+                if (key === 'name' && isNameUsed) {
                   return t('messages.is-used', { field: t(`import-keystore.label.${key}`) })
                 }
                 return ''
@@ -90,7 +94,7 @@ const ImportKeystore = (props: React.PropsWithoutRef<StateWithDispatch & RouteCo
       </Stack>
       <Stack horizontal horizontalAlign="end" tokens={{ childrenGap: 15 }}>
         <DefaultButton onClick={goBack}>{t('import-keystore.button.back')}</DefaultButton>
-        <PrimaryButton disabled={!(fields.name && fields.path && fields.password)} onClick={onSubmit}>
+        <PrimaryButton disabled={!(fields.name && fields.path && fields.password && !isNameUsed)} onClick={onSubmit}>
           {t('import-keystore.button.submit')}
         </PrimaryButton>
       </Stack>