I am building a react native app for iOS devices, where we use Contentful as the related Headless CMS. Within this app there is a form to upload a case study which includes an image selected from either the camera or the device gallery.
The react-native-image-crop-picker module has been added to use the camera functionality. The code for this is as follows
const fromLibrary = () => {
ImagePicker.openPicker({
width: 300,
height: 400,
includeBase64: 'true',
cropping: true,
}).then(image => {
setImage(image);
});
};
const fromCamera = () => {
ImagePicker.openCamera({
width: 300,
height: 400,
includeBase64: 'true',
cropping: true,
}).then(image => {
setImage(image);
});
};
The image object is then based to the createUpload function from the contentful-management api
const uploadAsset = image => {
client
.getSpace('xxxxxxxx')
.then(space => space.getEnvironment('xxxxx'))
.then(environment => {
console.log('uploading...');
environment.createUpload({
file: image.data,
contentType: image.mime,
fileName: image.filename,
}) .then ( upload => {
console.log(upload)
return environment.createAsset({
sys: {
contentType: {
sys: {
type: 'Link',
linkType: 'ContentType',
id: upload.sys.id,
},
},
},
fields: {
title: {
'en-US': image.filename,
},
file: {
'en-US': {
fileName: image.filename,
contentType: image.mime,
uploadFrom: {
sys: {
type: 'Link',
linkType: 'Upload',
id: upload.sys.id,
},
},
},
},
},
})
})
.then(asset => {return asset})
.then(asset => asset.processForLocale('en-US', { processingCheckWait: 2000 }))
.catch(console.error);
// .then(asset => asset.publish())
}) .catch(console.error);
};
This returns the expected response but when i look in the contentful space, there is no processed upload. see image
View of filed process in Contentful
I have been stumped by this for a few days and any advice on how to upload from camera/gallery to contentful would be greatly appreciarted.
I have follwed the details in this content community post
I have investigated further and looking at the contentful documentation it says to use the createReadStream from the fs module. Which when i try to use is undefined.