React Native support for Rails ActiveStorage
npm install react-native-activestorageUse direct upload for uploading files to Rails ActiveStorage.
Install this package and react-native-blob-util
``sh`
yarn add react-native-activestorage react-native-blob-util
`jsx
import { ActiveStorageProvider } from 'react-native-activestorage'
const App = () => (
)
`
You can provide mountPath to provider if you have different than /rails/active_storage
`jsx
import { useDirectUpload } from 'react-native-activestorage'
const Upload = () => {
const onSuccess = ({ signedIds }) => {
// Do something;
}
const { upload, uploading, uploads } = useDirectUpload({ onSuccess });
const onUploadButtonClick = async () => {
const files = await showPicker();
const { signedIds } = await upload(files);
// Assign signed IDs
}
return (
{uploads.map(upload => (
))}
)
}
`
`jsx
import { DirectUpload } from 'react-native-activestorage'
const Upload = () => (
{({ upload, uploading, uploads }) => (
{uploads.map(upload =>
)}
)
`
`js
import { directUpload } from 'react-native-activestorage'
const file = {
name: 'image.jpg',
size: 123456,
type: 'image/jpeg',
path: '/var/lib/...'
}
const directUploadsUrl = 'https://localhost:3000/rails/active_storage/direct_uploads';
const onStatusChange = ({ status, progress, cancel }) => {
// status - waiting/uploading/success/error/canceled
// progress - 0-100% (for uploading status)
// cancel - function to stop uploading a file
}
directUpload({ file, directUploadsUrl, onStatusChange });
``
The package is available as open source under the terms of the [MIT License][license].
[license]: https://raw.githubusercontent.com/jpalumickas/react-native-activestorage/master/LICENSE
[react-native-blob-util]: https://www.npmjs.com/package/react-native-blob-util