I am using the mui-tiptap module in React 18 with Vite, specifically I am trying to upload a local image to my backend, although the problem is only in my frontend where I receive a typescript error that does not let me move forward. The error is with the MenuButtonImageUpload component and with the onUploadFiles function.

The error I get would be this

Type (files: File[]) => Promise<{ src: any; alt: string; title: string; }>[] is not assignable to type '(files: File[]) => ImageNodeAttributes[] | Promise<ImageNodeAttributes[]>

Type 'Promise<{ src: any; alt: string; title: string; }>[] is not assignable to type ImageNodeAttributes[] | Promise<ImageNodeAttributes[]>.

Type 'Promise<{ src: any; alt: string; title: string; }>[] is not assignable to type 'ImageNodeAttributes[].

Property src is missing in type Promise<{ src: any; alt: string; title: string; }> but required in type ImageNodeAttributes.ts(2322)

images.d.ts(4, 5): src is declared here.

MenuButtonImageUpload.d.ts(13, 5): The expected type comes from property onUploadFiles which is declared here on type IntrinsicAttributes & MenuButtonImageUploadProps

(alias) type ImageNodeAttributes = {
    src: string;
    alt?: string;
    title?: string;
}

import ImageNodeAttributes

My code is the following:

<MenuButtonImageUpload
  onUploadFiles={(files) => {

    let results = files.map(async function(file) {

      let formData = new FormData();
      formData.set('file', file);
      let { data } = await axios.post('/api/art', formData, {
        headers: {
         'content-type': 'multipart/form-data'
      }})

      return {
        src: data.data.url,
        alt: "test",
        title: "test"
      } 
    });

    return results

    }
  }
/>

I tried several things until I reached the code I published but the error persists, how could I solve this error?