From 2fadff2a2575483ebcee80804fcfe504c8fb5d10 Mon Sep 17 00:00:00 2001
From: Brian Fletcher <brian@roadie.io>
Date: Tue, 3 Jan 2023 21:37:03 +0000
Subject: [PATCH] allow task action descriptions to use markdown

This allows richer explanations for the behaviour of actions in the
actions documentation page.

Signed-off-by: Brian Fletcher <brian@roadie.io>
---
 .changeset/fair-falcons-lie.md                              | 5 +++++
 .changeset/few-penguins-admire.md                           | 6 ++++++
 .../src/actions/fetch/rails/index.ts                        | 2 +-
 .../src/scaffolder/actions/builtin/fetch/plain.ts           | 2 +-
 .../src/scaffolder/actions/builtin/fetch/template.ts        | 2 +-
 .../scaffolder/src/components/ActionsPage/ActionsPage.tsx   | 3 ++-
 6 files changed, 16 insertions(+), 4 deletions(-)
 create mode 100644 .changeset/fair-falcons-lie.md
 create mode 100644 .changeset/few-penguins-admire.md

diff --git a/.changeset/fair-falcons-lie.md b/.changeset/fair-falcons-lie.md
new file mode 100644
index 0000000000..ba39d51241
--- /dev/null
+++ b/.changeset/fair-falcons-lie.md
@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-scaffolder': patch
+---
+
+Render the scaffolder action description using the `MarkdownContent` component. This will allow the page to show richer content to describe scaffolder actions.
diff --git a/.changeset/few-penguins-admire.md b/.changeset/few-penguins-admire.md
new file mode 100644
index 0000000000..170b4aa606
--- /dev/null
+++ b/.changeset/few-penguins-admire.md
@@ -0,0 +1,6 @@
+---
+'@backstage/plugin-scaffolder-backend-module-rails': patch
+'@backstage/plugin-scaffolder-backend': patch
+---
+
+Change scaffolder task actions to include markdown to demonstrate the new `ActionsPage` markdown feature.
diff --git a/plugins/scaffolder-backend-module-rails/src/actions/fetch/rails/index.ts b/plugins/scaffolder-backend-module-rails/src/actions/fetch/rails/index.ts
index 49b7ac100b..7a77470e9b 100644
--- a/plugins/scaffolder-backend-module-rails/src/actions/fetch/rails/index.ts
+++ b/plugins/scaffolder-backend-module-rails/src/actions/fetch/rails/index.ts
@@ -54,7 +54,7 @@ export function createFetchRailsAction(options: {
   }>({
     id: 'fetch:rails',
     description:
-      'Downloads a template from the given URL into the workspace, and runs a rails new generator on it.',
+      'Downloads a template from the given `url` into the workspace, and runs a rails new generator on it.',
     schema: {
       input: {
         type: 'object',
diff --git a/plugins/scaffolder-backend/src/scaffolder/actions/builtin/fetch/plain.ts b/plugins/scaffolder-backend/src/scaffolder/actions/builtin/fetch/plain.ts
index 9dc82068c0..b3b984f544 100644
--- a/plugins/scaffolder-backend/src/scaffolder/actions/builtin/fetch/plain.ts
+++ b/plugins/scaffolder-backend/src/scaffolder/actions/builtin/fetch/plain.ts
@@ -33,7 +33,7 @@ export function createFetchPlainAction(options: {
   return createTemplateAction<{ url: string; targetPath?: string }>({
     id: 'fetch:plain',
     description:
-      "Downloads content and places it in the workspace, or optionally in a subdirectory specified by the 'targetPath' input option.",
+      'Downloads content and places it in the workspace, or optionally in a subdirectory specified by the `targetPath` input option.',
     schema: {
       input: {
         type: 'object',
diff --git a/plugins/scaffolder-backend/src/scaffolder/actions/builtin/fetch/template.ts b/plugins/scaffolder-backend/src/scaffolder/actions/builtin/fetch/template.ts
index d71997d496..10a9d0c055 100644
--- a/plugins/scaffolder-backend/src/scaffolder/actions/builtin/fetch/template.ts
+++ b/plugins/scaffolder-backend/src/scaffolder/actions/builtin/fetch/template.ts
@@ -65,7 +65,7 @@ export function createFetchTemplateAction(options: {
   }>({
     id: 'fetch:template',
     description:
-      "Downloads a skeleton, templates variables into file and directory names and content, and places the result in the workspace, or optionally in a subdirectory specified by the 'targetPath' input option.",
+      'Downloads a skeleton, templates variables into file and directory names and content, and places the result in the workspace, or optionally in a subdirectory specified by the `targetPath` input option.',
     schema: {
       input: {
         type: 'object',
diff --git a/plugins/scaffolder/src/components/ActionsPage/ActionsPage.tsx b/plugins/scaffolder/src/components/ActionsPage/ActionsPage.tsx
index 29951d7cb1..1fca434a96 100644
--- a/plugins/scaffolder/src/components/ActionsPage/ActionsPage.tsx
+++ b/plugins/scaffolder/src/components/ActionsPage/ActionsPage.tsx
@@ -39,6 +39,7 @@ import {
   Header,
   Page,
   ErrorPage,
+  MarkdownContent,
 } from '@backstage/core-components';
 
 const useStyles = makeStyles(theme => ({
@@ -166,7 +167,7 @@ export const ActionsPage = () => {
         <Typography variant="h4" className={classes.code}>
           {action.id}
         </Typography>
-        <Typography>{action.description}</Typography>
+        {action.description && <MarkdownContent content={action.description} />}
         {action.schema?.input && (
           <Box pb={2}>
             <Typography variant="h5">Input</Typography>