[release-1.5] RHIDP-6500: Modularize customizing the Tech Radar page (#1113)

Co-authored-by: Fabrice Flore-Thébault <[email protected]>

Author: openshift-cherrypick-robot

assemblies/assembly-customizing-the-tech-radar-page.adoc

@@ -0,0 +1,22 @@
+[id='proc-customizing-the-tech-radar-page_{context}']
+= Customizing the Tech Radar page in {product}
+
+In {product}, the Tech Radar page is provided by the `tech-radar` dynamic plugin, which is disabled by default. For information about enabling dynamic plugins in {product} see link:{configuring-dynamic-plugins-book-url}[{configuring-dynamic-plugins-book-title}].
+
+In {product}, you can configure Learning Paths by passing the data into the `{my-app-config-file}` file as a proxy. The base Tech Radar URL must include the `/developer-hub/tech-radar` proxy.
+
+[NOTE]
+====
+Due to the use of overlapping `pathRewrites` for both the `tech-radar` and `homepage` quick access proxies, you must create the `tech-radar` configuration (`^api/proxy/developer-hub/tech-radar`) before you create the `homepage` configuration (`^/api/proxy/developer-hub`).
+
+For more information about customizing the Home page in {product}, see xref:customizing-the-home-page[Customizing the Home page in {product}].
+====
+
+You can provide data to the Tech Radar page from the following sources:
+
+* JSON files hosted on GitHub or GitLab.
+* A dedicated service that provides the Tech Radar data in JSON format using an API.
+
+include::modules/customizing-the-tech-radar-page/proc-customizing-the-tech-radar-page-by-using-a-json-file.adoc[leveloffset=+1]
+
+include::modules/customizing-the-tech-radar-page/proc-customizing-the-tech-radar-page-by-using-a-customization-service.adoc[leveloffset=+1]

modules/customizing-the-tech-radar-page/proc-customize-rhdh-tech-radar-page.adoc

@@ -0,0 +1,37 @@
+[id='proc-customizing-rhdh-tech-radar-page-by-using-a-customization-service_{context}']
+= Customizing the Tech Radar page by using a customization service
+
+For advanced scenarios, you can host your {product} customization service to provide data to all configurable {product-short} pages, such as the Tech Radar page.
+You can even use a different service for each page.
+
+.Prerequisites
+* You have specified the data sources for the Tech Radar plugin in the `integrations` section of the `{my-app-config-file}` file.
+For example, to configure GitHub as an integration, see link:{authentication-book-url}#authenticating-with-github[Authenticating with GitHub].
+
+* You have enabled the `./dynamic-plugins/dist/backstage-community-plugin-tech-radar` and `/dynamic-plugins/dist/backstage-community-plugin-tech-radar-backend-dynamic` plugins.
+
+.Procedure
+. Deploy your {product-short} customization service on the same {ocp-short} cluster as your {product-short} instance.
+You can find an example at link:https://github.com/redhat-developer/red-hat-developer-hub-customization-provider[`red-hat-developer-hub-customization-provider`], that provides the same data as default {product-short} data.
+The customization service provides a Tech Radar data URL such as: `pass:c,a,q[http://_<rhdh-customization-provider>_/tech-radar]`.
+
+. Add the dedicated service as an allowed host by adding the following code to the `{my-app-config-file}` file:
++
+[source,yaml,subs='+quotes']
+----
+backend:
+   reading:
+        allow:
+          - host: '_<rhdh_customization_provider_base_url>_'
+----
+`_<rhdh_customization_provider_base_url>_`:: Enter the base URL of your Tech Radar data URL, such as: `pass:c,a,q[_<rhdh-customization-provider>_]`.
+
+. Add the following to the `{my-app-config-file}` file:
++
+[source,yaml,subs='+quotes']
+----
+techRadar:
+    url: _<tech_radar_data_url>_
+----
+
+`_<tech_radar_data_url>_`:: Enter your Tech Radar data URL, such as: `pass:c,a,q[http://_<rhdh-customization-provider>_/tech-radar]`.

modules/customizing-the-tech-radar-page/proc-customizing-the-tech-radar-page-by-using-a-customization-service.adoc

@@ -0,0 +1,24 @@
+[id='proc-customizing-the-tech-radar-page-by-using-a-json-file_{context}']
+= Customizing the Tech Radar page by using a JSON file
+
+For ease of use and simplicity, you can configure the Tech Radar page by using a hosted JSON file.
+
+.Prerequisites
+
+* You have specified the data sources for the Tech Radar plugin in the `integrations` section of the `{my-app-config-file}` file. For example, to configure GitHub as an integration, see link:{authentication-book-url}#authenticating-with-github[Authenticating with GitHub].
+
+* You have enabled the `./dynamic-plugins/dist/backstage-community-plugin-tech-radar` and `/dynamic-plugins/dist/backstage-community-plugin-tech-radar-backend-dynamic` plugins.
+
+.Procedure
+
+. Publish the JSON file containing your Tech Radar data to a web server, such as GitHub or Gitlab. You can find an example at link:https://raw.githubusercontent.com/redhat-developer/rhdh/release-{product-version}/packages/app/public/tech-radar/data-default.json[].
+
+. Configure {product-short} to access the Tech Radar data from the hosted JSON files, by adding the following to the `{my-app-config-file}` file:
++
+[source,yaml,subs='+quotes']
+----
+techRadar:
+  url: _<tech_radar_data_url>_
+----
+
+`_<tech_radar_data_url>_`:: Enter the Tech Radar data hosted JSON URL.

modules/customizing-the-tech-radar-page/proc-customizing-the-tech-radar-page-by-using-a-json-file.adoc

@@ -27,7 +27,7 @@ include::assemblies/assembly-configuring-the-global-header.adoc[leveloffset=+1]
 
 include::assemblies/assembly-configuring-a-floating-action-button.adoc[leveloffset=+1]
 
-include::modules/customizing-the-tech-radar-page/proc-customize-rhdh-tech-radar-page.adoc[leveloffset=+1]
+include::assemblies/assembly-customizing-the-tech-radar-page.adoc[leveloffset=+1]
 
 
 include::assemblies/assembly-customizing-the-appearance.adoc[leveloffset=+1]