@fireflyai/backstage-plugin-firefly
Version:
Firefly plugin for Backstage
61 lines (58 loc) • 3.9 kB
JavaScript
import React, { useState, useEffect } from 'react';
import Grid from '@mui/material/Grid';
import { Progress, ResponseErrorPanel, Page, Header, Content, InfoCard } from '@backstage/core-components';
import { IaCCoveragePieChart } from '../IaCCoveragePieChart/IaCCoveragePieChart.esm.js';
import { useApi } from '@backstage/core-plugin-api';
import { catalogApiRef } from '@backstage/plugin-catalog-react';
import { useStyles } from './FireflyPage.style.esm.js';
import { numberWithCommas } from '../common.esm.js';
import { TopFiveComponents } from '../TopFiveComponentsWith/TopFiveComponents.esm.js';
const FireflyPage = () => {
const catalogApi = useApi(catalogApiRef);
const [fireflyResourceEntities, setFireflyResourceEntities] = useState([]);
const [fireflySystemEntities, setFireflySystemEntities] = useState([]);
const [loading, setLoading] = useState(true);
const [error, setError] = useState();
const classes = useStyles();
useEffect(() => {
const fetchData = async () => {
try {
setLoading(true);
let response = await catalogApi.getEntities({
filter: {
kind: "Resource",
"metadata.annotations.firefly.ai/managed-by-firefly": "true"
}
});
setFireflyResourceEntities(response.items);
response = await catalogApi.getEntities({
filter: {
kind: "System",
"metadata.annotations.firefly.ai/managed-by-firefly": "true"
}
});
setFireflySystemEntities(response.items);
} catch (e) {
setError(e);
} finally {
setLoading(false);
}
};
fetchData();
}, [catalogApi]);
if (loading) {
return /* @__PURE__ */ React.createElement(Progress, null);
}
if (error) {
return /* @__PURE__ */ React.createElement(ResponseErrorPanel, { error });
}
return /* @__PURE__ */ React.createElement(Page, { themeId: "tool" }, /* @__PURE__ */ React.createElement(
Header,
{
title: "Firefly",
subtitle: "Resources visibility and IaC coverage metrics"
}
), /* @__PURE__ */ React.createElement(Content, null, /* @__PURE__ */ React.createElement(Grid, { container: true, direction: "column", spacing: 1 }, /* @__PURE__ */ React.createElement(Grid, { container: true, direction: "row", spacing: 1, columns: 12 }, /* @__PURE__ */ React.createElement(Grid, { size: 6 }, /* @__PURE__ */ React.createElement(InfoCard, { title: "Total Resources" }, /* @__PURE__ */ React.createElement("span", { className: `${classes.gradientText} ${classes.totalText}` }, numberWithCommas(fireflyResourceEntities.length.toString())))), /* @__PURE__ */ React.createElement(Grid, { size: 6 }, /* @__PURE__ */ React.createElement(InfoCard, { title: "Total Systems" }, /* @__PURE__ */ React.createElement("span", { className: `${classes.gradientText} ${classes.totalText}` }, numberWithCommas(fireflySystemEntities.length.toString()))))), /* @__PURE__ */ React.createElement(Grid, { container: true, spacing: 1, direction: "row", columns: 12 }, /* @__PURE__ */ React.createElement(Grid, { size: 6 }, /* @__PURE__ */ React.createElement(IaCCoveragePieChart, { relatedEntities: fireflyResourceEntities })), /* @__PURE__ */ React.createElement(Grid, { size: 6 }, /* @__PURE__ */ React.createElement(TopFiveComponents, { type: "resources", entities: fireflyResourceEntities }))), /* @__PURE__ */ React.createElement(Grid, { container: true, spacing: 1, direction: "row", columns: 12 }, /* @__PURE__ */ React.createElement(Grid, { size: 6 }, /* @__PURE__ */ React.createElement(TopFiveComponents, { type: "unmanaged", entities: fireflyResourceEntities })), /* @__PURE__ */ React.createElement(Grid, { size: 6 }, /* @__PURE__ */ React.createElement(TopFiveComponents, { type: "drifted", entities: fireflyResourceEntities }))))));
};
export { FireflyPage };
//# sourceMappingURL=FireflyPage.esm.js.map