feat: [CCM-19101]: CCM Plugin for IDP

packages/app/src/components/catalog/EntityPage.tsx

@@ -82,6 +82,12 @@ import {
   isHarnessIacmAvailable,
 } from '@harnessio/backstage-plugin-harness-iacm';
 
+import {
+  isHarnessCcmAvailable,
+  EntityCcmContent,
+  EntityCcmOverviewCard,
+} from '@harnessio/backstage-plugin-harness-ccm';
+
 const techdocsContent = (
   <EntityTechdocsContent>
     <TechDocsAddons>
@@ -222,6 +228,32 @@ const chaosContent = (
     </EntitySwitch.Case>
   </EntitySwitch>
 );
+
+const ccmContent = (
+  <EntitySwitch>
+    <EntitySwitch.Case if={isHarnessCcmAvailable}>
+      <EntityCcmContent />
+    </EntitySwitch.Case>
+
+    <EntitySwitch.Case>
+      <EmptyState
+        title="No Cloud Cost Management data available for this entity"
+        missing="info"
+        description="You need to add an annotation to your component if you want to enable Cloud Cost Management for it. You can read more about annotations in Backstage by clicking the button below."
+        action={
+          <Button
+            variant="contained"
+            color="primary"
+            href="https://backstage.io/docs/features/software-catalog/well-known-annotations"
+          >
+            Read more
+          </Button>
+        }
+      />
+    </EntitySwitch.Case>
+  </EntitySwitch>
+);
+
 const iacmContent = (
   <EntitySwitch>
     <EntitySwitch.Case if={isHarnessIacmAvailable}>
@@ -245,6 +277,9 @@ const overviewContent = (
     <Grid item md={8} xs={12}>
       <EntityHasSubcomponentsCard variant="gridItem" />
     </Grid>
+    <Grid item md={6} xs={12}>
+      <EntityCcmOverviewCard variant="gridItem" />
+    </Grid>
   </Grid>
 );
 
@@ -268,6 +303,10 @@ const serviceEntityPage = (
       {chaosContent}
     </EntityLayout.Route>
 
+    <EntityLayout.Route path="/ccm" title="Cloud Cost Management">
+      {ccmContent}
+    </EntityLayout.Route>
+
     <EntityLayout.Route path="/feature-flag" title="Feature Flags">
       {featureFlagList}
     </EntityLayout.Route>
@@ -321,6 +360,10 @@ const websiteEntityPage = (
       {chaosContent}
     </EntityLayout.Route>
 
+    <EntityLayout.Route path="/ccm" title="Cloud Cost Management">
+      {ccmContent}
+    </EntityLayout.Route>
+
     <EntityLayout.Route path="/dependencies" title="Dependencies">
       <Grid container spacing={3} alignItems="stretch">
         <Grid item md={6}>

plugins/harness-ccm/.eslintrc.js

@@ -0,0 +1 @@
+module.exports = require('@backstage/cli/config/eslint-factory')(__dirname);

plugins/harness-ccm/dev/index.tsx

@@ -0,0 +1,12 @@
+import React from 'react';
+import { createDevApp } from '@backstage/dev-utils';
+import { harnessCcmPlugin, EntityCcmContent } from '../src/plugin';
+
+createDevApp()
+  .registerPlugin(harnessCcmPlugin)
+  .addPage({
+    element: <EntityCcmContent />,
+    title: 'Root Page',
+    path: '/harness-ccm',
+  })
+  .render();

plugins/harness-ccm/package.json

@@ -0,0 +1,58 @@
+{
+  "name": "@harnessio/backstage-plugin-harness-ccm",
+  "version": "0.1.0",
+  "main": "src/index.ts",
+  "types": "src/index.ts",
+  "license": "Apache-2.0",
+  "private": false,
+  "publishConfig": {
+    "access": "public",
+    "main": "dist/index.esm.js",
+    "types": "dist/index.d.ts"
+  },
+  "backstage": {
+    "role": "frontend-plugin"
+  },
+  "sideEffects": false,
+  "scripts": {
+    "start": "backstage-cli package start",
+    "build": "backstage-cli package build",
+    "lint": "backstage-cli package lint",
+    "test": "backstage-cli package test",
+    "clean": "backstage-cli package clean",
+    "prepack": "backstage-cli package prepack",
+    "postpack": "backstage-cli package postpack"
+  },
+  "dependencies": {
+    "@backstage/catalog-model": "^1.5.0",
+    "@backstage/core-components": "^0.14.0",
+    "@backstage/core-plugin-api": "^1.9.0",
+    "@backstage/plugin-catalog-react": "^1.12.0",
+    "@backstage/theme": "^0.5.1",
+    "@material-ui/core": "^4.9.13",
+    "@material-ui/icons": "^4.9.1",
+    "@material-ui/lab": "4.0.0-alpha.61",
+    "@mui/icons-material": "^5.16.7",
+    "dayjs": "^1.11.11",
+    "path-to-regexp": "^6.2.2",
+    "react-use": "^17.2.4",
+    "recharts": "^2.12.7"
+  },
+  "peerDependencies": {
+    "react": "^16.13.1 || ^17.0.0 || ^18.0.0",
+    "react-router": "^6.23.1"
+  },
+  "devDependencies": {
+    "@backstage/cli": "^0.25.0",
+    "@backstage/core-app-api": "^1.12.0",
+    "@backstage/dev-utils": "^1.0.25",
+    "@backstage/test-utils": "^1.4.6",
+    "@testing-library/jest-dom": "^6.0.0",
+    "@testing-library/react": "^14.0.0",
+    "@testing-library/user-event": "^14.0.0",
+    "msw": "^1.0.0"
+  },
+  "files": [
+    "dist"
+  ]
+}