positron icon indicating copy to clipboard operation
positron copied to clipboard

Epic: New Customizable Toolbar for Editors

Open petetronic opened this issue 2 years ago • 4 comments

We want to add a new customizable toolbar or "action bar" to an Editor, likely best positioned to the right on the same line as the breadcrumb below the tabs.

Given extensions will have requirements to add interactive controls, modify visual state and register event handlers, we expect this will require a new programmatic API (beyond simple contributions that you may see in package.json).

An early use of this capability will be to improve the user experience in Quarto to expose common preview and rendering commands to the end user, similar to the easy access provided for these functions in RStudio today.

The initial set of controls will need to include:

  • A button, with optional icon and label text.
  • A button that reveals a dropdown menu.
  • A split button that toggles labels to match two possible modes.
  • A checkbox with label text.

Extensions may also need to customize the state of these controls based on information in the file being edited.

petetronic avatar Jan 18 '24 21:01 petetronic

Draft UI treatments that demonstrate new controls, each control should be broken down into individual issues and their behavior and look and feel needs to be finalized.

image (23)

Draft UI treatment of a Quarto extension example: image (22)

petetronic avatar Jan 18 '24 22:01 petetronic

For now we'll leave the existing VSCode menu editor/title/run contribution as is, and focus on the new capabilities we require first.

petetronic avatar Jan 18 '24 22:01 petetronic

This can be broken down into a few different areas, which I can create issues for

New editor menu action item types (UI components):

  • Button with Icon and label (currently only have icon without label)
    • This may also be the main menu item of a drop-down menu
  • Checkbox (toggle item) with label
  • Split button (toggle item) with built-in label

New extension API for adding the above action item types from an extension

Creating a new location for these editor action items, within the editor breadcrumbs bar

jgutman avatar Feb 26 '24 18:02 jgutman

That's look amazing. I hope the feature will be soon considered to add for Positron

ntluong95 avatar Jul 08 '24 21:07 ntluong95

We'll tackle Quarto's use of this new capability outside of this Epic, e.g. https://github.com/posit-dev/positron/issues/3923

petetronic avatar Feb 05 '25 23:02 petetronic

Verified Fixed

Positron Version(s) : 2025.03.0 (Universal) build 4 OS Version(s) : MacOS

Test scenario(s)

Tested the following editor action bar behaviors across multiple file types:

  • Preview (HTML)
  • Split Editor
  • Open in New Window
  • Open (Git) Changes
  • Open Viewer
  • Toggling Line Numbers
  • Toggling Bread Crumbs
  • Summary Position (Left vs Right)
  • Open as Plain Text File

Link(s) to test cases run or created:

Added: https://github.com/posit-dev/positron/blob/main/test/e2e/tests/editor-action-bar/data-files.test.ts Added: https://github.com/posit-dev/positron/blob/main/test/e2e/tests/editor-action-bar/document-files.test.ts Updated: https://github.com/posit-dev/positron/blob/main/test/e2e/tests/data-explorer/data-explorer-headless.test.ts

midleman avatar Feb 10 '25 18:02 midleman