嗯，我做了一个自动完成使用下面的代码，并试图显示其图标后，选择每个项目，但它没有工作！

import { useState } from 'react'
import { TextField,InputAdornment ,Autocomplete,Box} from '@mui/material';
import v1 from './v1.svg';
import  v3 from './v2.svg';
import  v4 from './v3.svg';
import  v4 from './v4.svg';
function App() {
   const [useicon ,setUseicon]=useState(v1);
   const options=[
      {'label':"تتر","icon":v1},
      {'label':"بایننس",'icon':v2},
      {'label':"بی اس دی",'icon':v3},
      {'label':"دای",'icon':v4},
   ]
  return (
   <div>
   
       <Autocomplete
        options={options}
        getOptionLabel={(option) => option.label}
        onChange={(e,value)=>{setUseicon(value['icon'])}}
        sx={{width:"300px"}}
        renderOption={(props, option) => (
          <Box component="li" {...props}>
            <img src={option.icon} style={{width:"50px",height:"50px"}} alt={option.label} />
            {option.label}
          </Box>
        )}
        renderInput={(params) => (
          <TextField
            {...params}
            inputProps={{
              ...params.inputProps,
              startAdornment: <InputAdornment position='end'>
                    <img src={useicon} />
              </InputAdornment>  ,
            }}
          />
        )}
       />
   </div>
 )
}
 export default App;

一些注意事项：
1-所有的导入都是正确的，没有问题
2-以同样的方式，图标显示在TextField组件中。
3-如果有一个错字，知道它是在这个职位，而不是在程序本身
请帮助我，因为这对我很重要。