EPIC Goal

This Epic is "Phase 0" for an installation and configuration UI in the Marketplace.

As first step we want show the user a UI where they could edit (without saving) the dynamic plugin configuration. They should have an option to see the default configuration or select other predefined examples from the Marketplace Plugin and Package YAML.

From https://github.com/redhat-developer/rhdh-plugins/blob/main/workspaces/marketplace/examples/packages/tekton.yaml#L29-L43

  appConfigExamples:
    - title: Default configuration
      content:
        dynamicPlugins:
          frontend:
            backstage-community.plugin-tekton:
              ...

Background/Feature Origin

As the marketplace plugin is available, we want to continue to add new features to make it even easier for customers to add/test plugins and other integrations to RHDH.

Why is this important?

This will allow customers to get to production faster and quicker POCs.

User Scenarios

1. An admin want install a plugin and need to know the dynamic plugin path
2. An admin wants understand the default configuration of a plugin

Dependencies (internal and external)

Figma Design: https://www.figma.com/design/E6C9X3OSVzlWkW7ZsbxN7s/Administration?node-id=6479-4823&t=aqL8oNO7j2ov4kWA-0

Acceptance Criteria

1. The Marketplace Frontend should have an installation page with an text editor (html textarea is fine for the first version, see stretch goals below)
2. The installation markdown should be shown close to text editor
   • in the current designs on the right side
   • it should work on smaller screens as well (maybe by using a tabs to switch between editor and documentation? To be discussed with UXD/shirshbe@redhat.com)
3. The text editor content should be automatically populated with some data from the Plugin and Package(s) YAMLs. See examples below.
4. There should be an option to disable a plugin. (This option could just apply the disabled: true flag to the yaml.)
5. There should be an option to inspect or apply (or both) other "app config examples"
   • Exact design should be discussed with UXD/shirshbe@redhat.com

Non goals

1. Start an installation from the UI in this "Phase 0". Install button should be disabled with a tooltip that explain that this feature is coming soon.

Stretch goals

1. Usage of a full YAML editor like Monaco editor. In the OpenShift Console we used https://github.com/react-monaco-editor/react-monaco-editor