Adapt the regex for the url for the handler with path to manage to get the content of a drive.

Update index.ts.
Update the get method of the Drive class in contents.ts to populate the drive filebrowser with the contents from the respective s3 bucket.
Change the icon for the drive filebrowser.

Author: HaudinFlorence

jupyter_drives/handlers.py

@@ -54,6 +54,7 @@ def initialize(self, logger: logging.Logger, manager: JupyterDrivesManager):
     async def get(self):
         result = await self._manager.list_drives()
         self.finish(json.dumps(result))
+       
 
     @tornado.web.authenticated
     async def post(self):
@@ -65,10 +66,15 @@ class ContentsJupyterDrivesHandler(JupyterDrivesAPIHandler):
     """
     Deals with contents of a drive.
     """
+    def initialize(self, logger: logging.Logger, manager: JupyterDrivesManager):
+        return super().initialize(logger, manager)
+    
     @tornado.web.authenticated
     async def get(self, path: str = "", drive: str = ""):
         result = await self._manager.get_contents(drive, path)
-        self.finish(json.dump(result))
+        print("result:", result)
+        self.finish(result)
+      
 
     @tornado.web.authenticated
     async def post(self, path: str = "", drive: str = ""):
@@ -92,7 +98,7 @@ async def patch(self, path: str = "", drive: str = ""):
 def setup_handlers(web_app: tornado.web.Application, config: traitlets.config.Config, log: Optional[logging.Logger] = None):
     host_pattern = ".*$"
     base_url = web_app.settings["base_url"]
-
+    print('base_url:', base_url)
     log = log or logging.getLogger(__name__)
 
     provider = DrivesConfig(config=config).provider
@@ -122,15 +128,18 @@ def setup_handlers(web_app: tornado.web.Application, config: traitlets.config.Co
         + [
             (
                 url_path_join(
-                    base_url, NAMESPACE, pattern, r"(?P<drive>\w+)", path_regex 
+                    base_url, NAMESPACE, pattern, r"(?P<drive>(?:[^/]+))"+ path_regex
                 ),
                 handler,
+                 {"logger": log, "manager": manager}
             )
             for pattern, handler in handlers_with_path
         ]
     )
 
-   
-    log.debug(f"Jupyter-Drives Handlers: {drives_handlers}")
+    print('**************************************')
+    log.warn(f"Jupyter-Drives Handlers: {drives_handlers}")
+    print('**************************************')
 
     web_app.add_handlers(host_pattern, drives_handlers)
+

jupyter_drives/managers/s3.py

@@ -47,11 +47,11 @@ async def list_drives(self):
         if (self._config.access_key_id and self._config.secret_access_key):
             S3Drive = get_driver(Provider.S3)
             drives = [S3Drive(self._config.access_key_id, self._config.secret_access_key)]
-
             results = []
+            
             for drive in drives:
                 results += drive.list_containers()
-        
+                
             for result in results:
                 data.append(
                     {
@@ -91,7 +91,6 @@ async def mount_drive(self, drive_name):
                 endpoint_url = self._config.api_base_url,
                 bucket = drive_name
             )
-
             # checking if the drive wasn't mounted already
             if drive_name not in self.s3_content_managers or self.s3_content_managers[drive_name] is None:
                 self.s3_content_managers[drive_name] = s3_contents_manager
@@ -106,7 +105,6 @@ async def mount_drive(self, drive_name):
 
         except Exception as e:
             response = {"code": 400, "message": e}
-
         return response
 
     async def unmount_drive(self, drive_name):
@@ -140,6 +138,7 @@ async def get_contents(self, drive_name, path = ""):
         try:
             if drive_name in self.s3_content_managers:
                 contents = self.s3_content_managers[drive_name].fs.ls(path)
+                print('contents:', contents)
                 code = 200
                 response["contents"] = contents
             else:
@@ -152,6 +151,7 @@ async def get_contents(self, drive_name, path = ""):
         response["code"] = code
         return response
 
+    
     async def new_file(self, drive_name, type = "notebook", path = ""):
         '''Create a new file or directory from an S3 drive.
 

src/contents.ts

@@ -4,6 +4,7 @@
 import { Signal, ISignal } from '@lumino/signaling';
 import { Contents, ServerConnection } from '@jupyterlab/services';
 //import { URLExt } from '@jupyterlab/coreutils';
+import { postDriveMounted, getDriveContents } from './s3requests';
 
 /*
  * The url for the default drive service.
@@ -32,12 +33,12 @@ const drive1Contents: Contents.IModel = {
     {
       name: 'voila2.ipynb',
       path: 'Drive1/voila2.ipynb',
-      last_modified: '2022-10-12T21:33:04.798185Z',
-      created: '2022-11-09T12:37:21.020396Z',
+      last_modified: '',
+      created: '',
       content: null,
       format: null,
       mimetype: null,
-      size: 5377,
+      size: null,
       writable: true,
       type: 'notebook'
     },
@@ -313,32 +314,49 @@ export class Drive implements Contents.IDrive {
    * Uses the [Jupyter Notebook API](https://petstore.swagger.io/?url=https://raw.githubusercontent.com/jupyter-server/jupyter_server/main/jupyter_server/services/api/api.yaml#!/contents) and validates the response model.
    */
   async get(
-    path: string,
+    localPath: string,
     options?: Contents.IFetchOptions
   ): Promise<Contents.IModel> {
-    /*
-    let url = this._getUrl(localPath);
-    if (options) {
-      // The notebook type cannot take an format option.
-      if (options.type === 'notebook') {
-        delete options['format'];
-      }
-      const content = options.content ? '1' : '0';
-      const params: PartialJSONObject = { ...options, content };
-      url += URLExt.objectToQueryString(params);
-    }
-
-    const settings = this.serverSettings;
-    const response = await ServerConnection.makeRequest(url, {}, settings);
-    if (response.status !== 200) {
-      const err = await ServerConnection.ResponseError.create(response);
-      throw err;
-    }
-    const data = await response.json();*/
+    postDriveMounted(this.name);
+    const response = await getDriveContents(this.name, localPath);
+    let fileExtension: string = '';
+    const driveBrowserContents: Array<object> = [];
+    const driveContents: Array<string> = response['contents'];
+    driveContents.forEach(content => {
+      fileExtension = content.split('.')[1];
+      driveBrowserContents.push({
+        name: content,
+        path: this.name + '/' + content,
+        last_modified: '',
+        created: '',
+        content: null,
+        format: null,
+        mimetype: fileExtension === 'txt' ? 'text/plain' : '',
+        size: undefined,
+        writable: true,
+        type:
+          fileExtension === 'txt'
+            ? 'txt'
+            : fileExtension === 'ipynb'
+              ? 'notebook'
+              : 'directory'
+      });
+    });
+    const drivePath: Contents.IModel = {
+      name: this.name,
+      path: this.name,
+      last_modified: '',
+      created: '',
+      content: driveBrowserContents,
+      format: 'json',
+      mimetype: '',
+      size: undefined,
+      writable: true,
+      type: 'directory'
+    };
 
-    const data = drive1Contents;
-    //Contents.validateContentsModel(data);
-    return data;
+    Contents.validateContentsModel(drivePath);
+    return drivePath;
   }
 
   /**

src/icons.ts

@@ -1,5 +1,5 @@
 import { LabIcon } from '@jupyterlab/ui-components';
-import driveSvgstr from '../style/drive.svg';
+import driveSvgstr from '../style/driveIconFileBrowser.svg';
 export const DriveIcon = new LabIcon({
   name: '@jupyter/drives:drive',
   svgstr: driveSvgstr

src/index.ts

@@ -17,97 +17,44 @@ import {
 } from '@jupyterlab/apputils';
 
 import { SidePanel } from '@jupyterlab/ui-components';
-import { IBucket } from './s3requests';
 import { Dialog, ICommandPalette, showDialog } from '@jupyterlab/apputils';
 import { DriveListModel, DriveListView } from './drivelistmanager';
 import { addJupyterLabThemeChangeListener } from '@jupyter/web-components';
-import {
-  getDriveContents,
-  getDrivesList,
-  postDriveMounted
-} from './s3requests';
-
-/**
- * The class name added to the filebrowser filterbox node.
- */
-//const FILTERBOX_CLASS = 'jp-FileBrowser-filterBox';
+import { getDrivesList, IBucket } from './s3requests';
 
 const FILE_BROWSER_FACTORY = 'DrivePanel';
 const FILE_BROWSER_PLUGIN_ID = '@jupyter/drives:widget';
 
-function buildMountedDriveNameList(driveList: Drive[]): string[] {
+function buildAddedDriveNameList(driveList: Drive[]): string[] {
   const driveNameList: string[] = [];
   driveList.forEach(drive => {
     driveNameList.push(drive.name);
   });
   return driveNameList;
 }
 
-const s3AvailableBuckets = await getDrivesList();
-console.log('List of buckets is:', s3AvailableBuckets);
-const driveName = 'jupyter-drive-bucket1';
-const path = 'examples';
-await postDriveMounted(driveName);
-const driveContent = await getDriveContents(driveName, path);
-console.log('driveContent:', driveContent);
-/*const s3AvailableBuckets1: IBucket[] = [
-  {
-    creation_date: '2023-12-15T13:27:57.000Z',
-    name: 'jupyterDriveBucket1',
-    provider: 'S3',
-    region: 'us-east-1',
-    status: 'active'
-  },
-  {
-    creation_date: '2023-12-19T08:57:29.000Z',
-    name: 'jupyterDriveBucket2',
-    provider: 'S3',
-    region: 'us-east-1',
-    status: 'inactive'
-  },
-  {
-    creation_date: '2023-12-19T09:07:29.000Z',
-    name: 'jupyterDriveBucket3',
-    provider: 'S3',
-    region: 'us-east-1',
-    status: 'inactive'
-  },
-  {
-    creation_date: '2023-12-19T09:07:29.000Z',
-    name: 'jupyterDriveBucket4',
-    provider: 'S3',
-    region: 'us-east-1',
-    status: 'active'
-  },
-  {
-    creation_date: '2024-01-12T09:07:29.000Z',
-    name: 'jupyterDriveBucket5',
-    provider: 'S3',
-    region: 'us-east-1',
-    status: 'active'
-  }
-];*/
-
 namespace CommandIDs {
   export const openDrivesDialog = 'drives:open-drives-dialog';
   export const removeDriveBrowser = 'drives:remove-drive-browser';
 }
 
-/*async*/ function createDrivesList(bucketList: IBucket[]) {
+async function createDrivesList() {
+  const response = await getDrivesList();
+  const bucketList: Array<IBucket> = response['data'];
   const S3Drives: Drive[] = [];
   bucketList.forEach(item => {
     const drive = new Drive();
     drive.name = item.name;
     drive.baseUrl = '';
     drive.region = item.region;
-    drive.status = item.status;
+    drive.status = 'active';
     drive.provider = item.provider;
     S3Drives.push(drive);
   });
   return S3Drives;
 }
 
-function camelCaseToDashedCase(name: string) {
+export function camelCaseToDashedCase(name: string) {
   if (name !== name.toLowerCase()) {
     name = name.replace(/[A-Z]/g, m => '-' + m.toLowerCase());
   }
@@ -117,14 +64,6 @@ function camelCaseToDashedCase(name: string) {
 function restoreDriveName(id: string) {
   const list1 = id.split('-file-');
   let driveName = list1[0];
-  for (let i = 0; i < driveName.length; i++) {
-    if (driveName[i] === '-') {
-      const index = i;
-      const char = driveName.charAt(index + 1).toUpperCase();
-      driveName = driveName.replace(driveName.charAt(index + 1), char);
-      driveName = driveName.replace(driveName.charAt(index), '');
-    }
-  }
   return driveName;
 }
 
@@ -161,7 +100,7 @@ const AddDrivesPlugin: JupyterFrontEndPlugin<void> = {
   activate: activateAddDrivesPlugin
 };
 
-export /*async */ function activateAddDrivesPlugin(
+export async function activateAddDrivesPlugin(
   app: JupyterFrontEnd,
   palette: ICommandPalette,
   manager: IDocumentManager,
@@ -174,10 +113,9 @@ export /*async */ function activateAddDrivesPlugin(
   addJupyterLabThemeChangeListener();
   const selectedDrivesModelMap = new Map<Drive[], DriveListModel>();
   let selectedDrives: Drive[] = [];
-  const availableDrives = createDrivesList(s3AvailableBuckets);
+  const availableDrives = await createDrivesList();
   let driveListModel = selectedDrivesModelMap.get(selectedDrives);
-  const mountedDriveNameList: string[] =
-    buildMountedDriveNameList(selectedDrives);
+  const addedDriveNameList: string[] = buildAddedDriveNameList(selectedDrives);
   console.log('AddDrives plugin is activated!');
   const trans = translator.load('jupyter-drives');
 
@@ -211,12 +149,9 @@ export /*async */ function activateAddDrivesPlugin(
   }
 
   app.commands.addCommand(CommandIDs.openDrivesDialog, {
-    execute: /*async*/ () => {
+    execute: async () => {
       if (!driveListModel) {
-        driveListModel = new DriveListModel(
-          /*await*/ availableDrives,
-          selectedDrives
-        );
+        driveListModel = new DriveListModel(availableDrives, selectedDrives);
         selectedDrivesModelMap.set(selectedDrives, driveListModel);
       } else {
         selectedDrives = driveListModel.selectedDrives;
@@ -226,9 +161,13 @@ export /*async */ function activateAddDrivesPlugin(
       function onDriveAdded(driveList: Drive[]) {
         const drive: Drive = driveList[driveList.length - 1];
         if (driveListModel) {
-          if (!mountedDriveNameList.includes(drive.name)) {
+          if (!addedDriveNameList.includes(drive.name)) {
             createDriveFileBrowser(drive);
-            mountedDriveNameList.push(drive.name);
+            addedDriveNameList.push(drive.name);
+          } else {
+            console.warn(
+              'The selected drive is already in the list of added drives'
+            );
           }
         }
       }
@@ -285,5 +224,5 @@ export /*async */ function activateAddDrivesPlugin(
   });
 }
 
-const plugins: JupyterFrontEndPlugin<any>[] = [plugin, AddDrivesPlugin];
+const plugins: JupyterFrontEndPlugin<any>[] = [AddDrivesPlugin];
 export default plugins;

src/s3requests.ts

@@ -23,7 +23,7 @@ export async function postDriveMounted(driveName: string) {
 }
 
 export async function getDriveContents(driveName: string, path: string) {
-  return await requestAPI<Contents.IModel>(
+  return await requestAPI<any>(
     'drives' + '/' + driveName + '/' + path,
     {
       method: 'GET'