autocomple small fix

src/Components/Password/Steps/tree.js

@@ -17,7 +17,6 @@ const delete_icon = <CheckBoxOutlineBlankIcon fontSize="small" />;
 const checkedIcon = <CheckBoxIcon fontSize="small" />;
 
 
-
 export function StepTree(props) {
 
     const PlazaScheme = Yup.object().shape({
@@ -31,10 +30,11 @@ export function StepTree(props) {
 
     const formik = useFormik({
         initialValues: {
-            puesto: password.index_pruebas
+            puesto: 
+            password.index_pruebas
         },
         onSubmit: (fields) => {
-            console.log('PRUEBAS ::',fields)
+            console.log('PRUEBAS :: -> ',fields)
             setPassword({
                 ...password,
                 index_pruebas : fields.puesto
@@ -44,13 +44,20 @@ export function StepTree(props) {
         validationSchema: PlazaScheme,
     });
 
-    const {errors, touched, handleSubmit, getFieldProps, setValues} = formik;
+    const { errors, touched,handleSubmit, getFieldProps,setValues } = formik;
+
     return (
         <FormikProvider style={{ padding : 25 }} value={formik}>
             <Form autoComplete="off" noValidate onSubmit={handleSubmit}>
                 <Stack spacing={2}>
                     <Autocomplete
                         {...getFieldProps('puesto')}
+                        onChange={(_a,current_list,_c,_individual,_f) => {
+                            setValues({
+                                puesto:current_list
+                            })
+                        }}
+                        isOptionEqualToValue={(option, value) => option.label === value.label}
                         multiple
                         id="checkboxes-tags-demo"
                         options={top100Films}
@@ -58,17 +65,12 @@ export function StepTree(props) {
                         getOptionLabel={(option) => { 
                             return option.label 
                         }}
-                        onChange={(_a,current_list,_c,_individual,_f) => {
-                            setValues({
-                                puesto:current_list
-                            })
-                        }}
                         renderOption={(props, option, { selected }) => (
                             <li {...props}>
                                 <Checkbox
                                     icon={delete_icon}
                                     checkedIcon={checkedIcon}
-                                    // style={{ marginRight: 8 }}
+                                    style={{ marginRight: 8 }}
                                     checked={selected}
                                     />
                                 {option.label}
@@ -76,7 +78,7 @@ export function StepTree(props) {
                         )}
                         renderInput={(params) => (
                             <TextField 
-                                {...getFieldProps('puesto')}
+                                // {...getFieldProps('puesto')}
                                 error={Boolean(touched.puesto && errors.puesto)}
                                 helperText={touched.puesto && errors.puesto}
                                 {...params}