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

@@ -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.

.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.

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',

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',

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',

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>