Package Graph

jupyter_conda/envmanager.py

@@ -524,6 +524,29 @@ async def env_packages(self, env: str) -> Dict[str, List[str]]:
 
         return {"packages": [normalize_pkg_info(package) for package in data]}
 
+    async def pkg_depends(self, pkg: str) -> Dict[str, List[str]]:
+        """List environment packages dependencies.
+
+        Args:
+            pkg (str): Package name
+
+        Returns:
+            {"package": List[dependencies]}
+        """
+        resp = {}
+        ans = await self._execute(self.manager, "repoquery", "depends", "--json", pkg)
+        _, output = ans
+        query = self._clean_conda_json(output)
+
+        if "error" not in query:
+            for dep in query['result']['pkgs'] :
+                if type(dep) is dict :
+                    deps = dep.get('depends', None)
+                    if deps :
+                        resp[dep['name']] = deps
+
+        return resp
+
     async def list_available(self) -> Dict[str, List[Dict[str, str]]]:
         """List all available packages
 

jupyter_conda/handlers.py

@@ -349,12 +349,17 @@ async def get(self):
         """`GET /packages` Search for packages.
 
         Query arguments:
+            package (str): optional package name to seach dependencies
             query (str): optional string query
         """
+        pkg = self.get_query_argument("package", "")
         query = self.get_query_argument("query", "")
-
+        
         idx = None
-        if query:  # Specific search
+        if pkg :
+            idx = self._stack.put(self.env_manager.pkg_depends, pkg)
+
+        elif query:  # Specific search
             idx = self._stack.put(self.env_manager.package_search, query)
 
         else:  # List all available

jupyter_conda/rest_api.yml

@@ -201,6 +201,11 @@ paths:
       produces:
         - "application/json"
       parameters:
+        - name: "package"
+          in: "query"
+          description: "Package name to search for dependencies"
+          type: "string"
+          default: ""
         - name: "query"
           in: "query"
           description: "Query string to pass to conda search"

packages/common/package.json

@@ -50,7 +50,11 @@
     "@lumino/coreutils": "^1.3.0",
     "@lumino/signaling": "^1.2.0",
     "@lumino/widgets": "^1.6.0",
+    "@types/react-d3-graph": "^2.3.4",
+    "d3": "^5.5.0",
     "jupyterlab_toastify": "^4.1.2",
+    "react": "^16.4.1",
+    "react-d3-graph": "^2.5.0",
     "react-virtualized": "^9.21.1",
     "semver": "^6.0.0||^7.0.0",
     "typestyle": "^2.0.0"

packages/common/src/components/CondaPkgList.tsx

@@ -38,6 +38,10 @@ export interface IPkgListProps {
    * Package item version selection handler
    */
   onPkgChange: (pkg: Conda.IPackage, version: string) => void;
+  /**
+   * Package item graph dependencies handler
+   */
+  onPkgGraph: (pkg: Conda.IPackage) => void;
 }
 
 /**
@@ -143,6 +147,23 @@ export class CondaPkgList extends React.Component<IPkgListProps> {
       return <span>{rowData.name}</span>;
     };
 
+    const versionRender = ({ rowData }: ICellRender): JSX.Element => (
+      <a
+        className={
+          rowData.updatable
+            ? classes(Style.Updatable, Style.Link)
+            : Style.Link
+        }
+        href="#"
+        onClick={(evt): void => {
+          this.props.onPkgGraph(rowData);
+        }}
+        rel="noopener noreferrer"
+      >
+        {rowData.version_installed}
+      </a>
+    );
+
     const changeRender = ({ rowData }: ICellRender): JSX.Element => (
       <div className={'lm-Widget'}>
         <HTMLSelect
@@ -235,17 +256,7 @@ export class CondaPkgList extends React.Component<IPkgListProps> {
                 />
               )}
               <Column
-                cellRenderer={({ rowData }: ICellRender): JSX.Element => (
-                  <span
-                    className={
-                      rowData.updatable
-                        ? classes(Style.Updatable, Style.Cell)
-                        : Style.Cell
-                    }
-                  >
-                    {rowData.version_installed}
-                  </span>
-                )}
+                cellRenderer={versionRender}
                 dataKey="version_installed"
                 disableSort
                 label="Version"

packages/common/src/components/CondaPkgPanel.tsx

@@ -1,4 +1,4 @@
-import { showDialog } from '@jupyterlab/apputils';
+import { showDialog, Dialog } from '@jupyterlab/apputils';
 import { INotification } from 'jupyterlab_toastify';
 import * as React from 'react';
 import semver from 'semver';
@@ -10,6 +10,7 @@ import {
   PACKAGE_TOOLBAR_HEIGHT,
   PkgFilters
 } from './CondaPkgToolBar';
+import { PkgGraph } from './PkgGraph';
 
 // Minimal panel width to show package description
 const PANEL_SMALL_WIDTH = 500;
@@ -239,6 +240,14 @@ export class CondaPkgPanel extends React.Component<
     });
   }
 
+  handleDependenciesGraph = (pkg: Conda.IPackage): void => {
+    showDialog({
+      title: pkg.name,
+      body: new PkgGraph(this._model, pkg.name),
+      buttons: [Dialog.okButton()],
+    })
+  }
+
   handleSearch(event: any): void {
     if (this.state.isApplyingChanges) {
       return;
@@ -505,6 +514,7 @@ export class CondaPkgPanel extends React.Component<
           packages={searchPkgs}
           onPkgClick={this.handleClick}
           onPkgChange={this.handleVersionSelection}
+          onPkgGraph={this.handleDependenciesGraph}
         />
       </div>
     );

packages/common/src/components/PkgGraph.tsx

@@ -0,0 +1,87 @@
+import {
+  ReactWidget
+} from '@jupyterlab/apputils';
+
+import { Graph, GraphData, GraphNode, GraphLink } from "react-d3-graph";
+
+import * as React from 'react';
+
+import { Conda } from '../tokens';
+
+export class PkgGraph extends ReactWidget {
+  constructor(pkgManager: Conda.IPackageManager, pkg: string) {
+    super();
+    this._package = pkg;
+    this._pkgManager = pkgManager;
+    this._loading = true;
+
+    // create a network
+    this._data = { nodes: [], links: [] };
+    if (this._package) this._updatePackages();
+  }
+
+  public showGraph(pkg: string): void {
+    this._package = pkg;
+    this._updatePackages();
+  }
+
+  private async _updatePackages(): Promise<void> {
+    this._loading = true;
+    this.update();
+
+    this._pkgManager.getDependencies(this._package, true)
+    .then( available => {
+      this._data.nodes = [];
+      this._data.links = [];
+
+      Object.keys(available).forEach( key => {
+        this._data.nodes.push({ id: key });
+        available[key].forEach( dep => {
+          const dependencie = dep.split(' ')[0];
+          if (!this._data.nodes.find(value => value.id === dependencie)) {
+            this._data.nodes.push({ id: dependencie });
+          }
+          this._data.links.push({ source: key, target: dependencie });
+        });
+      });
+
+      this._loading = false;
+      this.update();
+    })
+  }
+
+  render(): JSX.Element {
+    const config = {
+      nodeHighlightBehavior: true,
+      node: {
+        color: "lightblue",
+        highlightStrokeColor: "blue",
+      },
+      link: { highlightColor: "blue" },
+    };
+    return (
+      <div>
+        {
+          this._loading
+          ?
+            <span>Loading dependencies</span>
+          :
+          <div>
+            {
+              this._data.nodes.length !== 0
+              ? 
+                <Graph id="graph-id" data={this._data} config={config}/>
+              :
+                <span>This is a pip package</span>
+            }
+          </div>
+        }
+      </div>
+    );
+  }
+
+  private _pkgManager: Conda.IPackageManager;
+  private _data: GraphData<GraphNode, GraphLink>;
+  private _package: string;
+  private _loading: boolean;
+}

packages/common/src/services.ts

@@ -721,6 +721,34 @@ export class CondaPackage implements Conda.IPackageManager {
     }
   }
 
+  async getDependencies(
+    pkg: string,
+    cancellable = true
+  ): Promise<Conda.IPackageDeps> {
+    this._cancelTasks();
+    const request: RequestInit = {
+      method: 'GET'
+    };
+
+    const { promise, cancel } = Private.requestServer(
+      URLExt.join('conda', 'packages') +
+      URLExt.objectToQueryString({ package: pkg }),
+      request
+    );
+
+    let idx: number;
+    if (cancellable) {
+      idx = this._cancellableStack.push(cancel) - 1;
+    }
+
+    const response = await promise;
+    if (idx) {
+      this._cancellableStack.splice(idx, 1);
+    }
+    const data = (await response.json()) as Conda.IPackageDeps;
+    return Promise.resolve(data);
+  }
+
   async refreshAvailablePackages(cancellable = true): Promise<void> {
     await this._getAvailablePackages(true, cancellable);
   }

packages/common/src/tokens.ts

@@ -192,6 +192,16 @@ export namespace Conda {
      * @param environment Environment name
      */
     remove(packages: Array<string>, environment?: string): Promise<void>;
+    /**
+     * Get packages dependencies list.
+     *
+     * @param environment Environment name
+     * @param package Package name
+     * @param cancellable Can this asynchronous action be cancelled?
+     *
+     * @returns The package list
+     */
+    getDependencies(pkg: string, cancellable: boolean): Promise<{[key: string]: [string]}> 
     /**
      * Signal emitted when some package actions are executed.
      */
@@ -233,6 +243,9 @@ export namespace Conda {
     version_selected?: string;
     updatable?: boolean;
   }
+  export interface IPackageDeps {
+    [key: string]: [string]
+  }
 
   export interface IPackageChange {
     /**