@tduniec/backstage-plugin-time-saver
Version:
This plugin provides an implementation of charts and statistics related to your time savings that are coming from usage of your templates. Plugins is built from frontend and backend part. This part of plugin `frontend` is responsible of providing views wi
66 lines (63 loc) • 3.99 kB
JavaScript
import { jsxs, jsx } from 'react/jsx-runtime';
import { Grid, Divider, Paper } from '@material-ui/core';
import { InfoCard } from '@backstage/core-components';
import { LocalizationProvider } from '@mui/x-date-pickers';
import { AdapterLuxon } from '@mui/x-date-pickers/AdapterLuxon';
import { useApi, configApiRef } from '@backstage/core-plugin-api';
import { AllStatsBarChart } from '../AllStatsBarChartComponent/AllStatsBarChartComponent.esm.js';
import { GroupDivisionPieChart } from '../GroupDivisionPieChartComponent/GroupDivisionPieChartComponent.esm.js';
import { DailyTimeSummaryLineChartTeamWise } from '../TeamWiseDailyTimeLinearComponent/TeamWiseDailyTimeLinearComponent.esm.js';
import { TeamWiseTimeSummaryLinearChart } from '../TeamWiseTimeSummaryLinearComponent/TeamWiseTimeSummaryLinearComponent.esm.js';
import StatsTable from '../Table/StatsTable.esm.js';
import { TemplateCountGauge } from '../Gauge/TemplatesTaskCountGauge.esm.js';
import { TimeSavedGauge } from '../Gauge/TimeSavedGauge.esm.js';
import { TeamsGauge } from '../Gauge/TeamsGauge.esm.js';
import { TemplatesGauge } from '../Gauge/TemplatesGauge.esm.js';
import { EmptyTimeSaver } from '../Gauge/EmptyDbContent.esm.js';
import { DateFiltersComponent } from '../DateFiltersComponent/DateFiltersComponent.esm.js';
const GaugesContainer = ({
dates,
hoursPerDay
}) => /* @__PURE__ */ jsxs(
Grid,
{
container: true,
spacing: 4,
direction: "row",
justifyContent: "space-between",
alignItems: "center",
style: { marginTop: "12px", marginBottom: "12px" },
children: [
/* @__PURE__ */ jsx(Grid, { item: true, xs: 6, sm: 6, md: 2, children: /* @__PURE__ */ jsx(Paper, { elevation: 0, children: /* @__PURE__ */ jsx(TemplateCountGauge, { dates }) }) }),
/* @__PURE__ */ jsx(Grid, { item: true, xs: 6, sm: 6, md: 2, children: /* @__PURE__ */ jsx(Paper, { elevation: 0, children: /* @__PURE__ */ jsx(TimeSavedGauge, { heading: "Time Saved [hours]", dates }) }) }),
/* @__PURE__ */ jsx(Grid, { item: true, xs: 6, sm: 6, md: 2, children: /* @__PURE__ */ jsx(Paper, { elevation: 0, children: /* @__PURE__ */ jsx(
TimeSavedGauge,
{
number: hoursPerDay,
heading: "Time Saved [days]",
dates
}
) }) }),
/* @__PURE__ */ jsx(Grid, { item: true, xs: 6, sm: 6, md: 2, children: /* @__PURE__ */ jsx(Paper, { elevation: 0, children: /* @__PURE__ */ jsx(TeamsGauge, { dates }) }) }),
/* @__PURE__ */ jsx(Grid, { item: true, xs: 6, sm: 6, md: 2, children: /* @__PURE__ */ jsx(Paper, { elevation: 0, children: /* @__PURE__ */ jsx(TemplatesGauge, { dates }) }) })
]
}
);
function AllStatsSubPage() {
const configApi = useApi(configApiRef);
const hoursPerDay = configApi.getOptionalNumber("ts.frontend.table.hoursPerDay") ?? 8;
return /* @__PURE__ */ jsxs(LocalizationProvider, { dateAdapter: AdapterLuxon, children: [
/* @__PURE__ */ jsx(EmptyTimeSaver, {}),
/* @__PURE__ */ jsx(InfoCard, { title: "Time statistics that you have saved using Backstage Templates", children: /* @__PURE__ */ jsx(DateFiltersComponent, { children: (dates) => /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 2, children: [
/* @__PURE__ */ jsx(GaugesContainer, { dates, hoursPerDay }),
/* @__PURE__ */ jsx(Divider, { variant: "fullWidth" }),
/* @__PURE__ */ jsx(Grid, { xs: 6, children: /* @__PURE__ */ jsx(AllStatsBarChart, { dates }) }),
/* @__PURE__ */ jsx(Grid, { xs: 6, children: /* @__PURE__ */ jsx(StatsTable, { dates }) }),
/* @__PURE__ */ jsx(Grid, { xs: 6, children: /* @__PURE__ */ jsx(DailyTimeSummaryLineChartTeamWise, { dates }) }),
/* @__PURE__ */ jsx(Grid, { xs: 6, children: /* @__PURE__ */ jsx(TeamWiseTimeSummaryLinearChart, { dates }) }),
/* @__PURE__ */ jsx(Grid, { xs: 6, children: /* @__PURE__ */ jsx(GroupDivisionPieChart, { dates }) })
] }) }) })
] });
}
export { AllStatsSubPage };
//# sourceMappingURL=AllStatsSubPage.esm.js.map