RHIDP-7560 - Install and configure plugins from Extensions page

artifacts/rhdh-plugins-reference/quickstart/quickstart-plugin-admin.adoc

@@ -0,0 +1,55 @@
+[id="installing-configuring-quickstart-plugin"]
+= Installing and configuring the Quickstart plugin
+
+The Quickstart plugin provides a guided onboarding experience for new users of {product}. It displays a customizable drawer interface with interactive quickstart steps that help users get familiar with the platform.
+
+== Installation
+The Quickstart plugin is pre-loaded in {product-short} with basic configuration properties, and enabled by default. To disable it, set the disabled property to `true` as follows:
+
+[source,yaml]
+----
+global:
+  dynamic:
+    includes:
+      - dynamic-plugins.default.yaml
+    plugins:
+      - package: ./dynamic-plugins/dist/red-hat-developer-hub-backstage-plugin-quickstart
+        disabled: true
+----
+
+== Configuration
+Configure quickstart items in your `app-config.yaml`:
+
+[source,yaml]
+----
+app:
+  quickstart:
+    - title: 'Welcome to Developer Hub'
+      description: 'Learn the basics of navigating the Developer Hub interface'
+      icon: 'home'
+      cta:
+        text: 'Get Started'
+        link: '/catalog'
+    - title: 'Create Your First Component'
+      description: 'Follow our guide to register your first software component'
+      icon: 'code'
+      cta:
+        text: 'Create Component'
+        link: '/catalog-import'
+    - title: 'Explore Templates'
+      description: 'Discover available software templates to bootstrap new projects'
+      icon: 'template'
+      cta:
+        text: 'Browse Templates'
+        link: '/create'
+----
+
+== Configuration Schema
+Each quickstart item supports the following properties:
+
+* `title` (required): The display title for the quickstart step
+* `description` (required): A brief description of what the step covers
+* `icon` (optional): Icon identifier (supports Material UI icons)
+* `cta` (optional): Call-to-action object with:
+* `text`: Button text
+* `link`: Target URL or route

artifacts/rhdh-plugins-reference/quickstart/quickstart-plugin-user.adoc

@@ -0,0 +1,72 @@
+[id="using-quickstart-plugin"]
+= Using the Quickstart plugin
+
+The Quickstart plugin provides a guided onboarding experience for new users of {product}. It displays a customizable drawer interface with interactive quickstart steps that help users get familiar with the platform.
+
+== Features
+Interactive Drawer Interface:: Displays quickstart steps in a slide-out drawer.
+Progress Tracking:: Tracks completion status of individual steps with persistent storage.
+Configurable Content:: Define custom quickstart items through app configuration.
+Visual Progress Indicator:: Shows overall completion progress with a progress bar.
+Call-to-Action Support:: Each step can include clickable action buttons.
+
+.Procedure
+. Open the Quickstart drawer
+.. Navigate to the **top right corner** of the {product-short} interface.
+.. Click the icon labeled **“Quick start”** (represented by a question mark icon in the top menu).
+.. The drawer panel on the **right-hand side** of the screen slides open.
+
+. Review the available Quickstart items
++
+In the drawer, you will see a list of onboarding tasks, including:
+
+Set up authentication::
+Configure secure login credentials to protect your account.  
+
+Configure RBAC::  
+  Set up Role-Based Access Control for your team.
+
+Configure Git::  
+  Connect your Git repositories for source control and automation.
+
+Manage plugins::  
+  Enable or disable additional functionality in the Hub.
++
+Each item may be expandable and interactive.
+
+. Track Your Progress
+* Each Quick Start item includes a **status indicator**, such as:
+  ** _Not started_
+  ** _In progress_
+  ** _Completed_
++
+As you complete each step or task, your progress is automatically tracked.
+
+[NOTE]
+====
+Quickstart items are **configurable**, meaning the content and order can vary depending on your Red Hat Developer Hub instance.
+
+You can **revisit** or **reset** tasks at any time for review or team onboarding.
+
+You can hide the Quickstart drawer by clicking *Hide*
+====
+
+////
+= Using the Context Hook
+Access quickstart drawer functionality in your components:
+
+[source,yaml]
+----
+import { useQuickstartDrawerContext } from '@red-hat-developer-hub/backstage-plugin-quickstart';
+
+const MyComponent = () => {
+  const { openDrawer, closeDrawer, isDrawerOpen } =
+    useQuickstartDrawerContext();
+
+  return <button onClick={openDrawer}>Open Quickstart Guide</button>;
+};
+----
+////
+
+= Progress persistence
+The plugin automatically saves progress, so users can continue where they left off even after refreshing the page or returning later.

assemblies/assembly-configuring-the-quickstarts.adoc

@@ -0,0 +1,10 @@
+:_mod-docs-content-type: ASSEMBLY
+:context: customizing-the-quickstarts
+[id="{context}"]
+= Customizing the Quickstart plugin
+
+include::modules/configuring-the-quickstarts/con-about-quickstarts.adoc[leveloffset=+1]
+
+include::modules/configuring-the-quickstarts/proc-customize-rhdh-quickstart.adoc[leveloffset=+1]
+
+include::modules/configuring-the-quickstarts/proc-starting-and-completing-modules-in-quickstarts.adoc[leveloffset=+1]

assemblies/dynamic-plugins/assembly-configuring-rhdh-plugins.adoc

@@ -16,6 +16,9 @@ include::../../artifacts/rhdh-plugins-reference/keycloak/keycloak-plugin-admin.a
 // Nexus
 include::../../artifacts/rhdh-plugins-reference/nexus-repository-manager/nexus-repository-manager-plugin-admin.adoc[leveloffset=+1]
 
+// Quick start
+include::../../artifacts/rhdh-plugins-reference/quickstart/quickstart-plugin-admin.adoc[leveloffset=+1]
+
 // Tekton
 include::../../artifacts/rhdh-plugins-reference/tekton/tekton-plugin-admin.adoc[leveloffset=+1]
 

assemblies/dynamic-plugins/assembly-extensions-plugins.adoc

@@ -32,12 +32,44 @@ include::../modules/dynamic-plugins/con-catalog-searching-and-filtering.adoc[lev
 // Viewing a plugin - screenshots added post 1.5 GA, so this section is no longer necessary
 // include::../modules/dynamic-plugins/ref-catalog-plugin.adoc[leveloffset=+2]
 
-// Installing a plugin
-include::../modules/dynamic-plugins/proc-extensions-installing.adoc[leveloffset=+1]
-
 // Disabling Extensions 
 include::../modules/dynamic-plugins/proc-extensions-disabling.adoc[leveloffset=+1]
 
+// START RHDH 1.7.0
+// ==========
+// Managing plugins installation by using Extensions
+include::../modules/dynamic-plugins/con-extensions-managing-plugins.adoc[leveloffset=+1]
+
+// Configuring an RBAC role to manage Extensions 
+include::../modules/dynamic-plugins/proc-extensions-configuring-rbac-role.adoc[leveloffset=+2]
+
+// Enabling plugins installation by using Extensions
+include::../modules/dynamic-plugins/proc-extensions-enabling-plugins-installation.adoc[leveloffset=+2]
+
+// Installing plugins by using Extensions
+include::../modules/dynamic-plugins/proc-extensions-installing-plugins.adoc[leveloffset=+2]
+
+// Configuring plugins by using Extensions
+include::../modules/dynamic-plugins/proc-extensions-configuring-plugins.adoc[leveloffset=+2]
+
+// Troubleshooting plugins installation by using Extensions [Stretch]
+// include::../modules/dynamic-plugins/con-extensions-troubleshooting-plugins-installation.adoc[leveloffset=+1]
+// ==========
+
+// Enabling plugins installation by using Extensions
+// include::../modules/dynamic-plugins/proc-extensions-enabling.adoc[leveloffset=+1]
+
+// Managing plugins [TBC]
+//include::../modules/dynamic-plugins/proc-extensions-managing.adoc[leveloffset=+1]
+
+// Installing a plugin [TBC]
+//include::../modules/dynamic-plugins/proc-extensions-installing.adoc[leveloffset=+1]
+
+// END RHDH 1.7.0
+
+// Operator installation by using plugin extension
+//include::../modules/dynamic-plugins/proc-operator-installing-a-plugin-using-extensions.adoc[leveloffset=+1]
+
 // Managing the extensions plugin entries - For 1.6+
 //include::../modules/dynamic-plugins/proc-extensions-managing.adoc[leveloffset=+1]
 

assemblies/dynamic-plugins/assembly-using-rhdh-plugins.adoc

@@ -16,6 +16,9 @@ include::../../artifacts/rhdh-plugins-reference/keycloak/keycloak-plugin-user.ad
 // Nexus
 include::../../artifacts/rhdh-plugins-reference/nexus-repository-manager/nexus-repository-manager-plugin-user.adoc[leveloffset=+1]
 
+// Quickstart
+include::../../artifacts/rhdh-plugins-reference/quickstart/quickstart-plugin-user.adoc[leveloffset=+1]
+
 // Tekton
 include::../../artifacts/rhdh-plugins-reference/tekton/tekton-plugin-user.adoc[leveloffset=+1]
 

modules/configuring-the-quickstarts/con-about-quickstarts.adoc

@@ -0,0 +1,13 @@
+:_mod-docs-content-type: CONCEPT
+
+[id="about-quickstarts_{context}"]
+= About Quickstarts
+
+The Quickstart plugin provides a guided onboarding experience for new users of {product}. It displays a customizable drawer interface with interactive quickstart steps that help users get familiar with the platform.
+
+The Quickstart plugin is enabled by default and includes the following components:
+
+Set up authentication:: Set up secure login credentials to protect your account from unauthorized access.
+Configure RBAC:: Assign roles and permissions to control who can view, create, or edit resources, ensuring secure and efficient collaboration.
+Configure Git:: Connect your Git providers, such as GitHub to manage code, automate workflows, and integrate with platform features.
+Manage plugins:: Browse and install extensions to add features, connect with external tools, and customize your experience.

modules/configuring-the-quickstarts/proc-customize-rhdh-quickstart.adoc

@@ -0,0 +1,55 @@
+[id="customizing-your-product-quickstart_{context}"]
+= Customizing your {product} Quickstart
+
+You can configure the {product} Quickstart plugin to create a customized onboarding experience for your {product-short} administrators. 
+
+.Prerequisites
+You must have sufficient permissions as a platform engineer.
+
+.Procedure
+. Update your your `app-config.yaml`, as follows:
++
+.Example of customizing the Quickstart plugin 
+[source,yaml]
+----
+app:
+  quickstart:
+    - title: 'Welcome to Developer Hub' # <1>
+      description: 'Learn the basics of navigating the Developer Hub interface' # <2>
+      icon: 'home' # <3>
+      cta:
+        text: 'Get Started' # <4>
+        link: '/catalog' # <5>
+    - title: 'Create Your First Component'
+      description: 'Follow our guide to register your first software component'
+      icon: 'code'
+      cta:
+        text: 'Create Component'
+        link: '/catalog-import'
+    - title: 'Explore Templates'
+      description: 'Discover available software templates to bootstrap new projects'
+      icon: 'template'
+      cta:
+        text: 'Browse Templates'
+        link: '/create'
+----
+<1> (Required) The display title for the quickstart step.
+<2> (Required) A brief description of what the step covers.
+<3> Icon identifier (supports Material UI icons).
+<4> CTA button text.
+<5> CTA target URL or route.
+
+== Disabling the Quickstart plugin
+The Quickstart plugin is pre-loaded in {product-short} with basic configuration properties, and enabled by default. To disable it, set the disabled property to `true` as follows:
+
+.Example of disabling the Quickstart plugin
+[source,yaml]
+----
+global:
+  dynamic:
+    includes:
+      - dynamic-plugins.default.yaml
+    plugins:
+      - package: ./dynamic-plugins/dist/red-hat-developer-hub-backstage-plugin-quickstart
+        disabled: true
+----

modules/configuring-the-quickstarts/proc-starting-and-completing-modules-in-quickstarts.adoc

@@ -0,0 +1,22 @@
+[id='proc-starting-and-completing-modules-in-quickstarts_{context}']
+= Starting and completing Quickstart onboarding steps
+
+You can start and complete the Quickstart onboarding steps at your own pace.
+
+.Prerequisites
+. Your platform engineer has granted you access to the Quickstart plugin.
+
+.Procedure
+To start a Quickstart step in {product}, complete the following steps:
+
+. In your {product-very-short} navigation menu, click on the (`?`) icon.
+. Click *Quick start*.
+. Select the Quickstart step that you would like to begin.
+. To close the Quickstart drawer, click *Hide*.
++
+image::rhdh/about-quickstarts.png[About Quickstarts]
++
+[NOTE]
+====
+Your progress is tracked and displayed at the bottom of the drawer.
+====

modules/dynamic-plugins/con-extensions-managing-plugins.adoc

@@ -0,0 +1,19 @@
+[id="con-extensions-managing-plugins_{context}"]
+= Managing plugins by using Extensions
+
+You can install and configure plugins by using Extensions.
+
+[WARNING]
+Installation and configuration of plugins by using Extensions will only work in development environments. This feature is not supported in production environments.
+
+In a production environment, users will be notified that plugin installation is not permitted.
+
+image::rhdh/extensions-restart-plugin-1.png[]
+
+In a development environment: 
+
+* Administrators can install a plugin using the default configuration preloaded in the editor, or modify the configuration before installing. Upon successful installation, users will be notified that a backend restart is required to complete the installation process.
+* When a plugin is installed, administrators can access the Actions drop-down in the plugin’s side panel. Available actions include:
+** Editing the configuration used during installation
+** Disabling or enabling the plugin
+** After performing any of these actions, users will be notified that a backend restart is required for the changes to take effect.

modules/dynamic-plugins/proc-extensions-configuring-plugins.adoc

@@ -0,0 +1,27 @@
+[id="proc-extensions-configuring-plugins_{context}"]
+= Enabling and disabling plugins by using Extensions
+
+.Prerequisites
+* You have configured {product-very-short} to allow plugins installation from *Extensions*.
+* You have configured RBAC to allow the current user to access to manage plugin configuration.
+
+.Procedure
+. Navigate to *Extensions*.
+. Select a plugin to enable or disable.
+. Click on the Enable/Disable slider.
++
+image::rhdh/extensions-enable-plugin-1.png[]
+. To view the plugins that require a restart, click *View plugins* in the alert message.
++
+image::rhdh/extensions-install-plugin-3.png[]
+. Restart your {product-very-short} application.
+
+.Verification
+. After you restart your {product-very-short} application, navigate to *Extensions*.
+. Select the plugin that you have installed.
+. The Enable/Disable slider is updated.
+
+
+
+
+