Add Markdown as a default editing option for text cells (#15540)

This commit is contained in:
Cory Rivera
2021-05-21 10:05:55 -07:00
committed by GitHub
parent cc232f195f
commit d582a955dd
5 changed files with 34 additions and 21 deletions

View File

@@ -23,6 +23,7 @@ import * as path from 'vs/base/common/path';
import { URI } from 'vs/base/common/uri'; import { URI } from 'vs/base/common/uri';
import { escape } from 'vs/base/common/strings'; import { escape } from 'vs/base/common/strings';
import { IImageCalloutDialogOptions, ImageCalloutDialog } from 'sql/workbench/contrib/notebook/browser/calloutDialog/imageCalloutDialog'; 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'; export const MARKDOWN_TOOLBAR_SELECTOR: string = 'markdown-toolbar-component';
const linksRegex = /\[(?<text>.+)\]\((?<url>[^ ]+)(?: "(?<title>.+)")?\)/; const linksRegex = /\[(?<text>.+)\]\((?<url>[^ ]+)(?: "(?<title>.+)")?\)/;
@@ -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 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); 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._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.defaultToWYSIWYG ? 'masked-icon split-toggle-on' : 'masked-icon split-toggle-on active', this.splitViewButton, true, true); 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', '', 'masked-icon show-markdown', this.markdownViewButton, false, 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; let taskbar = <HTMLElement>this.mdtoolbar.nativeElement;
this._actionBar = new Taskbar(taskbar); this._actionBar = new Taskbar(taskbar);

View File

@@ -50,7 +50,7 @@ import { NotebookExplorerViewletViewsContribution } from 'sql/workbench/contrib/
import 'vs/css!./media/notebook.contribution'; import 'vs/css!./media/notebook.contribution';
import { isMacintosh } from 'vs/base/common/platform'; import { isMacintosh } from 'vs/base/common/platform';
import { SearchSortOrder } from 'vs/workbench/services/search/common/search'; 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 { IEditorService } from 'vs/workbench/services/editor/common/editorService';
import { NotebookInput } from 'sql/workbench/contrib/notebook/browser/models/notebookInput'; import { NotebookInput } from 'sql/workbench/contrib/notebook/browser/models/notebookInput';
import { INotebookModel } from 'sql/workbench/services/notebook/browser/models/modelInterfaces'; import { INotebookModel } from 'sql/workbench/services/notebook/browser/models/modelInterfaces';
@@ -297,10 +297,16 @@ configurationRegistry.registerConfiguration({
'default': true, 'default': true,
'description': localize('notebook.enableDoubleClickEdit', "Enable double click to edit for text cells in notebooks") 'description': localize('notebook.enableDoubleClickEdit', "Enable double click to edit for text cells in notebooks")
}, },
'notebook.setRichTextViewByDefault': { 'notebook.defaultTextEditMode': {
'type': 'boolean', 'type': 'string',
'default': true, 'enum': [TextCellEditModes.RichText, TextCellEditModes.SplitView, TextCellEditModes.Markdown],
'description': localize('notebook.setRichTextViewByDefault', "Set Rich Text View mode by default for text cells") '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': { 'notebook.saveConnectionName': {
'type': 'boolean', 'type': 'boolean',

View File

@@ -10,7 +10,7 @@ import { URI } from 'vs/base/common/uri';
import { localize } from 'vs/nls'; import { localize } from 'vs/nls';
import * as notebookUtils from 'sql/workbench/services/notebook/browser/models/notebookUtils'; 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 { 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 { ICellModel, IOutputChangedEvent, CellExecutionState, ICellModelOptions, ITableUpdatedEvent, CellEditModes } from 'sql/workbench/services/notebook/browser/models/modelInterfaces';
import { IConnectionManagementService } from 'sql/platform/connection/common/connectionManagement'; import { IConnectionManagementService } from 'sql/platform/connection/common/connectionManagement';
@@ -77,7 +77,7 @@ export class CellModel extends Disposable implements ICellModel {
private _showPreview: boolean = true; private _showPreview: boolean = true;
private _showMarkdown: boolean = false; private _showMarkdown: boolean = false;
private _cellSourceChanged: boolean = false; private _cellSourceChanged: boolean = false;
private _defaultToWYSIWYG: boolean; private _defaultTextEditMode: string;
private _isParameter: boolean; private _isParameter: boolean;
private _onParameterStateChanged = new Emitter<boolean>(); private _onParameterStateChanged = new Emitter<boolean>();
private _isInjectedParameter: boolean; private _isInjectedParameter: boolean;
@@ -216,7 +216,8 @@ export class CellModel extends Disposable implements ICellModel {
public set isEditMode(isEditMode: boolean) { public set isEditMode(isEditMode: boolean) {
this._isEditMode = isEditMode; this._isEditMode = isEditMode;
if (this._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); this._onCellModeChanged.fire(this._isEditMode);
// Note: this does not require a notebook update as it does not change overall state // 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); this._onCellMarkdownChanged.fire(this._showMarkdown);
} }
public get defaultToWYSIWYG(): boolean { public get defaultTextEditMode(): string {
return this._defaultToWYSIWYG; return this._defaultTextEditMode;
} }
public get cellSourceChanged(): boolean { public get cellSourceChanged(): boolean {
@@ -1055,18 +1056,16 @@ export class CellModel extends Disposable implements ICellModel {
private populatePropertiesFromSettings() { private populatePropertiesFromSettings() {
if (this._configurationService) { if (this._configurationService) {
const enableWYSIWYGByDefaultKey = 'notebook.setRichTextViewByDefault'; const defaultTextModeKey = 'notebook.defaultTextEditMode';
this._defaultToWYSIWYG = this._configurationService.getValue(enableWYSIWYGByDefaultKey); this._defaultTextEditMode = this._configurationService.getValue(defaultTextModeKey);
if (!this._defaultToWYSIWYG) {
this.showMarkdown = true;
}
const allowADSCommandsKey = 'notebook.allowAzureDataStudioCommands'; const allowADSCommandsKey = 'notebook.allowAzureDataStudioCommands';
this._isCommandExecutionSettingEnabled = this._configurationService.getValue(allowADSCommandsKey); this._isCommandExecutionSettingEnabled = this._configurationService.getValue(allowADSCommandsKey);
this._register(this._configurationService.onDidChangeConfiguration(e => { this._register(this._configurationService.onDidChangeConfiguration(e => {
if (e.affectsConfiguration(allowADSCommandsKey)) { if (e.affectsConfiguration(allowADSCommandsKey)) {
this._isCommandExecutionSettingEnabled = this._configurationService.getValue(allowADSCommandsKey); this._isCommandExecutionSettingEnabled = this._configurationService.getValue(allowADSCommandsKey);
} else if (e.affectsConfiguration(enableWYSIWYGByDefaultKey)) { } else if (e.affectsConfiguration(defaultTextModeKey)) {
this._defaultToWYSIWYG = this._configurationService.getValue(enableWYSIWYGByDefaultKey); this._defaultTextEditMode = this._configurationService.getValue(defaultTextModeKey);
} }
})); }));
} }

View File

@@ -527,7 +527,7 @@ export interface ICellModel {
isEditMode: boolean; isEditMode: boolean;
showPreview: boolean; showPreview: boolean;
showMarkdown: boolean; showMarkdown: boolean;
defaultToWYSIWYG: boolean; defaultTextEditMode: string;
readonly onCellPreviewModeChanged: Event<boolean>; readonly onCellPreviewModeChanged: Event<boolean>;
readonly onCellMarkdownModeChanged: Event<boolean>; readonly onCellMarkdownModeChanged: Event<boolean>;
sendChangeToNotebook(change: NotebookChangeType): void; sendChangeToNotebook(change: NotebookChangeType): void;

View File

@@ -3,6 +3,7 @@
* Licensed under the Source EULA. See License.txt in the project root for license information. * 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'; 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 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');
}