From bc05e9029734bb401e6be62b2ee65d26100b6f88 Mon Sep 17 00:00:00 2001 From: Ryan Vazquez Date: Wed, 24 Mar 2021 14:31:18 -0400 Subject: [PATCH] link to main README; refactor wording Signed-off-by: Ryan Vazquez --- plugins/cost-insights/README.md | 4 ++-- plugins/cost-insights/src/alerts/README.md | 14 ++++++++------ 2 files changed, 10 insertions(+), 8 deletions(-) diff --git a/plugins/cost-insights/README.md b/plugins/cost-insights/README.md index a103b58a77..bbd047be14 100644 --- a/plugins/cost-insights/README.md +++ b/plugins/cost-insights/README.md @@ -144,6 +144,6 @@ costInsights: The CostInsightsApi `getAlerts` method may return any type of alert or recommendation (called collectively "Action Items" in Cost Insights) that implements the [Alert type](https://github.com/backstage/backstage/blob/master/plugins/cost-insights/src/types/Alert.ts). This allows you to deliver any alerts or recommendations specific to your infrastructure or company migrations. -The Alert type includes an `element` field to supply the JSX Element that will be rendered in the Cost Insights "Action Items" section; we recommend using Backstage's [InfoCard](https://backstage.io/storybook/?path=/story/layout-information-card--default) and [Recharts](http://recharts.org/en-US/) to show actionable visualizations. +To learn more about using Cost Insights' ready-to-use alerts, see the alerts [README](https://github.com/backstage/backstage/blob/master/plugins/cost-insights/src/alerts/README.md). -The Alert `url` should link to documentation or instructions for resolving the alert. This may be omitted if no external link is needed. +Example implementations of custom alerts, forms and components can be found in the [examples](https://github.com/backstage/backstage/tree/master/plugins/cost-insights/src/example) directory. diff --git a/plugins/cost-insights/src/alerts/README.md b/plugins/cost-insights/src/alerts/README.md index 224691249a..4b24e4005f 100644 --- a/plugins/cost-insights/src/alerts/README.md +++ b/plugins/cost-insights/src/alerts/README.md @@ -1,6 +1,6 @@ # Cost Insights Alerts -Cost Insights currently supports [project growth](https://github.com/backstage/backstage/blob/master/plugins/cost-insights/src/alerts/ProjectGrowthAlert.tsx) and [unlabeled dataflow](https://github.com/backstage/backstage/blob/master/plugins/cost-insights/src/alerts/UnlabeledDataflowAlert.tsx) alerts. They do not require any UI or additional configuration but are extendable for custom implementations. +Cost Insights supports custom and ready-to-use alerts such as [project growth](https://github.com/backstage/backstage/blob/master/plugins/cost-insights/src/alerts/ProjectGrowthAlert.tsx) and [unlabeled dataflow](https://github.com/backstage/backstage/blob/master/plugins/cost-insights/src/alerts/UnlabeledDataflowAlert.tsx) alerts. These exported alerts do not require any UI or additional configuration but are extendable for custom implementations. ### Basic Setup @@ -35,9 +35,7 @@ export class CostInsightsClient extends CostInsightsApi { ### Custom Setup -Default properties such as the title, subtitle and even the chart itself can be overridden. - -Additionally, alerts can be extended to support actions such as snoozing or dismissing. +Default properties such as the title, subtitle and instructions page url can be overridden - even default UI such as chart itself. Additionally, alerts can be extended to support actions such as snoozing or dismissing. ![project-growth-alert-custom](../assets/project-growth-alert-custom.png) @@ -71,6 +69,7 @@ export class ProjectGrowthAlert extends DefaultProjectGrowthAlert { return 'A custom subtitle for a project growth alert'; } + // render a custom component in the Action Items section get element(){ return } @@ -87,7 +86,6 @@ export class ProjectGrowthAlert extends DefaultProjectGrowthAlert { ... } } - ``` ```ts @@ -116,7 +114,11 @@ export class CostInsightsClient extends CostInsightsApi { ### Advanced Setup -If the default UI is insufficient, alerts can render their own custom forms for actions such as snoozing or dismissing. Cost Insights exports several core UI components such as the `BarChart` and `LegendItem` to support custom implementations. +Alerts can render their own custom forms for actions such as snoozing or dismissing if the default UI is insufficient. + +Cost Insights exports several core UI components such as the `BarChart` and `LegendItem` to support custom implementations. + +**Note**: We recommend using Backstage's [InfoCard](https://backstage.io/storybook/?path=/story/layout-information-card--default) and [Recharts](http://recharts.org/en-US/) to show actionable visualizations. For more advanced usage, see example [KubernetesMigrationAlert](https://github.com/backstage/backstage/blob/master/plugins/cost-insights/src/example/alerts/KubernetesMigrationAlert.tsx).