monaco-editor: web ide app worksapce/symbol Reuse document/symbol s…

[vincentLiuxiang]

monaco-editor don't support workspace/symbol

Now, we are developing an web ide base on monaco-editor,
and we want to realize the workspace/symbol feature which can make multi files switch(cmd + p), just like:

However, monaco-editor only support document/symbol (cmd + shift + O).

We want to reuse the document/symbol ui Widget to realize workspace/symbol feature, but we meet an problew:

// class SymbolEntry extends QuickOpenEntryGroup {
// change to 
export class SymbolEntry extends QuickOpenEntryGroup {
	private name: string;
	private type: string;
        ...

        // selected action
	public run(mode: Mode, context: IContext): boolean {
		if (mode === Mode.OPEN) {
			return this.runOpen(context);
		}

		return this.runPreview();
	}

SymbolEntry was not export in quickOutline.ts, that I cannot change the action after select an item.

if we export SymbolEntry, I can overwrite the SymbolEntry.prototype.run method in my code, like:

```js
import { QuickOutlineAction, SymbolEntry } from 'monaco-editor/esm/vs/editor/standalone/browser/quickOpen/quickOutline';

editor.addCommand(monaco.KeyMod.CtrlCmd | monaco.KeyCode.KEY_P, () => {
SymbolEntry.prototype.customType = 'workspace';
SymbolEntry.prototype.webideRun = SymbolEntry.prototype.run;
SymbolEntry.prototype.run = function(...args) {
if (this.customType !== 'workspace') {
return this.webideRun(...args);
}
this.customType = '';
// do something for workspace/symbol
}
(new QuickOutlineAction()).run('', eiditor);
})

[vincentLiuxiang]

now, I can add a command ctrl/cmd + p, to support workspace symbol:

my code:

workspace.js

import { QuickOutlineAction, SymbolEntry } from 'monaco-editor/esm/vs/editor/standalone/browser/quickOpen/quickOutline';
import { Mode } from 'monaco-editor/esm/vs/base/parts/quickopen/common/quickOpen';

export class WorkspaceQuickOutlineAction extends QuickOutlineAction {
  constructor() {
    super();
  }

  // overwrite
  symbolEntry(...args) {
    return new WorkspaceSymbolEntry(...args);
  }
}

export class WorkspaceSymbolEntry extends SymbolEntry {
  constructor(...args) {
    super(...args)
  }
  
  // overwrite
  run(mode, context) {
    if (mode !== Mode.OPEN)  return;
    // to do
    // workspace symbol
  }
}

lsp.js

import { QuickOpenEditorWidget } from 'monaco-editor/esm/vs/editor/standalone/browser/quickOpen/quickOpenEditorWidget';
import { QuickOpenController } from 'monaco-editor/esm/vs/editor/standalone/browser/quickOpen/editorQuickOpen';
import { QuickOpenModel } from 'monaco-editor/esm/vs/base/parts/quickopen/browser/quickOpenModel';
import { WorkspaceQuickOutlineAction } from './workspace'

...

function request(editor, value) {
  return this.getConnection(editor.model)
      .sendRequest('workspace/symbol',
        convert.MonacoToLsp.workspaceSymbol(value))
      .then(symbol => convert.LspToMonaco.documentSymbol(symbol, editor.model.uri));
}

editor.addCommand(monaco.KeyMod.CtrlCmd | monaco.KeyCode.KEY_P, () => {
  const { themeService, lastKnownEditorSelection } = QuickOpenController.get(editor);
  this.widget = new QuickOpenEditorWidget(editor,
    () => {},
    () => {},
    (value) => {
        clearTimeout(this._timer);
        this._timer = setTimeout(() => {
          let promise = Promise.resolve([]);
          if (value) promise = request(this.editor, value);
          const workspaceQuickOutlineAction = new WorkspaceQuickOutlineAction();
          promise.then(result => this.widget.setInput(
            new QuickOpenModel(result),
            getAutoFocus(value)
          ));
        }, this.delay);
    },
    {
      inputAriaLabel: 'workspace symbol'
    },
    themeService
  );
  this.widget.show('');
});

then, I can reuse the document/symbol widget ui, and I can switch files in WorkspaceSymbolEntry

  // overwrite
  run(mode, context) {
    if (mode !== Mode.OPEN)  return;
    // to do
    // workspace symbol
  }