@theia/notebook 1.43.1 → 1.45.0

package/src/browser/service/notebook-kernel-history-service.ts

@@ -21,7 +21,9 @@
 import { inject, injectable, postConstruct } from '@theia/core/shared/inversify';
 import { StorageService } from '@theia/core/lib/browser';
 import { NotebookKernel, NotebookTextModelLike, NotebookKernelService } from './notebook-kernel-service';
-import { Disposable } from '@theia/core';
+import { CommandService, Disposable } from '@theia/core';
+import { NotebookModel } from '../view-model/notebook-model';
+import { NotebookCommands } from '../contributions/notebook-actions-contribution';
 
 interface KernelsList {
     [viewType: string]: string[];
@@ -43,6 +45,9 @@ export class NotebookKernelHistoryService implements Disposable {
     @inject(NotebookKernelService)
     protected notebookKernelService: NotebookKernelService;
 
+    @inject(CommandService)
+    protected commandService: CommandService;
+
     declare serviceBrand: undefined;
 
     private static STORAGE_KEY = 'notebook.kernelHistory';
@@ -68,6 +73,18 @@ export class NotebookKernelHistoryService implements Disposable {
         };
     }
 
+    async resolveSelectedKernel(notebook: NotebookModel): Promise<NotebookKernel | undefined> {
+        const alreadySelected = this.getKernels(notebook);
+
+        if (alreadySelected.selected) {
+            return alreadySelected.selected;
+        }
+
+        await this.commandService.executeCommand(NotebookCommands.SELECT_KERNEL_COMMAND.id, notebook);
+        const { selected } = this.getKernels(notebook);
+        return selected;
+    }
+
     addMostRecentKernel(kernel: NotebookKernel): void {
         const viewType = kernel.viewType;
         const recentKernels = this.mostRecentKernelsMap[viewType] ?? [kernel.id];

package/src/browser/service/notebook-kernel-quick-pick-service.ts

@@ -18,19 +18,18 @@
  *  Copyright (c) Microsoft Corporation. All rights reserved.
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
-import { ArrayUtils, Command, CommandService, DisposableCollection, Event, nls, QuickInputButton, QuickInputService, QuickPickInput, QuickPickItem, URI, } from '@theia/core';
+import { ArrayUtils, CommandService, DisposableCollection, Event, nls, QuickInputButton, QuickInputService, QuickPickInput, QuickPickItem, URI, } from '@theia/core';
 import { inject, injectable } from '@theia/core/shared/inversify';
 import { NotebookKernelService, NotebookKernel, NotebookKernelMatchResult, SourceCommand } from './notebook-kernel-service';
 import { NotebookModel } from '../view-model/notebook-model';
 import { NotebookEditorWidget } from '../notebook-editor-widget';
 import { codicon, OpenerService } from '@theia/core/lib/browser';
 import { NotebookKernelHistoryService } from './notebook-kernel-history-service';
+import { NotebookCommand, NotebookModelResource } from '../../common';
 import debounce = require('@theia/core/shared/lodash.debounce');
 
 export const JUPYTER_EXTENSION_ID = 'ms-toolsai.jupyter';
 
-export const NotebookKernelQuickPickService = Symbol('NotebookKernelQuickPickService');
-
 type KernelPick = QuickPickItem & { kernel: NotebookKernel };
 function isKernelPick(item: QuickPickInput<QuickPickItem>): item is KernelPick {
     return 'kernel' in item;
@@ -45,7 +44,7 @@ function isSourcePick(item: QuickPickInput<QuickPickItem>): item is SourcePick {
 }
 type InstallExtensionPick = QuickPickItem & { extensionIds: string[] };
 
-type KernelSourceQuickPickItem = QuickPickItem & { command: Command; documentation?: string };
+type KernelSourceQuickPickItem = QuickPickItem & { command: NotebookCommand; documentation?: string };
 function isKernelSourceQuickPickItem(item: QuickPickItem): item is KernelSourceQuickPickItem {
     return 'command' in item;
 }
@@ -82,7 +81,7 @@ function toKernelQuickPick(kernel: NotebookKernel, selected: NotebookKernel | un
 }
 
 @injectable()
-export abstract class NotebookKernelQuickPickServiceImpl {
+export class NotebookKernelQuickPickService {
 
     @inject(NotebookKernelService)
     protected readonly notebookKernelService: NotebookKernelService;
@@ -91,6 +90,12 @@ export abstract class NotebookKernelQuickPickServiceImpl {
     @inject(CommandService)
     protected readonly commandService: CommandService;
 
+    @inject(OpenerService)
+    protected openerService: OpenerService;
+
+    @inject(NotebookKernelHistoryService)
+    protected notebookKernelHistoryService: NotebookKernelHistoryService;
+
     async showQuickPick(editor: NotebookModel, wantedId?: string, skipAutoRun?: boolean): Promise<boolean> {
         const notebook = editor;
         const matchResult = this.getMatchingResult(notebook);
@@ -200,40 +205,6 @@ export abstract class NotebookKernelQuickPickServiceImpl {
         return false;
     }
 
-    protected getMatchingResult(notebook: NotebookModel): NotebookKernelMatchResult {
-        return this.notebookKernelService.getMatchingKernel(notebook);
-    }
-
-    protected abstract getKernelPickerQuickPickItems(matchResult: NotebookKernelMatchResult): QuickPickInput<KernelQuickPickItem>[];
-
-    protected async handleQuickPick(editor: NotebookModel, pick: KernelQuickPickItem, quickPickItems: KernelQuickPickItem[]): Promise<boolean> {
-        if (isKernelPick(pick)) {
-            const newKernel = pick.kernel;
-            this.selectKernel(editor, newKernel);
-            return true;
-        }
-
-        if (isSourcePick(pick)) {
-            // selected explicitly, it should trigger the execution?
-            pick.action.run(this.commandService);
-        }
-
-        return true;
-    }
-
-    protected selectKernel(notebook: NotebookModel, kernel: NotebookKernel): void {
-        this.notebookKernelService.selectKernelForNotebook(kernel, notebook);
-    }
-}
-@injectable()
-export class KernelPickerMRUStrategy extends NotebookKernelQuickPickServiceImpl {
-
-    @inject(OpenerService)
-    protected openerService: OpenerService;
-
-    @inject(NotebookKernelHistoryService)
-    protected notebookKernelHistoryService: NotebookKernelHistoryService;
-
     protected getKernelPickerQuickPickItems(matchResult: NotebookKernelMatchResult): QuickPickInput<KernelQuickPickItem>[] {
         const quickPickItems: QuickPickInput<KernelQuickPickItem>[] = [];
 
@@ -266,17 +237,17 @@ export class KernelPickerMRUStrategy extends NotebookKernelQuickPickServiceImpl
         return quickPickItems;
     }
 
-    protected override selectKernel(notebook: NotebookModel, kernel: NotebookKernel): void {
+    protected selectKernel(notebook: NotebookModel, kernel: NotebookKernel): void {
         const currentInfo = this.notebookKernelService.getMatchingKernel(notebook);
         if (currentInfo.selected) {
             // there is already a selected kernel
             this.notebookKernelHistoryService.addMostRecentKernel(currentInfo.selected);
         }
-        super.selectKernel(notebook, kernel);
+        this.notebookKernelService.selectKernelForNotebook(kernel, notebook);
         this.notebookKernelHistoryService.addMostRecentKernel(kernel);
     }
 
-    protected override getMatchingResult(notebook: NotebookModel): NotebookKernelMatchResult {
+    protected getMatchingResult(notebook: NotebookModel): NotebookKernelMatchResult {
         const { selected, all } = this.notebookKernelHistoryService.getKernels(notebook);
         const matchingResult = this.notebookKernelService.getMatchingKernel(notebook);
         return {
@@ -287,12 +258,23 @@ export class KernelPickerMRUStrategy extends NotebookKernelQuickPickServiceImpl
         };
     }
 
-    protected override async handleQuickPick(editor: NotebookModel, pick: KernelQuickPickItem, items: KernelQuickPickItem[]): Promise<boolean> {
+    protected async handleQuickPick(editor: NotebookModel, pick: KernelQuickPickItem, items: KernelQuickPickItem[]): Promise<boolean> {
         if (pick.id === 'selectAnother') {
             return this.displaySelectAnotherQuickPick(editor, items.length === 1 && items[0] === pick);
         }
 
-        return super.handleQuickPick(editor, pick, items);
+        if (isKernelPick(pick)) {
+            const newKernel = pick.kernel;
+            this.selectKernel(editor, newKernel);
+            return true;
+        }
+
+        if (isSourcePick(pick)) {
+            // selected explicitly, it should trigger the execution?
+            pick.action.run(this.commandService);
+        }
+
+        return true;
     }
 
     private async displaySelectAnotherQuickPick(editor: NotebookModel, kernelListEmpty: boolean): Promise<boolean> {
@@ -488,10 +470,8 @@ export class KernelPickerMRUStrategy extends NotebookKernelQuickPickServiceImpl
         quickPick.show();
     }
 
-    private async executeCommand<T>(notebook: NotebookModel, command: string | Command): Promise<T | undefined | void> {
-        const id = typeof command === 'string' ? command : command.id;
-
-        return this.commandService.executeCommand(id, { uri: notebook.uri });
-
+    private async executeCommand<T>(notebook: NotebookModel, command: NotebookCommand): Promise<T | undefined | void> {
+        const args = (command.arguments || []).concat([NotebookModelResource.create(notebook.uri)]);
+        return this.commandService.executeCommand(command.id, ...args);
     }
 }

package/src/browser/service/notebook-service.ts

@@ -135,22 +135,31 @@ export class NotebookService implements Disposable {
         if (this.notebookProviders.has(type)) {
             return this.notebookProviders.get(type);
         }
-        await Promise.all(this.willUseNotebookSerializerEmitter.fire(type));
         const deferred = new Deferred<NotebookProviderInfo | undefined>();
         // 20 seconds of timeout
         const timeoutDuration = 20_000;
-        const disposable = this.onDidRegisterNotebookSerializer(viewType => {
+
+        // Must declare these variables where they can be captured by the closure
+        let disposable: Disposable;
+        // eslint-disable-next-line
+        let timeout: ReturnType<typeof setTimeout>;
+
+        // eslint-disable-next-line
+        disposable = this.onDidRegisterNotebookSerializer(viewType => {
             if (viewType === type) {
                 clearTimeout(timeout);
                 disposable.dispose();
                 deferred.resolve(this.notebookProviders.get(type));
             }
         });
-        const timeout = setTimeout(() => {
+        timeout = setTimeout(() => {
             clearTimeout(timeout);
             disposable.dispose();
-            deferred.reject();
+            deferred.reject(new Error(`Timed out while waiting for notebook serializer for type ${type} to be registered`));
         }, timeoutDuration);
+
+        await Promise.all(this.willUseNotebookSerializerEmitter.fire(type));
+
         return deferred.promise;
     }
 

package/src/browser/view/notebook-cell-editor.tsx

@@ -77,13 +77,12 @@ export class CellEditor extends React.Component<CellEditorProps, {}> {
             }));
             this.toDispose.push(this.editor.onDocumentContentChanged(e => {
                 notebookModel.cellDirtyChanged(cell, true);
-                cell.source = e.document.getText();
             }));
         }
     }
 
-    protected assignRef = (component: HTMLDivElement) => {
-        this.container = component;
+    protected setContainer(component: HTMLDivElement | null): void {
+        this.container = component ?? undefined;
     };
 
     protected handleResize = () => {
@@ -91,7 +90,10 @@ export class CellEditor extends React.Component<CellEditorProps, {}> {
     };
 
     override render(): React.ReactNode {
-        return <div className='theia-notebook-cell-editor' onResize={this.handleResize} id={this.props.cell.uri.toString()} ref={this.assignRef}></div>;
-    }
+        return <div className='theia-notebook-cell-editor' onResize={this.handleResize} id={this.props.cell.uri.toString()}
+                    ref={container => this.setContainer(container)}>
+
+        </div>;
+     }
 
 }

package/src/browser/view/notebook-cell-list-view.tsx

@@ -47,7 +47,11 @@ export class NotebookCellListView extends React.Component<CellListProps, Noteboo
         super(props);
         this.state = { selectedCell: undefined, dragOverIndicator: undefined };
         this.toDispose.push(props.notebookModel.onDidAddOrRemoveCell(e => {
-            this.setState({ selectedCell: undefined });
+            if (e.newCellIds && e.newCellIds.length > 0) {
+                this.setState({ ...this.state, selectedCell: this.props.notebookModel.cells.find(model => model.handle === e.newCellIds![e.newCellIds!.length - 1]) });
+            } else {
+                this.setState({ ...this.state, selectedCell: this.props.notebookModel.cells.find(cell => cell === this.state.selectedCell)});
+            }
         }));
     }
 
@@ -101,7 +105,8 @@ export class NotebookCellListView extends React.Component<CellListProps, Noteboo
 
     protected onDragStart(event: React.DragEvent<HTMLLIElement>, index: number): void {
         event.stopPropagation();
-        event.dataTransfer.setData('text/notebook-cell-index', index.toString());
+        event.dataTransfer.setData('text/theia-notebook-cell-index', index.toString());
+        event.dataTransfer.setData('text/plain', this.props.notebookModel.cells[index].source);
     }
 
     protected onDragOver(event: React.DragEvent<HTMLLIElement>, cell: NotebookCellModel, position?: 'top' | 'bottom'): void {
@@ -112,7 +117,7 @@ export class NotebookCellListView extends React.Component<CellListProps, Noteboo
     }
 
     protected onDrop(event: React.DragEvent<HTMLLIElement>, dropElementIndex: number): void {
-        const index = parseInt(event.dataTransfer.getData('text/notebook-cell-index'));
+        const index = parseInt(event.dataTransfer.getData('text/theia-notebook-cell-index'));
         const isTargetBelow = index < dropElementIndex;
         let newIdx = this.state.dragOverIndicator?.position === 'top' ? dropElementIndex : dropElementIndex + 1;
         newIdx = isTargetBelow ? newIdx - 1 : newIdx;

package/src/browser/view/notebook-cell-toolbar-factory.tsx

@@ -29,6 +29,7 @@ export interface NotebookCellToolbarItem {
     icon?: string;
     label?: string;
     onClick: (e: React.MouseEvent) => void;
+    contextKeys?: Set<string>
 }
 
 @injectable()
@@ -85,7 +86,8 @@ export class NotebookCellToolbarFactory {
                         includeAnchorArg: false,
                         args: [notebookModel, cell, output]
                     }) :
-                () => this.commandRegistry.executeCommand(menuNode.command!, notebookModel, cell, output)
+                () => this.commandRegistry.executeCommand(menuNode.command!, notebookModel, cell, output),
+            contextKeys: menuNode.when ? this.contextKeyService.parseKeys(menuNode.when) : undefined
         };
     }
 }

package/src/browser/view/notebook-cell-toolbar.tsx

@@ -17,24 +17,27 @@ import * as React from '@theia/core/shared/react';
 import { ACTION_ITEM } from '@theia/core/lib/browser';
 import { NotebookCellToolbarItem } from './notebook-cell-toolbar-factory';
 import { DisposableCollection, Event } from '@theia/core';
+import { ContextKeyChangeEvent } from '@theia/core/lib/browser/context-key-service';
 
 export interface NotebookCellToolbarProps {
     getMenuItems: () => NotebookCellToolbarItem[];
-    onContextKeysChanged: Event<void>;
+    onContextKeysChanged: Event<ContextKeyChangeEvent>;
 }
 
 interface NotebookCellToolbarState {
     inlineItems: NotebookCellToolbarItem[];
 }
 
-abstract class NotebookCellActionItems extends React.Component<NotebookCellToolbarProps, NotebookCellToolbarState> {
+abstract class NotebookCellActionBar extends React.Component<NotebookCellToolbarProps, NotebookCellToolbarState> {
 
     protected toDispose = new DisposableCollection();
 
     constructor(props: NotebookCellToolbarProps) {
         super(props);
         this.toDispose.push(props.onContextKeysChanged(e => {
-            this.setState({ inlineItems: this.props.getMenuItems() });
+            if (this.props.getMenuItems().some(item => item.contextKeys ? e.affects(item.contextKeys) : false)) {
+                this.setState({ inlineItems: this.props.getMenuItems() });
+            }
         }));
         this.state = { inlineItems: this.props.getMenuItems() };
     }
@@ -49,7 +52,7 @@ abstract class NotebookCellActionItems extends React.Component<NotebookCellToolb
 
 }
 
-export class NotebookCellToolbar extends NotebookCellActionItems {
+export class NotebookCellToolbar extends NotebookCellActionBar {
 
     override render(): React.ReactNode {
         return <div className='theia-notebook-cell-toolbar'>
@@ -59,7 +62,7 @@ export class NotebookCellToolbar extends NotebookCellActionItems {
 
 }
 
-export class NotebookCellSidebar extends NotebookCellActionItems {
+export class NotebookCellSidebar extends NotebookCellActionBar {
 
     override render(): React.ReactNode {
         return <div className='theia-notebook-cell-sidebar'>

package/src/browser/view/notebook-main-toolbar.tsx

@@ -66,6 +66,15 @@ export class NotebookMainToolbar extends React.Component<NotebookMainToolbarProp
                 this.setState({ selectedKernelLabel: props.notebookKernelService.getSelectedOrSuggestedKernel(props.notebookModel)?.label });
             }
         }));
+
+        // TODO maybe we need a mechanism to check for changes in the menu to update this toolbar
+        const contextKeys = new Set<string>();
+        this.getMenuItems().filter(item => item.when).forEach(item => props.contextKeyService.parseKeys(item.when!)?.forEach(key => contextKeys.add(key)));
+        props.contextKeyService.onDidChange(e => {
+            if (e.affects(contextKeys)) {
+                this.forceUpdate();
+            }
+        });
     }
 
     override componentWillUnmount(): void {

package/src/browser/view-model/notebook-cell-model.ts

@@ -20,12 +20,14 @@
 
 import { Disposable, DisposableCollection, Emitter, Event, URI } from '@theia/core';
 import { inject, injectable, interfaces, postConstruct } from '@theia/core/shared/inversify';
+import { ContextKeyChangeEvent } from '@theia/core/lib/browser/context-key-service';
 import { MonacoEditorModel } from '@theia/monaco/lib/browser/monaco-editor-model';
 import { MonacoTextModelService } from '@theia/monaco/lib/browser/monaco-text-model-service';
 import {
-    CellInternalMetadataChangedEvent, CellKind, NotebookCellCollapseState, NotebookCellInternalMetadata,
-    NotebookCellMetadata, NotebookCellOutputsSplice, CellOutput, CellData, NotebookCell, CellOutputItem
+    CellKind, NotebookCellCollapseState, NotebookCellInternalMetadata,
+    NotebookCellMetadata, CellOutput, CellData, CellOutputItem
 } from '../../common';
+import { NotebookCellOutputsSplice } from '../notebook-types';
 import { NotebookCellOutputModel } from './notebook-cell-output-model';
 
 export const NotebookCellModelFactory = Symbol('NotebookModelFactory');
@@ -47,7 +49,28 @@ const NotebookCellContextManager = Symbol('NotebookCellContextManager');
 interface NotebookCellContextManager {
     updateCellContext(cell: NotebookCellModel, context: HTMLElement): void;
     dispose(): void;
-    onDidChangeContext: Event<void>;
+    onDidChangeContext: Event<ContextKeyChangeEvent>;
+}
+
+export interface CellInternalMetadataChangedEvent {
+    readonly lastRunSuccessChanged?: boolean;
+}
+
+export interface NotebookCell {
+    readonly uri: URI;
+    handle: number;
+    language: string;
+    cellKind: CellKind;
+    outputs: CellOutput[];
+    metadata: NotebookCellMetadata;
+    internalMetadata: NotebookCellInternalMetadata;
+    text: string;
+    onDidChangeOutputs?: Event<NotebookCellOutputsSplice>;
+    onDidChangeOutputItems?: Event<CellOutput>;
+    onDidChangeLanguage: Event<string>;
+    onDidChangeMetadata: Event<void>;
+    onDidChangeInternalMetadata: Event<CellInternalMetadataChangedEvent>;
+
 }
 
 const NotebookCellModelProps = Symbol('NotebookModelProps');
@@ -144,6 +167,7 @@ export class NotebookCellModel implements NotebookCell, Disposable {
     }
     set source(source: string) {
         this.props.source = source;
+        this.textModel?.textEditorModel.setValue(source);
     }
     get language(): string {
         return this.props.language;
@@ -274,6 +298,9 @@ export class NotebookCellModel implements NotebookCell, Disposable {
 
         const ref = await this.textModelService.createModelReference(this.uri);
         this.textModel = ref.object;
+        this.textModel.onDidChangeContent(e => {
+            this.props.source = e.model.getText();
+        });
         return ref.object;
     }
 }

package/src/browser/view-model/notebook-cell-output-model.ts

@@ -15,8 +15,8 @@
 // *****************************************************************************
 
 import { Disposable, Emitter } from '@theia/core';
-import { BinaryBuffer } from '@theia/core/lib/common/buffer';
 import { CellOutput, CellOutputItem, isTextStreamMime } from '../../common';
+import { compressOutputItemStreams } from '../notebook-output-utils';
 
 export class NotebookCellOutputModel implements Disposable {
 
@@ -73,10 +73,10 @@ export class NotebookCellOutputModel implements Disposable {
         if (this.outputs.length > 1 && this.outputs.every(item => isTextStreamMime(item.mime))) {
             // Look for the mimes in the items, and keep track of their order.
             // Merge the streams into one output item, per mime type.
-            const mimeOutputs = new Map<string, BinaryBuffer[]>();
+            const mimeOutputs = new Map<string, Uint8Array[]>();
             const mimeTypes: string[] = [];
             this.outputs.forEach(item => {
-                let items: BinaryBuffer[];
+                let items: Uint8Array[];
                 if (mimeOutputs.has(item.mime)) {
                     items = mimeOutputs.get(item.mime)!;
                 } else {
@@ -84,13 +84,14 @@ export class NotebookCellOutputModel implements Disposable {
                     mimeOutputs.set(item.mime, items);
                     mimeTypes.push(item.mime);
                 }
-                items.push(item.data);
+                items.push(item.data.buffer);
             });
             this.outputs.length = 0;
             mimeTypes.forEach(mime => {
+                const compressionResult = compressOutputItemStreams(mimeOutputs.get(mime)!);
                 this.outputs.push({
                     mime,
-                    data: BinaryBuffer.concat(mimeOutputs.get(mime)!)
+                    data: compressionResult.data
                 });
             });
         }