diff --git a/plugins/opencost/README.md b/plugins/opencost/README.md index 2a6cacdbb5..fbc923f37d 100644 --- a/plugins/opencost/README.md +++ b/plugins/opencost/README.md @@ -1,25 +1,63 @@ # OpenCost -Welcome to the OpenCost plugin! +Welcome to the [OpenCost](https://opencost.io) plugin! Currently this is a port of the [OpenCost UI](https://github.com/opencost/opencost/tree/develop/ui), but we will continue to expand it to expose any relevant data or pre-configured views that may be preferred. - - ## Installation +1. Add the OpenCost dependency to the `packages/app/package.json`: + ```sh + # From your Backstage root directory + yarn add --cwd packages/app @backstage/plugin-opencost + ``` +2. Add the `OpenCostPage` to your `packages/app/src/App.tsx`: + +```tsx +import { OpenCostPage } from '@backstage/plugin-opencost'; +``` + +and + +```tsx + + … + } /> + +``` + +3. Add link to OpenCost to your sidebar + + ```typescript + // packages/app/src/components/Root/Root.tsx + import MoneyIcon from '@material-ui/icons/MonetizationOn'; + + ... + + export const Root = ({ children }: PropsWithChildren<{}>) => ( + + + ... + + ... + + + ); + + ``` + ## Configuration ## TODO -* Document installation and configuration -* More testing -* Use the OpenCost mascot for the sidebar logo -* Use the Backstage proxy to communicate with the OpenCost API -* Convert AllocationReport.js to use the [Backstage Table](https://backstage.io/storybook/?path=/story/data-display-table--default-table) -* Allow for user-provided default reports and/or disabling controls -* Support multiple hard-coded reports -* Fork(?) to support Kubecost, which could provide Alerts and Recommendations, similar to the Cost Explorer plugin -* clean up deprecation warnings and upgrade to all the latest React components +- More testing +- Use the OpenCost mascot for the sidebar logo +- Use the Backstage proxy to communicate with the OpenCost API +- Convert AllocationReport.js to use the [Backstage Table](https://backstage.io/storybook/?path=/story/data-display-table--default-table) +- Allow for user-provided default reports and/or disabling controls +- Support multiple hard-coded reports +- Fork(?) to support Kubecost, which could provide Alerts and Recommendations, similar to the Cost Explorer plugin +- clean up deprecation warnings and upgrade to all the latest React components +- upgrade sidebar icon to https://mui.com/material-ui/material-icons/?query=money&selected=Savings ![Screenshot](screenshot.png)