Skip to content

RHIDP-6500: Modularize customizing the Tech Radar page #1069

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 2 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
22 changes: 22 additions & 0 deletions assemblies/assembly-customizing-the-tech-radar-page.adoc
Original file line number Diff line number Diff line change
@@ -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::proc-customizing-the-tech-radar-page-by-using-a-json-file.adoc[leveloffset=+1]

include::proc-customizing-the-tech-radar-page-by-using-a-customization-service.adoc[leveloffset=+1]

This file was deleted.

Original file line number Diff line number Diff line change
@@ -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]`.
Original file line number Diff line number Diff line change
@@ -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.
2 changes: 1 addition & 1 deletion titles/customizing/master.adoc
Original file line number Diff line number Diff line change
Expand Up @@ -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]
Expand Down
Loading