@electrolux-oss/plugin-infrawallet 0.1.10 → 0.1.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +45 -21
- package/dist/api/InfraWalletApi.esm.js.map +1 -1
- package/dist/api/InfraWalletApiClient.esm.js +12 -2
- package/dist/api/InfraWalletApiClient.esm.js.map +1 -1
- package/dist/api/functions.esm.js +33 -4
- package/dist/api/functions.esm.js.map +1 -1
- package/dist/components/ColumnsChartComponent/ColumnsChartComponent.esm.js +45 -28
- package/dist/components/ColumnsChartComponent/ColumnsChartComponent.esm.js.map +1 -1
- package/dist/components/CostReportsTableComponent/CostReportsTableComponent.esm.js +42 -37
- package/dist/components/CostReportsTableComponent/CostReportsTableComponent.esm.js.map +1 -1
- package/dist/components/ErrorsAlertComponent/ErrorsAlertComponent.esm.js +3 -2
- package/dist/components/ErrorsAlertComponent/ErrorsAlertComponent.esm.js.map +1 -1
- package/dist/components/FiltersComponent/FiltersComponent.esm.js +216 -10
- package/dist/components/FiltersComponent/FiltersComponent.esm.js.map +1 -1
- package/dist/components/MetricConfigurationComponent/MetricConfigurationComponent.esm.js +7 -0
- package/dist/components/MetricConfigurationComponent/MetricConfigurationComponent.esm.js.map +1 -1
- package/dist/components/ProviderIcons/ProviderIcons.esm.js +322 -0
- package/dist/components/ProviderIcons/ProviderIcons.esm.js.map +1 -0
- package/dist/components/ReportsComponent/ReportsComponent.esm.js +30 -15
- package/dist/components/ReportsComponent/ReportsComponent.esm.js.map +1 -1
- package/dist/components/TopbarComponent/TopbarComponent.esm.js +1 -1
- package/dist/components/TopbarComponent/TopbarComponent.esm.js.map +1 -1
- package/package.json +4 -6
- package/dist/components/CostReportsTableComponent/TrendBarComponent.esm.js +0 -43
- package/dist/components/CostReportsTableComponent/TrendBarComponent.esm.js.map +0 -1
|
@@ -50,10 +50,14 @@ const ReportsComponent = (props) => {
|
|
|
50
50
|
const { title, subTitle } = props;
|
|
51
51
|
const configApi = useApi(configApiRef);
|
|
52
52
|
const params = useParams();
|
|
53
|
-
|
|
53
|
+
let defaultGroupBy = (_a = configApi.getOptionalString("infraWallet.settings.defaultGroupBy")) != null ? _a : "none";
|
|
54
|
+
if (defaultGroupBy === "name") {
|
|
55
|
+
defaultGroupBy = "account";
|
|
56
|
+
}
|
|
54
57
|
const defaultShowLastXMonths = (_b = configApi.getOptionalNumber("infraWallet.settings.defaultShowLastXMonths")) != null ? _b : 3;
|
|
55
58
|
const MERGE_THRESHOLD = 8;
|
|
56
59
|
const [submittingState, setSubmittingState] = useState(false);
|
|
60
|
+
const [selectedTags, setSelectedTags] = useState([]);
|
|
57
61
|
const [reports, setReports] = useState([]);
|
|
58
62
|
const [metrics, setMetrics] = useState([]);
|
|
59
63
|
const [filters, setFilters] = useState({});
|
|
@@ -64,7 +68,7 @@ const ReportsComponent = (props) => {
|
|
|
64
68
|
const [granularity, setGranularity] = useState("monthly");
|
|
65
69
|
const [aggregatedBy, setAggregatedBy] = useState(defaultGroupBy);
|
|
66
70
|
const [groups] = useState("");
|
|
67
|
-
const [
|
|
71
|
+
const [monthRange, setMonthRange] = useState({
|
|
68
72
|
startMonth: startOfMonth(addMonths(/* @__PURE__ */ new Date(), defaultShowLastXMonths * -1 + 1)),
|
|
69
73
|
endMonth: endOfMonth(/* @__PURE__ */ new Date())
|
|
70
74
|
});
|
|
@@ -73,20 +77,20 @@ const ReportsComponent = (props) => {
|
|
|
73
77
|
const infraWalletApi = useApi(infraWalletApiRef);
|
|
74
78
|
const fetchCostReportsCallback = useCallback(async () => {
|
|
75
79
|
setSubmittingState(true);
|
|
76
|
-
await infraWalletApi.getCostReports("", groups, granularity,
|
|
80
|
+
await infraWalletApi.getCostReports("", selectedTags, groups, granularity, monthRange.startMonth, monthRange.endMonth).then((reportsResponse) => {
|
|
77
81
|
if (reportsResponse.data && reportsResponse.data.length > 0) {
|
|
78
82
|
setReports(reportsResponse.data);
|
|
79
|
-
setPeriods(getPeriodStrings(granularity,
|
|
83
|
+
setPeriods(getPeriodStrings(granularity, monthRange.startMonth, monthRange.endMonth));
|
|
80
84
|
}
|
|
81
85
|
if (reportsResponse.status === 207 && reportsResponse.errors) {
|
|
82
86
|
setCloudProviderErrors(reportsResponse.errors);
|
|
83
87
|
}
|
|
84
88
|
}).catch((e) => alertApi.post({ message: `${e.message}`, severity: "error" }));
|
|
85
89
|
setSubmittingState(false);
|
|
86
|
-
}, [groups,
|
|
90
|
+
}, [groups, monthRange, granularity, selectedTags, infraWalletApi, alertApi]);
|
|
87
91
|
const fetchMetricsCallback = useCallback(async () => {
|
|
88
92
|
var _a2;
|
|
89
|
-
await infraWalletApi.getMetrics((_a2 = params.name) != null ? _a2 : "default", granularity,
|
|
93
|
+
await infraWalletApi.getMetrics((_a2 = params.name) != null ? _a2 : "default", granularity, monthRange.startMonth, monthRange.endMonth).then((metricsResponse) => {
|
|
90
94
|
if (metricsResponse.data && metricsResponse.data.length > 0) {
|
|
91
95
|
setMetrics(metricsResponse.data);
|
|
92
96
|
}
|
|
@@ -94,18 +98,18 @@ const ReportsComponent = (props) => {
|
|
|
94
98
|
setCloudProviderErrors(metricsResponse.errors);
|
|
95
99
|
}
|
|
96
100
|
}).catch((e) => alertApi.post({ message: `${e.message}`, severity: "error" }));
|
|
97
|
-
}, [params.name,
|
|
101
|
+
}, [params.name, monthRange, granularity, infraWalletApi, alertApi]);
|
|
98
102
|
useEffect(() => {
|
|
99
103
|
if (reports.length !== 0) {
|
|
100
104
|
const filteredReports = filterCostReports(reports, filters);
|
|
101
|
-
const
|
|
102
|
-
const aggregatedAndMergedReports = mergeCostReports(
|
|
105
|
+
const aggregatedReports = aggregateCostReports(filteredReports, aggregatedBy);
|
|
106
|
+
const aggregatedAndMergedReports = mergeCostReports(aggregatedReports, MERGE_THRESHOLD);
|
|
103
107
|
const allTags = getAllReportTags(reports);
|
|
104
|
-
setReportsAggregated(
|
|
108
|
+
setReportsAggregated(aggregatedReports);
|
|
105
109
|
setReportsAggregatedAndMerged(aggregatedAndMergedReports);
|
|
106
110
|
setReportTags(allTags);
|
|
107
111
|
}
|
|
108
|
-
}, [filters, reports, aggregatedBy, granularity,
|
|
112
|
+
}, [filters, reports, aggregatedBy, granularity, monthRange]);
|
|
109
113
|
useEffect(() => {
|
|
110
114
|
fetchCostReportsCallback();
|
|
111
115
|
fetchMetricsCallback();
|
|
@@ -116,10 +120,20 @@ const ReportsComponent = (props) => {
|
|
|
116
120
|
aggregatedBy,
|
|
117
121
|
aggregatedBySetter: setAggregatedBy,
|
|
118
122
|
tags: reportTags,
|
|
119
|
-
monthRange
|
|
120
|
-
monthRangeSetter:
|
|
123
|
+
monthRange,
|
|
124
|
+
monthRangeSetter: setMonthRange
|
|
121
125
|
}
|
|
122
|
-
)), /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 12 }, /* @__PURE__ */ React.createElement(Accordion, null, /* @__PURE__ */ React.createElement(AccordionSummary, { expandIcon: /* @__PURE__ */ React.createElement(ExpandMoreIcon, null), "aria-controls": "filters-content", id: "filters-header" }, /* @__PURE__ */ React.createElement(Typography, null, "Filters ", checkIfFiltersActivated(filters) && /* @__PURE__ */ React.createElement(Chip, { size: "small", label: "active", color: "primary" }))), /* @__PURE__ */ React.createElement(AccordionDetails, null, /* @__PURE__ */ React.createElement(
|
|
126
|
+
)), /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 12 }, /* @__PURE__ */ React.createElement(Accordion, null, /* @__PURE__ */ React.createElement(AccordionSummary, { expandIcon: /* @__PURE__ */ React.createElement(ExpandMoreIcon, null), "aria-controls": "filters-content", id: "filters-header" }, /* @__PURE__ */ React.createElement(Typography, null, "Filters ", checkIfFiltersActivated(filters) && /* @__PURE__ */ React.createElement(Chip, { size: "small", label: "active", color: "primary" }))), /* @__PURE__ */ React.createElement(AccordionDetails, null, /* @__PURE__ */ React.createElement(
|
|
127
|
+
FiltersComponent,
|
|
128
|
+
{
|
|
129
|
+
reports,
|
|
130
|
+
filters,
|
|
131
|
+
monthRange,
|
|
132
|
+
filtersSetter: setFilters,
|
|
133
|
+
selectedTagsSetter: setSelectedTags,
|
|
134
|
+
providerErrorsSetter: setCloudProviderErrors
|
|
135
|
+
}
|
|
136
|
+
)))), /* @__PURE__ */ React.createElement(Grid, { item: true, xs: 12, md: 4, lg: 3 }, reportsAggregatedAndMerged.length > 0 && /* @__PURE__ */ React.createElement(
|
|
123
137
|
PieChartComponent,
|
|
124
138
|
{
|
|
125
139
|
categories: reportsAggregatedAndMerged.map((item) => item.id),
|
|
@@ -137,7 +151,8 @@ const ReportsComponent = (props) => {
|
|
|
137
151
|
data: rearrangeData(item, periods)
|
|
138
152
|
})),
|
|
139
153
|
metrics: metrics.map((item) => ({
|
|
140
|
-
name: item.
|
|
154
|
+
name: item.name,
|
|
155
|
+
group: item.group,
|
|
141
156
|
type: "line",
|
|
142
157
|
data: rearrangeData(item, periods)
|
|
143
158
|
})),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ReportsComponent.esm.js","sources":["../../../src/components/ReportsComponent/ReportsComponent.tsx"],"sourcesContent":["import { Content, Header, Page, Progress } from '@backstage/core-components';\nimport { alertApiRef, configApiRef, useApi } from '@backstage/core-plugin-api';\nimport { Chip, Grid } from '@material-ui/core';\nimport Accordion from '@material-ui/core/Accordion';\nimport AccordionDetails from '@material-ui/core/AccordionDetails';\nimport AccordionSummary from '@material-ui/core/AccordionSummary';\nimport Typography from '@material-ui/core/Typography';\nimport ExpandMoreIcon from '@material-ui/icons/ExpandMore';\nimport { addMonths, endOfMonth, startOfMonth } from 'date-fns';\nimport React, { useCallback, useEffect, useState } from 'react';\nimport { useParams } from 'react-router-dom';\nimport { infraWalletApiRef } from '../../api/InfraWalletApi';\nimport {\n aggregateCostReports,\n filterCostReports,\n getAllReportTags,\n getPeriodStrings,\n mergeCostReports,\n} from '../../api/functions';\nimport { CloudProviderError, Filters, Metric, Report } from '../../api/types';\nimport { ColumnsChartComponent } from '../ColumnsChartComponent';\nimport { CostReportsTableComponent } from '../CostReportsTableComponent';\nimport { ErrorsAlertComponent } from '../ErrorsAlertComponent';\nimport { FiltersComponent } from '../FiltersComponent';\nimport { PieChartComponent } from '../PieChartComponent';\nimport { TopbarComponent } from '../TopbarComponent';\nimport { MonthRange } from '../types';\n\nexport interface ReportsComponentProps {\n title?: string;\n subTitle?: string;\n}\n\nconst getTotalCost = (report: Report): number => {\n let total = 0;\n Object.keys(report.reports).forEach((s: string) => {\n total += report.reports[s];\n });\n return total;\n};\n\nconst rearrangeData = (report: Report, periods: string[]): any[] => {\n const costs: any[] = [];\n periods.forEach((s: string) => {\n if (report.reports[s] !== undefined) {\n costs.push(report.reports[s]);\n } else {\n costs.push(null);\n }\n });\n return costs;\n};\n\nconst checkIfFiltersActivated = (filters: Filters): boolean => {\n let activated = false;\n Object.keys(filters).forEach((key: string) => {\n if (filters[key].length > 0) {\n activated = true;\n }\n });\n return activated;\n};\n\nexport const ReportsComponent = (props: ReportsComponentProps) => {\n const { title, subTitle } = props;\n const configApi = useApi(configApiRef);\n const params = useParams();\n\n const defaultGroupBy = configApi.getOptionalString('infraWallet.settings.defaultGroupBy') ?? 'none';\n const defaultShowLastXMonths = configApi.getOptionalNumber('infraWallet.settings.defaultShowLastXMonths') ?? 3;\n\n const MERGE_THRESHOLD = 8;\n const [submittingState, setSubmittingState] = useState<boolean>(false);\n const [reports, setReports] = useState<Report[]>([]);\n const [metrics, setMetrics] = useState<Metric[]>([]);\n const [filters, setFilters] = useState<Filters>({});\n const [cloudProviderErrors, setCloudProviderErrors] = useState<CloudProviderError[]>([]);\n const [reportsAggregated, setReportsAggregated] = useState<Report[]>([]);\n const [reportsAggregatedAndMerged, setReportsAggregatedAndMerged] = useState<Report[]>([]);\n const [reportTags, setReportTags] = useState<string[]>([]);\n const [granularity, setGranularity] = useState<string>('monthly');\n const [aggregatedBy, setAggregatedBy] = useState<string>(defaultGroupBy);\n const [groups] = useState<string>('');\n const [monthRangeState, setMonthRangeState] = React.useState<MonthRange>({\n startMonth: startOfMonth(addMonths(new Date(), defaultShowLastXMonths * -1 + 1)),\n endMonth: endOfMonth(new Date()),\n });\n const [periods, setPeriods] = useState<string[]>([]);\n\n const alertApi = useApi(alertApiRef);\n const infraWalletApi = useApi(infraWalletApiRef);\n\n const fetchCostReportsCallback = useCallback(async () => {\n setSubmittingState(true);\n await infraWalletApi\n .getCostReports('', groups, granularity, monthRangeState.startMonth, monthRangeState.endMonth)\n .then(reportsResponse => {\n if (reportsResponse.data && reportsResponse.data.length > 0) {\n setReports(reportsResponse.data);\n setPeriods(getPeriodStrings(granularity, monthRangeState.startMonth, monthRangeState.endMonth));\n }\n if (reportsResponse.status === 207 && reportsResponse.errors) {\n setCloudProviderErrors(reportsResponse.errors);\n }\n })\n .catch(e => alertApi.post({ message: `${e.message}`, severity: 'error' }));\n setSubmittingState(false);\n }, [groups, monthRangeState, granularity, infraWalletApi, alertApi]);\n\n const fetchMetricsCallback = useCallback(async () => {\n await infraWalletApi\n .getMetrics(params.name ?? 'default', granularity, monthRangeState.startMonth, monthRangeState.endMonth)\n .then(metricsResponse => {\n if (metricsResponse.data && metricsResponse.data.length > 0) {\n setMetrics(metricsResponse.data);\n }\n if (metricsResponse.status === 207 && metricsResponse.errors) {\n setCloudProviderErrors(metricsResponse.errors);\n }\n })\n .catch(e => alertApi.post({ message: `${e.message}`, severity: 'error' }));\n }, [params.name, monthRangeState, granularity, infraWalletApi, alertApi]);\n\n useEffect(() => {\n if (reports.length !== 0) {\n const filteredReports = filterCostReports(reports, filters);\n const arrgegatedReports = aggregateCostReports(filteredReports, aggregatedBy);\n const aggregatedAndMergedReports = mergeCostReports(arrgegatedReports, MERGE_THRESHOLD);\n const allTags = getAllReportTags(reports);\n setReportsAggregated(arrgegatedReports);\n setReportsAggregatedAndMerged(aggregatedAndMergedReports);\n setReportTags(allTags);\n }\n }, [filters, reports, aggregatedBy, granularity, monthRangeState]);\n\n useEffect(() => {\n fetchCostReportsCallback();\n fetchMetricsCallback();\n }, [fetchCostReportsCallback, fetchMetricsCallback]);\n\n return (\n <Page themeId=\"tool\">\n <Header title={title ?? 'InfraWallet'} subtitle={subTitle ?? ''} />\n <Content>\n {submittingState ? <Progress /> : null}\n <Grid container spacing={3}>\n {cloudProviderErrors.length > 0 && (\n <Grid item xs={12}>\n <ErrorsAlertComponent errors={cloudProviderErrors} />\n </Grid>\n )}\n <Grid item xs={12}>\n <TopbarComponent\n aggregatedBy={aggregatedBy}\n aggregatedBySetter={setAggregatedBy}\n tags={reportTags}\n monthRange={monthRangeState}\n monthRangeSetter={setMonthRangeState}\n />\n </Grid>\n <Grid item xs={12}>\n <Accordion>\n <AccordionSummary expandIcon={<ExpandMoreIcon />} aria-controls=\"filters-content\" id=\"filters-header\">\n <Typography>\n Filters {checkIfFiltersActivated(filters) && <Chip size=\"small\" label=\"active\" color=\"primary\" />}\n </Typography>\n </AccordionSummary>\n <AccordionDetails>\n <FiltersComponent reports={reports} filters={filters} filtersSetter={setFilters} />\n </AccordionDetails>\n </Accordion>\n </Grid>\n <Grid item xs={12} md={4} lg={3}>\n {reportsAggregatedAndMerged.length > 0 && (\n <PieChartComponent\n categories={reportsAggregatedAndMerged.map((item: any) => item.id)}\n series={reportsAggregatedAndMerged.map((item: any) => getTotalCost(item))}\n height={350}\n />\n )}\n </Grid>\n <Grid item xs={12} md={8} lg={9}>\n {reportsAggregatedAndMerged.length > 0 && (\n <ColumnsChartComponent\n granularitySetter={setGranularity}\n categories={periods}\n series={reportsAggregatedAndMerged.map((item: any) => ({\n name: item.id,\n type: 'column',\n data: rearrangeData(item, periods),\n }))}\n metrics={metrics.map((item: any) => ({\n name: item.id,\n type: 'line',\n data: rearrangeData(item, periods),\n }))}\n height={350}\n />\n )}\n </Grid>\n <Grid item xs={12}>\n {reportsAggregated.length > 0 && (\n <CostReportsTableComponent reports={reportsAggregated} aggregatedBy={aggregatedBy} periods={periods} />\n )}\n </Grid>\n </Grid>\n </Content>\n </Page>\n );\n};\n"],"names":["_a"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ReportsComponent.esm.js","sources":["../../../src/components/ReportsComponent/ReportsComponent.tsx"],"sourcesContent":["import { Content, Header, Page, Progress } from '@backstage/core-components';\nimport { alertApiRef, configApiRef, useApi } from '@backstage/core-plugin-api';\nimport { Chip, Grid } from '@material-ui/core';\nimport Accordion from '@material-ui/core/Accordion';\nimport AccordionDetails from '@material-ui/core/AccordionDetails';\nimport AccordionSummary from '@material-ui/core/AccordionSummary';\nimport Typography from '@material-ui/core/Typography';\nimport ExpandMoreIcon from '@material-ui/icons/ExpandMore';\nimport { addMonths, endOfMonth, startOfMonth } from 'date-fns';\nimport React, { useCallback, useEffect, useState } from 'react';\nimport { useParams } from 'react-router-dom';\nimport { infraWalletApiRef } from '../../api/InfraWalletApi';\nimport {\n aggregateCostReports,\n filterCostReports,\n getAllReportTags,\n getPeriodStrings,\n mergeCostReports,\n} from '../../api/functions';\nimport { CloudProviderError, Filters, Metric, Report, Tag } from '../../api/types';\nimport { ColumnsChartComponent } from '../ColumnsChartComponent';\nimport { CostReportsTableComponent } from '../CostReportsTableComponent';\nimport { ErrorsAlertComponent } from '../ErrorsAlertComponent';\nimport { FiltersComponent } from '../FiltersComponent';\nimport { PieChartComponent } from '../PieChartComponent';\nimport { TopbarComponent } from '../TopbarComponent';\nimport { MonthRange } from '../types';\n\nexport interface ReportsComponentProps {\n title?: string;\n subTitle?: string;\n}\n\nconst getTotalCost = (report: Report): number => {\n let total = 0;\n Object.keys(report.reports).forEach((s: string) => {\n total += report.reports[s];\n });\n return total;\n};\n\nconst rearrangeData = (report: Report, periods: string[]): any[] => {\n const costs: any[] = [];\n periods.forEach((s: string) => {\n if (report.reports[s] !== undefined) {\n costs.push(report.reports[s]);\n } else {\n costs.push(null);\n }\n });\n return costs;\n};\n\nconst checkIfFiltersActivated = (filters: Filters): boolean => {\n let activated = false;\n Object.keys(filters).forEach((key: string) => {\n if (filters[key].length > 0) {\n activated = true;\n }\n });\n return activated;\n};\n\nexport const ReportsComponent = (props: ReportsComponentProps) => {\n const { title, subTitle } = props;\n const configApi = useApi(configApiRef);\n const params = useParams();\n\n let defaultGroupBy = configApi.getOptionalString('infraWallet.settings.defaultGroupBy') ?? 'none';\n // \"name\" is renamed to \"account\", make it backward compatibility\n if (defaultGroupBy === 'name') {\n defaultGroupBy = 'account';\n }\n\n const defaultShowLastXMonths = configApi.getOptionalNumber('infraWallet.settings.defaultShowLastXMonths') ?? 3;\n\n const MERGE_THRESHOLD = 8;\n const [submittingState, setSubmittingState] = useState<boolean>(false);\n const [selectedTags, setSelectedTags] = useState<Tag[]>([]);\n const [reports, setReports] = useState<Report[]>([]);\n const [metrics, setMetrics] = useState<Metric[]>([]);\n const [filters, setFilters] = useState<Filters>({});\n const [cloudProviderErrors, setCloudProviderErrors] = useState<CloudProviderError[]>([]);\n const [reportsAggregated, setReportsAggregated] = useState<Report[]>([]);\n const [reportsAggregatedAndMerged, setReportsAggregatedAndMerged] = useState<Report[]>([]);\n const [reportTags, setReportTags] = useState<string[]>([]);\n const [granularity, setGranularity] = useState<string>('monthly');\n const [aggregatedBy, setAggregatedBy] = useState<string>(defaultGroupBy);\n const [groups] = useState<string>('');\n const [monthRange, setMonthRange] = useState<MonthRange>({\n startMonth: startOfMonth(addMonths(new Date(), defaultShowLastXMonths * -1 + 1)),\n endMonth: endOfMonth(new Date()),\n });\n const [periods, setPeriods] = useState<string[]>([]);\n\n const alertApi = useApi(alertApiRef);\n const infraWalletApi = useApi(infraWalletApiRef);\n\n const fetchCostReportsCallback = useCallback(async () => {\n setSubmittingState(true);\n await infraWalletApi\n .getCostReports('', selectedTags, groups, granularity, monthRange.startMonth, monthRange.endMonth)\n .then(reportsResponse => {\n if (reportsResponse.data && reportsResponse.data.length > 0) {\n setReports(reportsResponse.data);\n setPeriods(getPeriodStrings(granularity, monthRange.startMonth, monthRange.endMonth));\n }\n if (reportsResponse.status === 207 && reportsResponse.errors) {\n setCloudProviderErrors(reportsResponse.errors);\n }\n })\n .catch(e => alertApi.post({ message: `${e.message}`, severity: 'error' }));\n setSubmittingState(false);\n }, [groups, monthRange, granularity, selectedTags, infraWalletApi, alertApi]);\n\n const fetchMetricsCallback = useCallback(async () => {\n await infraWalletApi\n .getMetrics(params.name ?? 'default', granularity, monthRange.startMonth, monthRange.endMonth)\n .then(metricsResponse => {\n if (metricsResponse.data && metricsResponse.data.length > 0) {\n setMetrics(metricsResponse.data);\n }\n if (metricsResponse.status === 207 && metricsResponse.errors) {\n setCloudProviderErrors(metricsResponse.errors);\n }\n })\n .catch(e => alertApi.post({ message: `${e.message}`, severity: 'error' }));\n }, [params.name, monthRange, granularity, infraWalletApi, alertApi]);\n\n useEffect(() => {\n if (reports.length !== 0) {\n const filteredReports = filterCostReports(reports, filters);\n const aggregatedReports = aggregateCostReports(filteredReports, aggregatedBy);\n const aggregatedAndMergedReports = mergeCostReports(aggregatedReports, MERGE_THRESHOLD);\n const allTags = getAllReportTags(reports);\n setReportsAggregated(aggregatedReports);\n setReportsAggregatedAndMerged(aggregatedAndMergedReports);\n setReportTags(allTags);\n }\n }, [filters, reports, aggregatedBy, granularity, monthRange]);\n\n useEffect(() => {\n fetchCostReportsCallback();\n fetchMetricsCallback();\n }, [fetchCostReportsCallback, fetchMetricsCallback]);\n\n return (\n <Page themeId=\"tool\">\n <Header title={title ?? 'InfraWallet'} subtitle={subTitle ?? ''} />\n <Content>\n {submittingState ? <Progress /> : null}\n <Grid container spacing={3}>\n {cloudProviderErrors.length > 0 && (\n <Grid item xs={12}>\n <ErrorsAlertComponent errors={cloudProviderErrors} />\n </Grid>\n )}\n <Grid item xs={12}>\n <TopbarComponent\n aggregatedBy={aggregatedBy}\n aggregatedBySetter={setAggregatedBy}\n tags={reportTags}\n monthRange={monthRange}\n monthRangeSetter={setMonthRange}\n />\n </Grid>\n <Grid item xs={12}>\n <Accordion>\n <AccordionSummary expandIcon={<ExpandMoreIcon />} aria-controls=\"filters-content\" id=\"filters-header\">\n <Typography>\n Filters {checkIfFiltersActivated(filters) && <Chip size=\"small\" label=\"active\" color=\"primary\" />}\n </Typography>\n </AccordionSummary>\n <AccordionDetails>\n <FiltersComponent\n reports={reports}\n filters={filters}\n monthRange={monthRange}\n filtersSetter={setFilters}\n selectedTagsSetter={setSelectedTags}\n providerErrorsSetter={setCloudProviderErrors}\n />\n </AccordionDetails>\n </Accordion>\n </Grid>\n <Grid item xs={12} md={4} lg={3}>\n {reportsAggregatedAndMerged.length > 0 && (\n <PieChartComponent\n categories={reportsAggregatedAndMerged.map((item: any) => item.id)}\n series={reportsAggregatedAndMerged.map((item: any) => getTotalCost(item))}\n height={350}\n />\n )}\n </Grid>\n <Grid item xs={12} md={8} lg={9}>\n {reportsAggregatedAndMerged.length > 0 && (\n <ColumnsChartComponent\n granularitySetter={setGranularity}\n categories={periods}\n series={reportsAggregatedAndMerged.map((item: any) => ({\n name: item.id,\n type: 'column',\n data: rearrangeData(item, periods),\n }))}\n metrics={metrics.map((item: any) => ({\n name: item.name,\n group: item.group,\n type: 'line',\n data: rearrangeData(item, periods),\n }))}\n height={350}\n />\n )}\n </Grid>\n <Grid item xs={12}>\n {reportsAggregated.length > 0 && (\n <CostReportsTableComponent reports={reportsAggregated} aggregatedBy={aggregatedBy} periods={periods} />\n )}\n </Grid>\n </Grid>\n </Content>\n </Page>\n );\n};\n"],"names":["_a"],"mappings":"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"}
|
|
@@ -30,7 +30,7 @@ const TopbarComponent = ({
|
|
|
30
30
|
endMonth: endOfMonth(/* @__PURE__ */ new Date())
|
|
31
31
|
});
|
|
32
32
|
};
|
|
33
|
-
return /* @__PURE__ */ React.createElement(Box, null, /* @__PURE__ */ React.createElement(FormControl, { className: classes.formControl }, /* @__PURE__ */ React.createElement(InputLabel, { shrink: true }, "Group by"), /* @__PURE__ */ React.createElement(Select, { value: aggregatedBy, onChange: (event) => aggregatedBySetter(event.target.value) }, /* @__PURE__ */ React.createElement(MenuItem, { value: "none" }, /* @__PURE__ */ React.createElement("em", null, "None")), /* @__PURE__ */ React.createElement(MenuItem, { value: "
|
|
33
|
+
return /* @__PURE__ */ React.createElement(Box, null, /* @__PURE__ */ React.createElement(FormControl, { className: classes.formControl }, /* @__PURE__ */ React.createElement(InputLabel, { shrink: true }, "Group by"), /* @__PURE__ */ React.createElement(Select, { value: aggregatedBy, onChange: (event) => aggregatedBySetter(event.target.value) }, /* @__PURE__ */ React.createElement(MenuItem, { value: "none" }, /* @__PURE__ */ React.createElement("em", null, "None")), /* @__PURE__ */ React.createElement(MenuItem, { value: "account" }, "Account"), /* @__PURE__ */ React.createElement(MenuItem, { value: "provider" }, "Provider"), /* @__PURE__ */ React.createElement(MenuItem, { value: "category" }, "Category"), /* @__PURE__ */ React.createElement(MenuItem, { value: "service" }, "Cloud Service"), /* @__PURE__ */ React.createElement(Divider, { light: true }), /* @__PURE__ */ React.createElement(ListSubheader, { onClickCapture: (e) => e.stopPropagation() }, "Tags"), tags.map((tag) => /* @__PURE__ */ React.createElement(MenuItem, { key: tag, value: tag }, `tag:${tag}`)))), /* @__PURE__ */ React.createElement(FormControl, { className: classes.formControl }, /* @__PURE__ */ React.createElement(LocalizationProvider, { dateAdapter: AdapterDateFns }, /* @__PURE__ */ React.createElement(
|
|
34
34
|
DatePicker,
|
|
35
35
|
{
|
|
36
36
|
value: monthRange.startMonth,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TopbarComponent.esm.js","sources":["../../../src/components/TopbarComponent/TopbarComponent.tsx"],"sourcesContent":["import { Box, Button, FormControl, FormHelperText, Grid, MenuItem, Select } from '@material-ui/core';\nimport Divider from '@material-ui/core/Divider';\nimport InputLabel from '@material-ui/core/InputLabel';\nimport ListSubheader from '@material-ui/core/ListSubheader';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';\nimport { DatePicker } from '@mui/x-date-pickers/DatePicker';\nimport { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';\nimport { addMonths, endOfMonth, startOfMonth } from 'date-fns';\nimport React, { FC } from 'react';\nimport { TopbarComponentProps } from '../types';\n\nconst useStyles = makeStyles(theme => ({\n formControl: {\n marginLeft: theme.spacing(1),\n marginRight: theme.spacing(3),\n minWidth: 120,\n },\n}));\n\nexport const TopbarComponent: FC<TopbarComponentProps> = ({\n aggregatedBy,\n aggregatedBySetter,\n tags,\n monthRange,\n monthRangeSetter,\n}) => {\n const classes = useStyles();\n\n const setPreDefinedMonthRange = (lastXMonth: number) => {\n monthRangeSetter({\n startMonth: startOfMonth(addMonths(new Date(), lastXMonth * -1)),\n endMonth: endOfMonth(new Date()),\n });\n };\n\n return (\n <Box>\n <FormControl className={classes.formControl}>\n <InputLabel shrink>Group by</InputLabel>\n <Select value={aggregatedBy} onChange={event => aggregatedBySetter(event.target.value)}>\n <MenuItem value=\"none\">\n <em>None</em>\n </MenuItem>\n <MenuItem value=\"
|
|
1
|
+
{"version":3,"file":"TopbarComponent.esm.js","sources":["../../../src/components/TopbarComponent/TopbarComponent.tsx"],"sourcesContent":["import { Box, Button, FormControl, FormHelperText, Grid, MenuItem, Select } from '@material-ui/core';\nimport Divider from '@material-ui/core/Divider';\nimport InputLabel from '@material-ui/core/InputLabel';\nimport ListSubheader from '@material-ui/core/ListSubheader';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';\nimport { DatePicker } from '@mui/x-date-pickers/DatePicker';\nimport { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';\nimport { addMonths, endOfMonth, startOfMonth } from 'date-fns';\nimport React, { FC } from 'react';\nimport { TopbarComponentProps } from '../types';\n\nconst useStyles = makeStyles(theme => ({\n formControl: {\n marginLeft: theme.spacing(1),\n marginRight: theme.spacing(3),\n minWidth: 120,\n },\n}));\n\nexport const TopbarComponent: FC<TopbarComponentProps> = ({\n aggregatedBy,\n aggregatedBySetter,\n tags,\n monthRange,\n monthRangeSetter,\n}) => {\n const classes = useStyles();\n\n const setPreDefinedMonthRange = (lastXMonth: number) => {\n monthRangeSetter({\n startMonth: startOfMonth(addMonths(new Date(), lastXMonth * -1)),\n endMonth: endOfMonth(new Date()),\n });\n };\n\n return (\n <Box>\n <FormControl className={classes.formControl}>\n <InputLabel shrink>Group by</InputLabel>\n <Select value={aggregatedBy} onChange={event => aggregatedBySetter(event.target.value)}>\n <MenuItem value=\"none\">\n <em>None</em>\n </MenuItem>\n <MenuItem value=\"account\">Account</MenuItem>\n <MenuItem value=\"provider\">Provider</MenuItem>\n <MenuItem value=\"category\">Category</MenuItem>\n <MenuItem value=\"service\">Cloud Service</MenuItem>\n <Divider light />\n <ListSubheader onClickCapture={e => e.stopPropagation()}>Tags</ListSubheader>\n {tags.map(tag => (\n <MenuItem key={tag} value={tag}>\n {`tag:${tag}`}\n </MenuItem>\n ))}\n </Select>\n </FormControl>\n\n <FormControl className={classes.formControl}>\n <LocalizationProvider dateAdapter={AdapterDateFns}>\n <DatePicker\n value={monthRange.startMonth}\n label=\"From\"\n views={['year', 'month']}\n slotProps={{ textField: { variant: 'standard' } }}\n onAccept={value => {\n if (value) {\n monthRangeSetter({\n startMonth: startOfMonth(value),\n endMonth: endOfMonth(monthRange.endMonth),\n });\n }\n }}\n />\n </LocalizationProvider>\n </FormControl>\n\n <FormControl className={classes.formControl}>\n <LocalizationProvider dateAdapter={AdapterDateFns}>\n <DatePicker\n value={monthRange.endMonth}\n label=\"To\"\n views={['year', 'month']}\n slotProps={{ textField: { variant: 'standard' } }}\n onAccept={value => {\n if (value) {\n monthRangeSetter({\n startMonth: startOfMonth(monthRange.startMonth),\n endMonth: endOfMonth(value),\n });\n }\n }}\n />\n </LocalizationProvider>\n </FormControl>\n\n <FormControl className={classes.formControl}>\n <FormHelperText>Quick selections for month ranges</FormHelperText>\n <Grid container spacing={3}>\n <Grid item xs={12}>\n <Button color=\"primary\" onClick={() => setPreDefinedMonthRange(2)}>\n Last 3 Months\n </Button>\n <Button color=\"primary\" onClick={() => setPreDefinedMonthRange(5)}>\n Last 6 Months\n </Button>\n <Button color=\"primary\" onClick={() => setPreDefinedMonthRange(11)}>\n Last 12 Months\n </Button>\n </Grid>\n </Grid>\n </FormControl>\n </Box>\n );\n};\n"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@electrolux-oss/plugin-infrawallet",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.11",
|
|
4
4
|
"backstage": {
|
|
5
5
|
"role": "frontend-plugin"
|
|
6
6
|
},
|
|
@@ -41,14 +41,13 @@
|
|
|
41
41
|
"@material-ui/icons": "^4.9.1",
|
|
42
42
|
"@material-ui/lab": "^4.0.0-alpha.61",
|
|
43
43
|
"@mui/material": "^5.16.6",
|
|
44
|
-
"@mui/x-
|
|
45
|
-
"@mui/x-
|
|
44
|
+
"@mui/x-charts": "7.17.0",
|
|
45
|
+
"@mui/x-data-grid": "7.17.0",
|
|
46
|
+
"@mui/x-date-pickers": "7.17.0",
|
|
46
47
|
"@stitches/react": "1.2.8",
|
|
47
48
|
"@types/react": "^18",
|
|
48
|
-
"@viniarruda/react-month-range-picker": "2.0.4",
|
|
49
49
|
"apexcharts": "3.51.0",
|
|
50
50
|
"better-react-mathjax": "^2.0.2",
|
|
51
|
-
"d3-shape": "3.2.0",
|
|
52
51
|
"date-fns": "2.30.0",
|
|
53
52
|
"human-format": "1.2.0",
|
|
54
53
|
"lodash": "^4.17.21",
|
|
@@ -56,7 +55,6 @@
|
|
|
56
55
|
"mui-modal-provider": "2.2.0",
|
|
57
56
|
"node-fetch": "^2.6.7",
|
|
58
57
|
"react-apexcharts": "1.4.1",
|
|
59
|
-
"react-date-range": "1.4.0",
|
|
60
58
|
"uuid": "10.0.0"
|
|
61
59
|
},
|
|
62
60
|
"devDependencies": {
|
|
@@ -1,43 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { Box } from '@material-ui/core';
|
|
3
|
-
import { makeStyles } from '@material-ui/core/styles';
|
|
4
|
-
import Chart from 'react-apexcharts';
|
|
5
|
-
|
|
6
|
-
const TrendBarComponent = ({ categories, series, height, width }) => {
|
|
7
|
-
const useStyles = makeStyles({
|
|
8
|
-
fixedBox: {
|
|
9
|
-
display: "flex",
|
|
10
|
-
height: height ? height : 25,
|
|
11
|
-
width: width ? width : 100
|
|
12
|
-
}
|
|
13
|
-
});
|
|
14
|
-
const classes = useStyles();
|
|
15
|
-
const options = {
|
|
16
|
-
chart: {
|
|
17
|
-
width: width ? width : 100,
|
|
18
|
-
type: "bar",
|
|
19
|
-
animations: {
|
|
20
|
-
enabled: false
|
|
21
|
-
},
|
|
22
|
-
zoom: {
|
|
23
|
-
enabled: false
|
|
24
|
-
},
|
|
25
|
-
toolbar: {
|
|
26
|
-
show: false
|
|
27
|
-
},
|
|
28
|
-
sparkline: {
|
|
29
|
-
enabled: true
|
|
30
|
-
}
|
|
31
|
-
},
|
|
32
|
-
tooltip: {
|
|
33
|
-
enabled: false
|
|
34
|
-
},
|
|
35
|
-
xaxis: {
|
|
36
|
-
categories
|
|
37
|
-
}
|
|
38
|
-
};
|
|
39
|
-
return /* @__PURE__ */ React.createElement(Box, { className: classes.fixedBox }, /* @__PURE__ */ React.createElement(Chart, { options, series, type: "bar", height: "100%" }));
|
|
40
|
-
};
|
|
41
|
-
|
|
42
|
-
export { TrendBarComponent };
|
|
43
|
-
//# sourceMappingURL=TrendBarComponent.esm.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"TrendBarComponent.esm.js","sources":["../../../src/components/CostReportsTableComponent/TrendBarComponent.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport { Box } from '@material-ui/core';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { TrendBarComponentProps } from '../types';\nimport Chart from 'react-apexcharts';\nimport { ApexOptions } from 'apexcharts';\n\nexport const TrendBarComponent: FC<TrendBarComponentProps> = ({ categories, series, height, width }) => {\n const useStyles = makeStyles({\n fixedBox: {\n display: 'flex',\n height: height ? height : 25,\n width: width ? width : 100,\n },\n });\n const classes = useStyles();\n\n const options: ApexOptions = {\n chart: {\n width: width ? width : 100,\n type: 'bar',\n animations: {\n enabled: false,\n },\n zoom: {\n enabled: false,\n },\n toolbar: {\n show: false,\n },\n sparkline: {\n enabled: true,\n },\n },\n tooltip: {\n enabled: false,\n },\n xaxis: {\n categories: categories,\n },\n };\n\n return (\n <Box className={classes.fixedBox}>\n <Chart options={options} series={series} type=\"bar\" height=\"100%\" />\n </Box>\n );\n};\n"],"names":[],"mappings":";;;;;AAOO,MAAM,oBAAgD,CAAC,EAAE,YAAY,MAAQ,EAAA,MAAA,EAAQ,OAAY,KAAA;AACtG,EAAA,MAAM,YAAY,UAAW,CAAA;AAAA,IAC3B,QAAU,EAAA;AAAA,MACR,OAAS,EAAA,MAAA;AAAA,MACT,MAAA,EAAQ,SAAS,MAAS,GAAA,EAAA;AAAA,MAC1B,KAAA,EAAO,QAAQ,KAAQ,GAAA,GAAA;AAAA,KACzB;AAAA,GACD,CAAA,CAAA;AACD,EAAA,MAAM,UAAU,SAAU,EAAA,CAAA;AAE1B,EAAA,MAAM,OAAuB,GAAA;AAAA,IAC3B,KAAO,EAAA;AAAA,MACL,KAAA,EAAO,QAAQ,KAAQ,GAAA,GAAA;AAAA,MACvB,IAAM,EAAA,KAAA;AAAA,MACN,UAAY,EAAA;AAAA,QACV,OAAS,EAAA,KAAA;AAAA,OACX;AAAA,MACA,IAAM,EAAA;AAAA,QACJ,OAAS,EAAA,KAAA;AAAA,OACX;AAAA,MACA,OAAS,EAAA;AAAA,QACP,IAAM,EAAA,KAAA;AAAA,OACR;AAAA,MACA,SAAW,EAAA;AAAA,QACT,OAAS,EAAA,IAAA;AAAA,OACX;AAAA,KACF;AAAA,IACA,OAAS,EAAA;AAAA,MACP,OAAS,EAAA,KAAA;AAAA,KACX;AAAA,IACA,KAAO,EAAA;AAAA,MACL,UAAA;AAAA,KACF;AAAA,GACF,CAAA;AAEA,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,GAAA,EAAA,EAAI,SAAW,EAAA,OAAA,CAAQ,QACtB,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,KAAM,EAAA,EAAA,OAAA,EAAkB,MAAgB,EAAA,IAAA,EAAK,KAAM,EAAA,MAAA,EAAO,QAAO,CACpE,CAAA,CAAA;AAEJ;;;;"}
|