feat(ENG-10240): enable folder selection

README.md

@@ -58,6 +58,7 @@ const options = {
     baseUrl = 'https://app.stackone.com',
     fields = ['name', 'path', 'driveId'],
     showBranding = false,
+    folderSelectionEnabled = true,
     onFilesPicked = (files) => {
         console.log('Selected files:', files);
     },
@@ -82,6 +83,7 @@ const filePicker = new FilePicker(options);
 | **baseUrl**       | string   | No       | Which API instance should it connect to.                                                                                  |
 | **fields**        | string[] | No       | Which fields from the raw picked file will be mapped on the files picked callback.                                        |
 | **showBranding**  | boolean  | No       | Show StackOne footer on the file picker, it is defaulted to true.                                                         |
+| **folderSelectionEnabled**   | boolean  | No       | Enable the selection of folders on the unified and native pickers.                                             |
 | **onFilesPicked** | function | No       | Called when files are selected.                                                                                           |
 | **onOpen()**      | function | No       | Called when the file picker is opened.                                                                                    |
 | **onClose()**     | function | No       | Called every time the file picker is closed regardless of whether a file has been picked or not.                          |

src/filePicker.ts

@@ -11,6 +11,7 @@ export class FilePicker {
     #isListenerAttached = false;
     #showBranding = true;
     #fields?: string[];
+    #folderSelectionEnabled = false;
     #onFilesPicked: (data: File[]) => void;
     #onClose: () => void;
     #onOpen: () => void;
@@ -25,6 +26,7 @@ export class FilePicker {
             apiUrl,
             fields,
             showBranding,
+            folderSelectionEnabled,
             onFilesPicked,
             onClose,
             onOpen,
@@ -37,6 +39,7 @@ export class FilePicker {
         this.#baseUrl = baseUrl ?? 'https://app.stackone.com';
         this.#apiUrl = apiUrl ?? 'https://api.stackone.com';
         this.#showBranding = showBranding ?? true;
+        this.#folderSelectionEnabled = folderSelectionEnabled ?? false;
         this.#onFilesPicked = onFilesPicked ?? (() => {});
         this.#onClose = onClose ?? (() => {});
         this.#onOpen = onOpen ?? (() => {});
@@ -75,6 +78,7 @@ export class FilePicker {
             this.#fields,
             this.#apiUrl,
             this.#showBranding,
+            this.#folderSelectionEnabled,
         );
         this.#iframe.src = url;
     }

src/types.ts

@@ -12,6 +12,7 @@ export interface FilePickerOptions {
     apiUrl?: string;
     fields?: string[];
     showBranding?: boolean;
+    folderSelectionEnabled?: boolean;
     onFilesPicked?: (data: File[]) => void;
     onError?: (error: Error) => void;
     onClose?: () => void;

src/utils/url.ts

@@ -5,11 +5,13 @@ export const createUrl = (
     fields?: string[],
     apiUrl?: string,
     showBranding?: boolean,
+    folderSelectionEnabled?: boolean,
 ) => {
     const url = new URL(baseUrl);
     url.searchParams.set('token', sessionToken);
     url.searchParams.set('origin', btoa(origin));
     url.searchParams.set('showBranding', showBranding ? 'true' : 'false');
+    url.searchParams.set('folderSelectionEnabled', folderSelectionEnabled ? 'true' : 'false');
 
     if (fields) {
         url.searchParams.set('fields', btoa(JSON.stringify(fields)));