Thanks for sharing @CucumberJoe .
The problem with uploading images to component is also described here:
opened 10:31AM - 22 Jul 22 UTC
## Bug report
### Required System information
- Node.js version: 14.19.3
… - YARN version: 1.22.19
- Strapi version: 4.1.12
- Database: sqlite
- Operating system: Ubuntu 20.04.4 LTS
### Describe the bug
Uploading via the multiform/form-data to an Object with a file inside a Component doesn't correctly link/save the file in the Component.
Other file uploads to the root data, not in a Component, work correctly.
### Expected behavior
File should show up in the Component
### Data Model
The Collection Type
```json
{
"kind": "collectionType",
"collectionName": "recommendation_information_all",
"info": {
"singularName": "recommendation-information",
"pluralName": "recommendation-information-all",
"displayName": "Recommendation_Information",
"description": ""
},
"options": {
"draftAndPublish": true
},
"pluginOptions": {},
"attributes": {
"recommendation": {
"type": "component",
"repeatable": false,
"component": "contacts.professor"
},
"student": {
"type": "relation",
"relation": "oneToOne",
"target": "api::student.student",
"inversedBy": "recommendation_information"
}
}
}
```
The Component
```json
{
"collectionName": "components_contacts_professors",
"info": {
"displayName": "professor",
"icon": "user-graduate",
"description": ""
},
"options": {},
"attributes": {
"first_name": {
"type": "string"
},
"last_name": {
"type": "string"
},
"email": {
"type": "email"
},
"recommendation_letter": {
"type": "media",
"multiple": false,
"required": false,
"allowedTypes": [
"files"
]
},
"title": {
"type": "string"
}
}
}
```
### Code thats not working
```javascript
save(event) {
event.preventDefault()
return new Promise(async (resolve,reject) => {
let formData = new FormData()
formData.append("data",JSON.stringify({
"recommendation":{
"first_name":this.state.firstName,
"last_name":this.state.lastName,
"email":this.state.email,
"title":this.state.title
}
}))
console.log(this.state.letter)
formData.append("files.recommendation[0].recommendation_letter",this.state.letter)
let request = {
method:"POST",
body:formData
}
let result = await fetch('http://localhost:1337/api/recommendation-information-all',request)
console.log(result)
resolve(true)
})
}
```
### Additional Context
Probably an unrelated Problem/Bug adding Relations during creation also doesn't seem to work
So it seems to be a bug in v4 and I consider delaying the migration to v4 until basic functionalities work like they did in v3. (though for you this might be not an option)