Skip to content

[Feat]: As a VS Code user, I want the extension's core operations in the Command Palette so that I can create and export maps without digging through menus #63

Description

@emaarco

Summary

As a VS Code user of the Wardley Mapping Modeler, I want the extension's core operations —
creating a map and exporting the current map — available as first-class Command Palette
commands under the existing shared "Wardley" category, so that I can reach them from
Cmd/Ctrl+Shift+P without knowing about the in-canvas toolbar menu.

Motivation

The Command Palette is the primary discovery surface in VS Code. Today only the create operations
are palette commands; the export operations live solely inside the webview's canvas toolbar
menu
, so a new user who wants an SVG/PNG has no way to discover them from the palette, and they
can't be bound to a keyboard shortcut. Consolidating the core operations under the existing
Wardley category makes the extension self-describing and keyboard-friendly.

What exists today — declared in apps/vscode/package.jsoncontributes.commands, each with
category: "Wardley". There is no contributes.menus.commandPalette restriction, so all three are
already reachable from the palette:

Command id Title In palette? In file/newFile?
wardley.newMap New Empty Map
wardley.newMapFromExample New Map from Example
wardley.newPngMap New Empty Map (embedded PNG)

What's missing — core operations that are NOT exposed as commands:

Operation Today Proposed command id
Export current map as SVG webview menu only wardley.exportSvg
Export current map as PNG webview menu only wardley.exportPng
(secondary) New Map from Example in File ▸ New File… palette only add to file/newFile menu

Proposed Solution

  1. Add two new commands under the shared Wardley category:

    • wardley.exportSvg"Export as SVG"
    • wardley.exportPng"Export as PNG"
  2. Reuse existing logic, don't duplicate. The write-to-disk half already exists in
    apps/vscode/src/exportImage.ts (exportImageToFile), and the webview already emits an export
    protocol message with the rendered data (apps/vscode/src/protocol.ts, handled in the editor
    providers WardleyEditorProvider.ts / WardleyPngEditorProvider.ts). The new commands should:

    • resolve the active Wardley editor,
    • send a new host → webview "request export" message so the webview produces the SVG text /
      base64 PNG (the same data its exportSvg() / exportPng() in src/webview/main.ts already
      produce for the in-canvas menu) — mirroring the existing requestPng round-trip used for PNG
      save,
    • pipe that into the existing exportImageToFile().

    No new export/render code — just a command entry point into the path that already runs.

  3. Gate the export commands so they only appear when a map editor is focused, via
    contributes.menus.commandPalette with a when clause (e.g.
    activeCustomEditorId == 'wardley.mapEditor' || activeCustomEditorId == 'wardley.pngMapEditor'),
    so the palette isn't cluttered when no map is open. (Create commands stay ungated. Commands in
    contributes.commands get implicit onCommand activation on the engine ^1.96.)

  4. (Secondary) Add wardley.newMapFromExample to the file/newFile menu for parity with the
    other two create commands.

  5. Keep category: "Wardley" on every command so they group together in the palette.

Acceptance Criteria

  • Wardley: Export as SVG and Wardley: Export as PNG appear in the Command Palette when a
    .wmap / .owm / .wmap.png / .owm.png editor is focused, and are hidden otherwise.
  • Running either command produces the same file (with the embedded DSL) as the existing in-canvas
    export menu, via exportImageToFile — no duplicated export/render logic.
  • All create + export commands share the Wardley category in the palette.
  • New Map from Example is reachable from File ▸ New File… alongside the other create commands.
  • npm run lint, npm test, and npm run typecheck stay green.

Alternatives Considered

  • Leave export in the canvas menu only. Rejected: not discoverable from the palette and can't be
    keybound.
  • A single Export… command with a Quick Pick for SVG/PNG. Viable and arguably cleaner; noted as
    an option, but two explicit commands are more directly discoverable and individually keybindable.
  • Also add "Open As" convert commands (Open as Editable Text / Open as Embedded PNG via
    vscode.openWith) and an "Open Map…" picker. Deferred: VS Code's built-in Reopen Editor
    With…
    already converts between the editors, and file association already opens maps.
  • Duplicate the export logic in a command handler. Rejected: violates reuse — exportImageToFile
    plus the existing export protocol message should stay the single source of truth.

Note: the repo has no workspace/scope label (only enhancement, documentation, bug, refactor,
…), so this issue uses enhancement only.

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions