React Google Picker
A React wrapper component for the Google Picker API that lets the user authenitcate and choose a file from Google Drive .
Installation
Install the module
npm install rc-g-picker --saveUsage
import RCGPicker from "rc-g-picker";
<RCGPicker {...props} />;Props
| Prop | Type | Default | Description |
|---|---|---|---|
| clientId | string | null | The client ID of the application. |
| developerKey | string | null | The developer key of the application. |
| scope | string | null | The scope of the application. |
| onChange | function | null | The callback function that is called when the user selects a file. |
| onAuthFailed | function | null | The callback function that is called when the user fails to authenticate. |
| onAuthFailed | function | null | The callback function that is called when the authentication fails |
| offline | boolean | false | If enabled, the onAuthenticate response will include a code and an access token |
| multiselect | boolean | false | If enabled, the user can select multiple files. |
| viewId | string | null | The view ID of the picker. |
| mimeTypes | string[] | null | The mimetypes of the files to be choosen |
| origin | string | null | The origin of the picker. |
| children | node | null | The children of the component. |
| buttonTitle | string | null | The title of the button in case no children provided. |
| query | string | null | The query to be used in the picker. |
Note
Please note that the Google Picker API is not available in all countries. For more information, please refer to the Google Picker API documentation.
Please do not forget to add the gapi init code in your app, Example Below:
import { gapi } from "gapi-script";
gapi.load("client:auth2", () => {
gapi.client.init({
clientId:
"YOUR_CLIENT_ID",
});
});
This package is influenced by react-google-picker but extended to support more features and allow code generation.