Merge branch 'main' of https://github.com/Shubha-accenture/dataproc-j…

…upyter-plugin-fork into sprint19-api-migration-changes

src/controls/NotebookButtonExtension.tsx

@@ -31,6 +31,7 @@ import { SessionTemplate } from '../sessions/sessionTemplate';
 import serverlessIcon from '../../style/icons/serverless_icon.svg';
 import notebookSchedulerIcon from '../../style/icons/scheduler_calendar_month.svg';
 import { NotebookScheduler } from '../scheduler/notebookScheduler';
+import { ISettingRegistry } from '@jupyterlab/settingregistry';
 
 const iconLogs = new LabIcon({
   name: 'launcher:logs-icon',
@@ -57,6 +58,7 @@ class NotebookButtonExtensionPoint implements IDisposable {
   isDisposed: boolean;
   private readonly sparkLogsButton: ToolbarButton;
   private readonly sessionDetailsButton: ToolbarButton;
+  private readonly sessionDetailsButtonDisable: ToolbarButton;
   private readonly notebookSchedulerButton: ToolbarButton;
   private sessionId?: string;
 
@@ -69,6 +71,7 @@ class NotebookButtonExtensionPoint implements IDisposable {
     private readonly panel: NotebookPanel,
     private readonly context: DocumentRegistry.IContext<INotebookModel>,
     private readonly app: JupyterLab,
+    private readonly settingRegistry: ISettingRegistry,
     private readonly launcher: ILauncher,
     private readonly themeManager: IThemeManager
   ) {
@@ -96,6 +99,19 @@ class NotebookButtonExtensionPoint implements IDisposable {
       'session-details',
       this.sessionDetailsButton
     );
+    this.sessionDetailsButton.hide();
+
+    this.sessionDetailsButtonDisable = new ToolbarButton({
+      icon: iconSessionLogs,
+      tooltip: 'Please wait till session is ready',
+      className: 'dark-theme-logs-disable'
+    });
+    this.panel.toolbar.insertItem(
+      1000,
+      'session-details-disable',
+      this.sessionDetailsButtonDisable
+    );
+
     this.notebookSchedulerButton = new ToolbarButton({
       icon: iconNotebookScheduler,
       onClick: () => this.onNotebookSchedulerClick(),
@@ -113,6 +129,7 @@ class NotebookButtonExtensionPoint implements IDisposable {
     const content = new NotebookScheduler(
       this.app as JupyterLab,
       this.themeManager,
+      this.settingRegistry as ISettingRegistry,
       this.context
     );
     const widget = new MainAreaWidget<NotebookScheduler>({ content });
@@ -153,6 +170,8 @@ class NotebookButtonExtensionPoint implements IDisposable {
    *  3) Show or hide the log and session details buttons as necessary.
    */
   private onKernelChanged = async (session: ISessionContext) => {
+    this.sessionDetailsButton.hide();
+
     // Get the current kernel ID and look for the kernel in the kernel API.
     const currentId = session.session?.kernel?.id;
     const runningKernels = await KernelAPI.listRunning();
@@ -167,6 +186,7 @@ class NotebookButtonExtensionPoint implements IDisposable {
       // hide everything and abort.
       this.sparkLogsButton.hide();
       this.sessionDetailsButton.hide();
+      this.sessionDetailsButtonDisable.hide();
       this.sessionId = undefined;
       this.shsUri = undefined;
       return;
@@ -184,12 +204,14 @@ class NotebookButtonExtensionPoint implements IDisposable {
       // TODO: fix this for Cluster Notebooks.
       this.sparkLogsButton.hide();
       this.sessionDetailsButton.hide();
+      this.sessionDetailsButtonDisable.hide();
       this.sessionId = undefined;
       this.shsUri = undefined;
       return;
     }
 
     // If session ID is specified, show session detail button.
+    this.sessionDetailsButtonDisable.hide();
     this.sessionDetailsButton.show();
 
     // Fetch session details (we care about the SHS URL) from OnePlatform.
@@ -228,6 +250,7 @@ export class NotebookButtonExtension
 {
   constructor(
     private app: JupyterLab,
+    private settingRegistry: ISettingRegistry,
     private launcher: ILauncher,
     private themeManager: IThemeManager
   ) {}
@@ -240,6 +263,7 @@ export class NotebookButtonExtension
       panel,
       context,
       this.app,
+      this.settingRegistry,
       this.launcher,
       this.themeManager
     );

src/index.ts

@@ -255,7 +255,12 @@ const extension: JupyterFrontEndPlugin<void> = {
 
     app.docRegistry.addWidgetExtension(
       'Notebook',
-      new NotebookButtonExtension(app as JupyterLab, launcher, themeManager)
+      new NotebookButtonExtension(
+        app as JupyterLab,
+        settingRegistry as ISettingRegistry,
+        launcher,
+        themeManager
+      )
     );
 
     const loadDpmsWidget = (value: string) => {
@@ -533,6 +538,7 @@ const extension: JupyterFrontEndPlugin<void> = {
         const content = new NotebookScheduler(
           app as JupyterLab,
           themeManager,
+          settingRegistry as ISettingRegistry,
           ''
         );
         const widget = new MainAreaWidget<NotebookScheduler>({ content });

src/scheduler/createNotebookScheduler.tsx

@@ -45,6 +45,7 @@ import errorIcon from '../../style/icons/error_icon.svg';
 import { Button } from '@mui/material';
 import { scheduleMode } from '../utils/const';
 import { scheduleValueExpression } from '../utils/const';
+import { ISettingRegistry } from '@jupyterlab/settingregistry';
 
 interface IDagList {
   jobid: string;
@@ -66,11 +67,13 @@ const iconError = new LabIcon({
 const CreateNotebookScheduler = ({
   themeManager,
   app,
-  context
+  context,
+  settingRegistry
 }: {
   themeManager: IThemeManager;
   app: JupyterLab;
   context: any;
+  settingRegistry: ISettingRegistry;
 }): JSX.Element => {
   const [jobNameSelected, setJobNameSelected] = useState('');
   const [inputFileSelected, setInputFileSelected] = useState('');
@@ -407,6 +410,7 @@ const CreateNotebookScheduler = ({
         <NotebookJobComponent
           app={app}
           themeManager={themeManager}
+          settingRegistry={settingRegistry}
           composerSelectedFromCreate={composerSelected}
           setCreateCompleted={setCreateCompleted}
           setJobNameSelected={setJobNameSelected}

src/scheduler/listNotebookScheduler.tsx

@@ -34,7 +34,8 @@ import PollingTimer from '../utils/pollingTimer';
 import PollingImportErrorTimer from '../utils/pollingImportErrorTimer';
 import ImportErrorPopup from '../utils/importErrorPopup';
 import triggerIcon from '../../style/icons/scheduler_trigger.svg';
-import { scheduleMode } from '../utils/const';
+import { PLUGIN_ID, scheduleMode } from '../utils/const';
+import { ISettingRegistry } from '@jupyterlab/settingregistry';
 
 const iconDelete = new LabIcon({
   name: 'launcher:delete-icon',
@@ -70,6 +71,7 @@ interface IDagList {
 
 function listNotebookScheduler({
   app,
+  settingRegistry,
   handleDagIdSelection,
   backButtonComposerName,
   composerSelectedFromCreate,
@@ -103,6 +105,7 @@ function listNotebookScheduler({
   setIsLoadingKernelDetail
 }: {
   app: JupyterFrontEnd;
+  settingRegistry: ISettingRegistry;
   handleDagIdSelection: (composerName: string, dagId: string) => void;
   backButtonComposerName: string;
   composerSelectedFromCreate: string;
@@ -151,6 +154,7 @@ function listNotebookScheduler({
   const [deletingNotebook, setDeletingNotebook] = useState(false);
   const [importErrorData, setImportErrorData] = useState<string[]>([]);
   const [importErrorEntries, setImportErrorEntries] = useState<number>(0);
+  const [isPreviewEnabled, setIsPreviewEnabled] = useState(false);
   const columns = React.useMemo(
     () => [
       {
@@ -291,7 +295,7 @@ function listNotebookScheduler({
   };
 
   const handleDeleteImportError = async (dagId: string) => {
-    const fromPage = "importErrorPage";
+    const fromPage = 'importErrorPage';
     await SchedulerService.handleDeleteSchedulerAPIService(
       composerSelectedList,
       dagId,
@@ -415,28 +419,29 @@ function listNotebookScheduler({
             />
           </div>
         )}
-        {data.jobid === editNotebookLoading ? (
-          <div className="icon-buttons-style">
-            <CircularProgress
-              size={18}
-              aria-label="Loading Spinner"
-              data-testid="loader"
-            />
-          </div>
-        ) : (
-          <div
-            role="button"
-            className="icon-buttons-style"
-            title="Edit Notebook"
-            data-jobid={data.jobid}
-            onClick={e => handleEditNotebook(e)}
-          >
-            <iconEditDag.react
-              tag="div"
-              className="icon-white logo-alignment-style"
-            />
-          </div>
-        )}
+        {isPreviewEnabled &&
+          (data.jobid === editNotebookLoading ? (
+            <div className="icon-buttons-style">
+              <CircularProgress
+                size={18}
+                aria-label="Loading Spinner"
+                data-testid="loader"
+              />
+            </div>
+          ) : (
+            <div
+              role="button"
+              className="icon-buttons-style"
+              title="Edit Notebook"
+              data-jobid={data.jobid}
+              onClick={e => handleEditNotebook(e)}
+            >
+              <iconEditDag.react
+                tag="div"
+                className="icon-white logo-alignment-style"
+              />
+            </div>
+          ))}
         <div
           role="button"
           className="icon-buttons-style"
@@ -477,17 +482,34 @@ function listNotebookScheduler({
       );
     }
   };
+
+  const checkPreviewEnabled = async () => {
+    const settings = await settingRegistry.load(PLUGIN_ID);
+
+    // The current value of whether or not preview features are enabled.
+    let previewEnabled = settings.get('previewEnabled').composite as boolean;
+    setIsPreviewEnabled(previewEnabled);
+  };
+
+  const openEditDagNotebookFile = async () => {
+    let filePath = inputNotebookFilePath.replace('gs://', 'gs:');
+    const openNotebookFile: any = await app.commands.execute('docmanager:open', {
+      path: filePath
+    });
+    setInputNotebookFilePath('');
+    if (openNotebookFile) {
+      setEditNotebookLoading('');
+    }
+  };
+
   useEffect(() => {
     if (inputNotebookFilePath !== '') {
-      let filePath = inputNotebookFilePath.replace('gs://', 'gs:');
-      app.commands.execute('docmanager:open', {
-        path: filePath
-      });
-      setInputNotebookFilePath('');
+      openEditDagNotebookFile();
     }
   }, [inputNotebookFilePath]);
 
   useEffect(() => {
+    checkPreviewEnabled();
     const loadComposerListAndSelectFirst = async () => {
       await listComposersAPI();
     };

src/scheduler/notebookJobs.tsx

@@ -22,9 +22,11 @@ import { IThemeManager } from '@jupyterlab/apputils';
 import ListNotebookScheduler from './listNotebookScheduler';
 import ExecutionHistory from './executionHistory';
 import { scheduleMode } from '../utils/const';
+import { ISettingRegistry } from '@jupyterlab/settingregistry';
 
 const NotebookJobComponent = ({
   app,
+  settingRegistry,
   composerSelectedFromCreate,
   setCreateCompleted,
   setJobNameSelected,
@@ -55,6 +57,7 @@ const NotebookJobComponent = ({
 }: {
   app: JupyterLab;
   themeManager: IThemeManager;
+  settingRegistry: ISettingRegistry;
   composerSelectedFromCreate: string;
   setCreateCompleted?: (value: boolean) => void;
   setJobNameSelected?: (value: string) => void;
@@ -116,6 +119,7 @@ const NotebookJobComponent = ({
           <div>
             <ListNotebookScheduler
               app={app}
+              settingRegistry={settingRegistry}
               handleDagIdSelection={handleDagIdSelection}
               backButtonComposerName={backComposerName}
               composerSelectedFromCreate={composerSelectedFromCreate}
@@ -156,21 +160,25 @@ const NotebookJobComponent = ({
 
 export class NotebookJobs extends DataprocWidget {
   app: JupyterLab;
+  settingRegistry: ISettingRegistry;
   composerSelectedFromCreate: string;
 
   constructor(
     app: JupyterLab,
+    settingRegistry: ISettingRegistry,
     themeManager: IThemeManager,
     composerSelectedFromCreate: string
   ) {
     super(themeManager);
     this.app = app;
+    this.settingRegistry = settingRegistry;
     this.composerSelectedFromCreate = composerSelectedFromCreate;
   }
   renderInternal(): React.JSX.Element {
     return (
       <NotebookJobComponent
         app={this.app}
+        settingRegistry={this.settingRegistry}
         themeManager={this.themeManager}
         composerSelectedFromCreate={this.composerSelectedFromCreate}
       />

src/scheduler/notebookScheduler.tsx

@@ -24,22 +24,26 @@ import CreateNotebookScheduler from './createNotebookScheduler';
 
 import { DocumentRegistry } from '@jupyterlab/docregistry';
 import { INotebookModel } from '@jupyterlab/notebook';
+import { ISettingRegistry } from '@jupyterlab/settingregistry';
 
 const NotebookSchedulerComponent = ({
   themeManager,
   app,
-  context
+  context,
+  settingRegistry
 }: {
   themeManager: IThemeManager;
   app: JupyterLab;
   context: DocumentRegistry.IContext<INotebookModel> | string;
+  settingRegistry: ISettingRegistry;
 }): JSX.Element => {
   return (
     <div className="component-level">
       <CreateNotebookScheduler
         themeManager={themeManager}
         app={app}
         context={context}
+        settingRegistry={settingRegistry}
       />
     </div>
   );
@@ -48,15 +52,18 @@ const NotebookSchedulerComponent = ({
 export class NotebookScheduler extends DataprocWidget {
   app: JupyterLab;
   context: DocumentRegistry.IContext<INotebookModel> | string;
+  settingRegistry: ISettingRegistry;
 
   constructor(
     app: JupyterLab,
     themeManager: IThemeManager,
+    settingRegistry: ISettingRegistry,
     context: DocumentRegistry.IContext<INotebookModel> | string
   ) {
     super(themeManager);
     this.app = app;
     this.context = context;
+    this.settingRegistry = settingRegistry;
   }
 
   renderInternal(): React.JSX.Element {
@@ -65,6 +72,7 @@ export class NotebookScheduler extends DataprocWidget {
         themeManager={this.themeManager}
         app={this.app}
         context={this.context}
+        settingRegistry={this.settingRegistry}
       />
     );
   }