From f805f9a64d0ab2fd4ea887f1bc92c69fa6f82f1a Mon Sep 17 00:00:00 2001 From: Joonyoung Choi Date: Wed, 13 Jul 2022 12:12:47 +0900 Subject: [PATCH] Update PickerConfiguration > Needs > The picker api support 5 usable features, but the __PickerConfiguration__ just declare 2 features ( multiSelect, supportDrives ). > Description > * add the type __PickerFeatureOption__ meaning enumerated type of [features for views](https://developers.google.com/drive/picker/reference#feature). > * integrate __multiselect__, __supportDrives__ into __enabledFeatures__. --- README.md | 37 ++++++++++++++++++------------------- demo/src/App.tsx | 6 ++---- src/index.tsx | 33 +++++++++++++++++++++++++-------- src/typeDefs.ts | 24 +++++++++++++++--------- 4 files changed, 60 insertions(+), 40 deletions(-) diff --git a/README.md b/README.md index 6fdeddd..bc3eb19 100644 --- a/README.md +++ b/README.md @@ -66,25 +66,24 @@ export default App; ## Picker Props -| params | value | default value | description | -|------------------|----------|------------------|-------------------------------| -| callbackFunction |function | REQUIRED |Callback function that will be called on picker action | -| clientId | string | REQUIRED | Google client id | -| developerKey | string | REQUIRED | Google developer key | -| disableDefaultView | boolean | false | disables default view | -| viewId | string | DOCS | ViewIdOptions | -| viewMimeTypes | string | optional |Comma separated mimetypes. Use this in place of viewId if you need to filter multiple type of files. list: https://developers.google.com/drive/api/v3/mime-types.| -|setIncludeFolders| boolean | false |Show folders in the view items.| -|setSelectFolderEnabled|boolean| false |Allows the user to select a folder in Google Drive.| -| token | string | optional | access_token to skip auth part| -| multiselect | boolean | false | Enable picker multiselect | -| supportDrives | boolean | false | Support shared drives | -| showUploadView | boolean | false | Enable upload view | -| showUploadFolders| boolean | false |Enable folder selection(upload)| -| setParentFolder | string | disabled | Drive folder id to upload | -| customViews |ViewClass[]| optional | Array of custom views you want to add to the picker| -| customScopes |string[]| ['https://www.googleapis.com/auth/drive.readonly'] | Array of custom scopes you want to add to the picker| -| locale |string | en | List of supported locales https://developers.google.com/picker/docs#i18n| +| params | value | default value | description | +|------------------------|-------------|----------------------------------------------------|-------------------------------------------------------------------------------------------------------------------------------------------------------------------| +| callbackFunction | function | REQUIRED | Callback function that will be called on picker action | +| clientId | string | REQUIRED | Google client id | +| developerKey | string | REQUIRED | Google developer key | +| disableDefaultView | boolean | false | disables default view | +| viewId | string | DOCS | ViewIdOptions | +| viewMimeTypes | string | optional | Comma separated mimetypes. Use this in place of viewId if you need to filter multiple type of files. list: https://developers.google.com/drive/api/v3/mime-types. | +| setIncludeFolders | boolean | false | Show folders in the view items. | +| setSelectFolderEnabled | boolean | false | Allows the user to select a folder in Google Drive. | +| token | string | optional | access_token to skip auth part | +| enabledFeatures | string[] | optional | Enable [features](https://developers.google.com/drive/picker/reference#feature) of various views. | +| showUploadView | boolean | false | Enable upload view | +| showUploadFolders | boolean | false | Enable folder selection(upload) | +| setParentFolder | string | disabled | Drive folder id to upload | +| customViews | ViewClass[] | optional | Array of custom views you want to add to the picker | +| customScopes | string[] | ['https://www.googleapis.com/auth/drive.readonly'] | Array of custom scopes you want to add to the picker | +| locale | string | en | List of supported locales https://developers.google.com/picker/docs#i18n | ## viewId options diff --git a/demo/src/App.tsx b/demo/src/App.tsx index a9332a0..e886133 100644 --- a/demo/src/App.tsx +++ b/demo/src/App.tsx @@ -26,8 +26,7 @@ function App() { // token, showUploadView: true, showUploadFolders: true, - supportDrives: true, - multiselect: true, + enabledFeatures: ['SUPPORT_DRIVES', 'MULTISELECT'], customScopes: ['https://www.googleapis.com/auth/gmail.readonly'], callbackFunction: (data) => { if (data.action === 'cancel') { @@ -49,8 +48,7 @@ function App() { // token: token showUploadView: true, showUploadFolders: true, - supportDrives: true, - multiselect: true, + enabledFeatures: ['SIMPLE_UPLOAD', 'MINE_ONLY'], callbackFunction: (data) => { console.log(data) }, diff --git a/src/index.tsx b/src/index.tsx index a719373..1af56af 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -103,11 +103,9 @@ export default function useDrivePicker(): [ const createPicker = ({ token, appId = '', - supportDrives = false, developerKey, viewId = 'DOCS', disabled, - multiselect, showUploadView = false, showUploadFolders, setParentFolder = '', @@ -118,6 +116,7 @@ export default function useDrivePicker(): [ setSelectFolderEnabled, disableDefaultView = false, callbackFunction, + enabledFeatures, }: PickerConfiguration) => { if (disabled) return false @@ -146,14 +145,32 @@ export default function useDrivePicker(): [ customViews.map((view) => picker.addView(view)) } - if (multiselect) { - picker.enableFeature(google.picker.Feature.MULTISELECT_ENABLED) - } - if (showUploadView) picker.addView(uploadView) - if (supportDrives) { - picker.enableFeature(google.picker.Feature.SUPPORT_DRIVES) + if (enabledFeatures) { + enabledFeatures.forEach((feature) => { + let featureType + switch (feature) { + case 'MINE_ONLY': + featureType = google.picker.Feature.MINE_ONLY + break + case 'MULTISELECT': + featureType = google.picker.Feature.MULTISELECT_ENABLED + break + case 'HIDE_NAV': + featureType = google.picker.Feature.NAV_HIDDEN + break + case 'SIMPLE_UPLOAD': + featureType = google.picker.Feature.SIMPLE_UPLOAD_ENABLED + break + case 'SUPPORT_DRIVES': + featureType = google.picker.Feature.SUPPORT_DRIVES + break + default: + featureType = undefined + } + if (featureType) picker.enableFeature(featureType) + }) } picker.build().setVisible(true) diff --git a/src/typeDefs.ts b/src/typeDefs.ts index 6853499..1ff8337 100644 --- a/src/typeDefs.ts +++ b/src/typeDefs.ts @@ -23,13 +23,13 @@ export type PickerCallback = { docs: CallbackDoc[] } -export type authResult = { - access_token: string; - token_type: string; - expires_in: number; - scope: string; - authuser: string; - prompt: string; +export type authResult = { + access_token: string + token_type: string + expires_in: number + scope: string + authuser: string + prompt: string } type ViewIdOptions = @@ -45,6 +45,13 @@ type ViewIdOptions = | 'SPREADSHEETS' | 'PRESENTATIONS' +export type PickerFeatureOption = + | 'MINE_ONLY' + | 'MULTISELECT' + | 'HIDE_NAV' + | 'SIMPLE_UPLOAD' + | 'SUPPORT_DRIVES' + export type PickerConfiguration = { clientId: string developerKey: string @@ -54,10 +61,8 @@ export type PickerConfiguration = { setSelectFolderEnabled?: boolean disableDefaultView?: boolean token?: string - multiselect?: boolean disabled?: boolean appId?: string - supportDrives?: boolean showUploadView?: boolean showUploadFolders?: boolean setParentFolder?: string @@ -66,6 +71,7 @@ export type PickerConfiguration = { locale?: string customScopes?: string[] callbackFunction: (data: PickerCallback) => any + enabledFeatures?: PickerFeatureOption[] } export const defaultConfiguration: PickerConfiguration = {