added autocomplete for mnemonics with fast search

electron-react/src/components/wallet/WalletImport.tsx

@@ -7,30 +7,48 @@ import {
   Button,
   Grid,
 } from '@material-ui/core';
+import { Autocomplete } from '@material-ui/lab';
 import { ArrowBackIos as ArrowBackIosIcon } from '@material-ui/icons';
 import { useSelector, useDispatch } from 'react-redux';
 import { useHistory } from 'react-router';
 import { Flex, Logo } from '@chia/core';
+import { matchSorter } from 'match-sorter';
 import LayoutHero from '../layout/LayoutHero';
 import { mnemonic_word_added, resetMnemonic } from '../../modules/mnemonic';
 import { unselectFingerprint } from '../../modules/message';
 import type { RootState } from '../../modules/rootReducer';
+import english from '../../util/english';
+
+const options = english.map((item) => item.word);
+
+const filterOptions = (options, { inputValue }) =>
+  matchSorter(options, inputValue, {
+    threshold: matchSorter.rankings.STARTS_WITH,
+  });
 
 function MnemonicField(props: any) {
   return (
     <Grid item xs={2}>
-      <TextField
-        autoComplete="off"
-        variant="outlined"
-        margin="normal"
-        fullWidth
-        color="primary"
+      <Autocomplete
         id={props.id}
-        label={props.index}
-        error={props.error}
-        autoFocus={props.autofocus}
-        defaultValue={props.value}
-        onChange={props.onChange}
+        options={options}
+        filterOptions={filterOptions}
+        renderInput={(params) => (
+          <TextField
+            autoComplete="off"
+            variant="outlined"
+            margin="normal"
+            color="primary"
+            label={props.index}
+            error={props.error}
+            autoFocus={props.autofocus}
+            defaultValue={props.value}
+            onChange={props.onChange}
+            {...params}
+          />
+        )}
+        freeSolo
+        fullWidth
       />
     </Grid>
   );