I want to change the button of Uppy File input from string text to svg image, and this is my code :
import { DeleteOutlined } from '@ant-design/icons';
import Uppy from '@uppy/core';
import { FileInput } from '@uppy/react';
function MyComponent() {
const [uppy, setUppy] = useState(null);
function handleMount() {
const uppyInstance = Uppy({
autoProceed: true,
restrictions: {
maxFileSize: 1000000, // example restriction
},
});
setUppy(uppyInstance);
}
function handleUnmount() {
uppy.close(); // close the uppy instance when the component is unmounted
}
const fileInputProps = {
uppy: uppy,
target: '#file-input-container',
pretty: true,
locale: {
strings: {
chooseFiles: 'Choose files'
},
},
};
return (
<div
id="file-input-container"
onMouseEnter={handleMount}
onMouseLeave={handleUnmount}
>
<FileInput {...fileInputProps} />
</div>
);
}
in locale.strings there is string text ‘Choose files’, how to replace to be <DeleteOutlined icon ?