From d582a955dd8b4744f42533ecbc992989b25467de Mon Sep 17 00:00:00 2001 From: Cory Rivera Date: Fri, 21 May 2021 10:05:55 -0700 Subject: [PATCH] Add Markdown as a default editing option for text cells (#15540) --- .../cellViews/markdownToolbar.component.ts | 7 +++--- .../notebook/browser/notebook.contribution.ts | 16 +++++++++---- .../services/notebook/browser/models/cell.ts | 23 +++++++++---------- .../browser/models/modelInterfaces.ts | 2 +- .../services/notebook/common/contracts.ts | 7 ++++++ 5 files changed, 34 insertions(+), 21 deletions(-) diff --git a/src/sql/workbench/contrib/notebook/browser/cellViews/markdownToolbar.component.ts b/src/sql/workbench/contrib/notebook/browser/cellViews/markdownToolbar.component.ts index e9a549ab7c..52b9b4bef1 100644 --- a/src/sql/workbench/contrib/notebook/browser/cellViews/markdownToolbar.component.ts +++ b/src/sql/workbench/contrib/notebook/browser/cellViews/markdownToolbar.component.ts @@ -23,6 +23,7 @@ import * as path from 'vs/base/common/path'; import { URI } from 'vs/base/common/uri'; import { escape } from 'vs/base/common/strings'; import { IImageCalloutDialogOptions, ImageCalloutDialog } from 'sql/workbench/contrib/notebook/browser/calloutDialog/imageCalloutDialog'; +import { TextCellEditModes } from 'sql/workbench/services/notebook/common/contracts'; export const MARKDOWN_TOOLBAR_SELECTOR: string = 'markdown-toolbar-component'; const linksRegex = /\[(?.+)\]\((?[^ ]+)(?: "(?.+)")?\)/; @@ -138,9 +139,9 @@ export class MarkdownToolbarComponent extends AngularDisposable { let heading3 = this._instantiationService.createInstance(TransformMarkdownAction, 'notebook.heading3', this.optionHeading3, 'heading 3', this.optionHeading3, this.cellModel, MarkdownButtonType.HEADING3); let paragraph = this._instantiationService.createInstance(TransformMarkdownAction, 'notebook.paragraph', this.optionParagraph, 'paragraph', this.optionParagraph, this.cellModel, MarkdownButtonType.PARAGRAPH); - this._toggleTextViewAction = this._instantiationService.createInstance(ToggleViewAction, 'notebook.toggleTextView', '', this.cellModel.defaultToWYSIWYG ? 'masked-icon show-text active' : 'masked-icon show-text', this.richTextViewButton, true, false); - this._toggleSplitViewAction = this._instantiationService.createInstance(ToggleViewAction, 'notebook.toggleSplitView', '', this.cellModel.defaultToWYSIWYG ? 'masked-icon split-toggle-on' : 'masked-icon split-toggle-on active', this.splitViewButton, true, true); - this._toggleMarkdownViewAction = this._instantiationService.createInstance(ToggleViewAction, 'notebook.toggleMarkdownView', '', 'masked-icon show-markdown', this.markdownViewButton, false, true); + this._toggleTextViewAction = this._instantiationService.createInstance(ToggleViewAction, 'notebook.toggleTextView', '', this.cellModel.defaultTextEditMode === TextCellEditModes.RichText ? 'masked-icon show-text active' : 'masked-icon show-text', this.richTextViewButton, true, false); + this._toggleSplitViewAction = this._instantiationService.createInstance(ToggleViewAction, 'notebook.toggleSplitView', '', this.cellModel.defaultTextEditMode === TextCellEditModes.SplitView ? 'masked-icon split-toggle-on active' : 'masked-icon split-toggle-on', this.splitViewButton, true, true); + this._toggleMarkdownViewAction = this._instantiationService.createInstance(ToggleViewAction, 'notebook.toggleMarkdownView', '', this.cellModel.defaultTextEditMode === TextCellEditModes.Markdown ? 'masked-icon show-markdown active' : 'masked-icon show-markdown', this.markdownViewButton, false, true); let taskbar = <HTMLElement>this.mdtoolbar.nativeElement; this._actionBar = new Taskbar(taskbar); diff --git a/src/sql/workbench/contrib/notebook/browser/notebook.contribution.ts b/src/sql/workbench/contrib/notebook/browser/notebook.contribution.ts index a159bdadce..d0f63a0d49 100644 --- a/src/sql/workbench/contrib/notebook/browser/notebook.contribution.ts +++ b/src/sql/workbench/contrib/notebook/browser/notebook.contribution.ts @@ -50,7 +50,7 @@ import { NotebookExplorerViewletViewsContribution } from 'sql/workbench/contrib/ import 'vs/css!./media/notebook.contribution'; import { isMacintosh } from 'vs/base/common/platform'; import { SearchSortOrder } from 'vs/workbench/services/search/common/search'; -import { ImageMimeTypes } from 'sql/workbench/services/notebook/common/contracts'; +import { ImageMimeTypes, TextCellEditModes } from 'sql/workbench/services/notebook/common/contracts'; import { IEditorService } from 'vs/workbench/services/editor/common/editorService'; import { NotebookInput } from 'sql/workbench/contrib/notebook/browser/models/notebookInput'; import { INotebookModel } from 'sql/workbench/services/notebook/browser/models/modelInterfaces'; @@ -297,10 +297,16 @@ configurationRegistry.registerConfiguration({ 'default': true, 'description': localize('notebook.enableDoubleClickEdit', "Enable double click to edit for text cells in notebooks") }, - 'notebook.setRichTextViewByDefault': { - 'type': 'boolean', - 'default': true, - 'description': localize('notebook.setRichTextViewByDefault', "Set Rich Text View mode by default for text cells") + 'notebook.defaultTextEditMode': { + 'type': 'string', + 'enum': [TextCellEditModes.RichText, TextCellEditModes.SplitView, TextCellEditModes.Markdown], + 'enumDescriptions': [ + localize('notebook.richTextModeDescription', 'Text is displayed as Rich Text (also known as WYSIWYG).'), + localize('notebook.splitViewModeDescription', 'Markdown is displayed on the left, with a preview of the rendered text on the right.'), + localize('notebook.markdownModeDescription', 'Text is displayed as Markdown.') + ], + 'default': TextCellEditModes.RichText, + 'description': localize('notebook.defaultTextEditMode', "The default editing mode used for text cells") }, 'notebook.saveConnectionName': { 'type': 'boolean', diff --git a/src/sql/workbench/services/notebook/browser/models/cell.ts b/src/sql/workbench/services/notebook/browser/models/cell.ts index 8a2e723541..15bef2eee1 100644 --- a/src/sql/workbench/services/notebook/browser/models/cell.ts +++ b/src/sql/workbench/services/notebook/browser/models/cell.ts @@ -10,7 +10,7 @@ import { URI } from 'vs/base/common/uri'; import { localize } from 'vs/nls'; import * as notebookUtils from 'sql/workbench/services/notebook/browser/models/notebookUtils'; -import { CellTypes, CellType, NotebookChangeType } from 'sql/workbench/services/notebook/common/contracts'; +import { CellTypes, CellType, NotebookChangeType, TextCellEditModes } from 'sql/workbench/services/notebook/common/contracts'; import { NotebookModel } from 'sql/workbench/services/notebook/browser/models/notebookModel'; import { ICellModel, IOutputChangedEvent, CellExecutionState, ICellModelOptions, ITableUpdatedEvent, CellEditModes } from 'sql/workbench/services/notebook/browser/models/modelInterfaces'; import { IConnectionManagementService } from 'sql/platform/connection/common/connectionManagement'; @@ -77,7 +77,7 @@ export class CellModel extends Disposable implements ICellModel { private _showPreview: boolean = true; private _showMarkdown: boolean = false; private _cellSourceChanged: boolean = false; - private _defaultToWYSIWYG: boolean; + private _defaultTextEditMode: string; private _isParameter: boolean; private _onParameterStateChanged = new Emitter<boolean>(); private _isInjectedParameter: boolean; @@ -216,7 +216,8 @@ export class CellModel extends Disposable implements ICellModel { public set isEditMode(isEditMode: boolean) { this._isEditMode = isEditMode; if (this._isEditMode) { - this.showMarkdown = !this._defaultToWYSIWYG; + this.showPreview = this._defaultTextEditMode !== TextCellEditModes.Markdown; + this.showMarkdown = this._defaultTextEditMode !== TextCellEditModes.RichText; } this._onCellModeChanged.fire(this._isEditMode); // Note: this does not require a notebook update as it does not change overall state @@ -383,8 +384,8 @@ export class CellModel extends Disposable implements ICellModel { this._onCellMarkdownChanged.fire(this._showMarkdown); } - public get defaultToWYSIWYG(): boolean { - return this._defaultToWYSIWYG; + public get defaultTextEditMode(): string { + return this._defaultTextEditMode; } public get cellSourceChanged(): boolean { @@ -1055,18 +1056,16 @@ export class CellModel extends Disposable implements ICellModel { private populatePropertiesFromSettings() { if (this._configurationService) { - const enableWYSIWYGByDefaultKey = 'notebook.setRichTextViewByDefault'; - this._defaultToWYSIWYG = this._configurationService.getValue(enableWYSIWYGByDefaultKey); - if (!this._defaultToWYSIWYG) { - this.showMarkdown = true; - } + const defaultTextModeKey = 'notebook.defaultTextEditMode'; + this._defaultTextEditMode = this._configurationService.getValue(defaultTextModeKey); + const allowADSCommandsKey = 'notebook.allowAzureDataStudioCommands'; this._isCommandExecutionSettingEnabled = this._configurationService.getValue(allowADSCommandsKey); this._register(this._configurationService.onDidChangeConfiguration(e => { if (e.affectsConfiguration(allowADSCommandsKey)) { this._isCommandExecutionSettingEnabled = this._configurationService.getValue(allowADSCommandsKey); - } else if (e.affectsConfiguration(enableWYSIWYGByDefaultKey)) { - this._defaultToWYSIWYG = this._configurationService.getValue(enableWYSIWYGByDefaultKey); + } else if (e.affectsConfiguration(defaultTextModeKey)) { + this._defaultTextEditMode = this._configurationService.getValue(defaultTextModeKey); } })); } diff --git a/src/sql/workbench/services/notebook/browser/models/modelInterfaces.ts b/src/sql/workbench/services/notebook/browser/models/modelInterfaces.ts index 55aeaec619..7f40be2997 100644 --- a/src/sql/workbench/services/notebook/browser/models/modelInterfaces.ts +++ b/src/sql/workbench/services/notebook/browser/models/modelInterfaces.ts @@ -527,7 +527,7 @@ export interface ICellModel { isEditMode: boolean; showPreview: boolean; showMarkdown: boolean; - defaultToWYSIWYG: boolean; + defaultTextEditMode: string; readonly onCellPreviewModeChanged: Event<boolean>; readonly onCellMarkdownModeChanged: Event<boolean>; sendChangeToNotebook(change: NotebookChangeType): void; diff --git a/src/sql/workbench/services/notebook/common/contracts.ts b/src/sql/workbench/services/notebook/common/contracts.ts index a01a8b3042..a2519b9a98 100644 --- a/src/sql/workbench/services/notebook/common/contracts.ts +++ b/src/sql/workbench/services/notebook/common/contracts.ts @@ -3,6 +3,7 @@ * Licensed under the Source EULA. See License.txt in the project root for license information. *--------------------------------------------------------------------------------------------*/ +import { localize } from 'vs/nls'; export type CellType = 'code' | 'markdown' | 'raw'; @@ -51,3 +52,9 @@ export enum NotebookChangeType { } export const ImageMimeTypes = ['image/bmp', 'image/png', 'image/jpeg', 'image/gif']; + +export class TextCellEditModes { + public static readonly RichText = localize('notebook.richTextEditMode', 'Rich Text'); + public static readonly SplitView = localize('notebook.splitViewEditMode', 'Split View'); + public static readonly Markdown = localize('notebook.markdownEditMode', 'Markdown'); +}