# React Native file upload - Mon 7th Dec, 2020

I had to make C+ handle file uploads. There's a decent library called [react-native-document-picker](https://github.com/rnmods/react-native-document-picker) to help with this. I then use a normal GraphQL mutation to send the file to my backend:

<Button
    variant="secondary"
    title="Attach file"
    icon="attach"
    disabled={Boolean(file)}
    onPress={() => {
        // Pick a single file

        DocumentPicker.pick({
            type: [DocumentPicker.types.images, DocumentPicker.types.doc, DocumentPicker.types.pdf],
        })
            .then((res) => {
                fetch(res.uri)
                    .then((res) => res.blob())
                    .then((blob) => {
                        uploadFileMutation({
                            variables: {
                                input: {
                                    file: 'blah',
                                },
                            },
                            update: () => {
                                setFile(res)
                            },
                        })
                    })
            })
            .catch((error) => {
                if (DocumentPicker.isCancel(error)) {
                    setFile(null)
                    // User cancelled the picker, exit any dialogs or menus and move on
                } else {
                    console.warn('error :', error)
                }
            })
    }}
/>

###### tags: `programmingjournal` `2020` `C+` `nominations` `fileupload` `blob`