I have a drag and drop input field for an image. When the image is dropped, it calls the handleIconDrop function. Here I’m calling my dispatch to post to our BE. My problem is I’m getting this error when doing so.

Here is the input:

<ReactField
  adminStyle={true}
  component="bs-input"
  name="icon80x80FileName"
  label={`${client.name} Icon`}
  placeholder="Drag & Drop Image Here"
  value="Drag & Drop Image Here"
  onDrop={(e) => { handleIconDrop(e, manifestType); }}
/>

Here is the handleIconDrop function:

const handleIconDrop = async ( event: React.DragEvent<HTMLInputElement>, manifestType: string) => {
    event.preventDefault();
    console.log('debug event.dataTransfer.files: ', event.dataTransfer.files);
    const file = event.dataTransfer.files[0];
    try {
        await saveManifestIcon({
          headers: { clientId: client.id, 'Content-Type': 'multipart/form-data' },
          manifestType: manifestType,
          form: file,
        });
    } catch (e) {
      console.error(msg.load.error, e);
      if (e.response?.status === 406 || e.response?.status === 404) {
        setInfo(msg.load.notFound);
      }
      else {
        setInfo(msg.load.error);
      }
    }
  };

Here is the dispatch:

const mapDispatchToProps = (dispatch) => ({
  actions: bindActionCreators(
    {
      getManifestByType: assetAdminApiActions.getAdminOfficeManifestsByManifestType,
      saveManifestIcon: assetAdminApiActions.createAdminOfficeManifestsByManifestTypeIcons,
      saveManifestByType: assetAdminApiActions.createAdminOfficeManifestsByManifestType,
      updateManifestByType: assetAdminApiActions.patchAdminOfficeManifestsByManifestType,
    },
    dispatch
  )
});

interface StateProps {
  client: ClientModel;
}
interface DispatchProps {
  actions: {
    getManifestByType: typeof assetAdminApiActions.getAdminOfficeManifestsByManifestType,
    saveManifestIcon: typeof assetAdminApiActions.createAdminOfficeManifestsByManifestTypeIcons,
    saveManifestByType: typeof assetAdminApiActions.createAdminOfficeManifestsByManifestType,
    updateManifestByType: typeof assetAdminApiActions.patchAdminOfficeManifestsByManifestType,
  }
}

Here is the dist build of the API call itself:

createAdminOfficeManifestsByManifestTypeIcons: ({ manifestType, form, data, }: {
  manifestType: string;
  form: object;
  data?: any;
}, options?: object) => Promise<any>;

Can someone please tell me if I’m missing an initialization or something? I’ve been stuck on this for WAY too long.

Many thanks in advance!

I’ve tried to initialize “form” and tried putting in place an if(form) conditional but nothing seems to work 🙁