@axis-backstage/plugin-statuspage 0.7.0 → 0.8.0
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/CHANGELOG.md +11 -0
- package/dist/components/ComponentGroupCard.esm.js +8 -2
- package/dist/components/ComponentGroupCard.esm.js.map +1 -1
- package/dist/components/ComponentGroupStatusChips.esm.js +2 -2
- package/dist/components/ComponentGroupStatusChips.esm.js.map +1 -1
- package/dist/components/ComponentGroupsList.esm.js +5 -5
- package/dist/components/ComponentGroupsList.esm.js.map +1 -1
- package/dist/components/ComponentsTable.esm.js +3 -3
- package/dist/components/ComponentsTable.esm.js.map +1 -1
- package/dist/components/StatusChip.esm.js +2 -2
- package/dist/components/StatusChip.esm.js.map +1 -1
- package/dist/components/StatuspageComponent.esm.js +9 -9
- package/dist/components/StatuspageComponent.esm.js.map +1 -1
- package/dist/components/StatuspageEntityCard.esm.js +21 -18
- package/dist/components/StatuspageEntityCard.esm.js.map +1 -1
- package/dist/index.d.ts +3 -5
- package/dist/index.esm.js +1 -1
- package/package.json +15 -12
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,16 @@
|
|
|
1
1
|
# @axis-backstage/plugin-statuspage
|
|
2
2
|
|
|
3
|
+
## 0.8.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- 86c01b7: Bumped to Backstage 1.40
|
|
8
|
+
|
|
9
|
+
### Patch Changes
|
|
10
|
+
|
|
11
|
+
- Updated dependencies [86c01b7]
|
|
12
|
+
- @axis-backstage/plugin-statuspage-common@0.7.0
|
|
13
|
+
|
|
3
14
|
## 0.7.0
|
|
4
15
|
|
|
5
16
|
### Minor Changes
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
2
|
import Accordion from '@mui/material/Accordion';
|
|
3
3
|
import AccordionDetails from '@mui/material/AccordionDetails';
|
|
4
4
|
import AccordionSummary from '@mui/material/AccordionSummary';
|
|
@@ -22,7 +22,13 @@ const ComponentGroupCard = ({
|
|
|
22
22
|
componentGroup,
|
|
23
23
|
expanded = false
|
|
24
24
|
}) => {
|
|
25
|
-
return /* @__PURE__ */
|
|
25
|
+
return /* @__PURE__ */ jsxs(DenseAccordion, { defaultExpanded: expanded, children: [
|
|
26
|
+
/* @__PURE__ */ jsxs(DenseAccordionSummary, { expandIcon: /* @__PURE__ */ jsx(ExpandMoreIcon, {}), children: [
|
|
27
|
+
/* @__PURE__ */ jsx(Typography, { variant: "subtitle1", children: componentGroup.name }),
|
|
28
|
+
/* @__PURE__ */ jsx(ComponentGroupStatusChips, { components })
|
|
29
|
+
] }),
|
|
30
|
+
/* @__PURE__ */ jsx(AccordionDetails, { children: /* @__PURE__ */ jsx(ComponentsTable, { components }) })
|
|
31
|
+
] }, componentGroup.id);
|
|
26
32
|
};
|
|
27
33
|
|
|
28
34
|
export { ComponentGroupCard };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComponentGroupCard.esm.js","sources":["../../src/components/ComponentGroupCard.tsx"],"sourcesContent":["import
|
|
1
|
+
{"version":3,"file":"ComponentGroupCard.esm.js","sources":["../../src/components/ComponentGroupCard.tsx"],"sourcesContent":["import Accordion from '@mui/material/Accordion';\nimport AccordionDetails from '@mui/material/AccordionDetails';\nimport AccordionSummary from '@mui/material/AccordionSummary';\nimport Typography from '@mui/material/Typography';\nimport { styled } from '@mui/material/styles';\nimport ExpandMoreIcon from '@mui/icons-material/ExpandMore';\nimport { ComponentsTable } from './ComponentsTable';\nimport { ComponentGroupStatusChips } from './ComponentGroupStatusChips';\nimport type {\n Component,\n ComponentGroup,\n} from '@axis-backstage/plugin-statuspage-common';\n\nexport type ComponentGroupProps = {\n components: Component[];\n componentGroup: ComponentGroup;\n expanded?: boolean;\n};\n\nconst DenseAccordion = styled(Accordion)({\n margin: '2px',\n borderRadius: '2px',\n});\n\nconst DenseAccordionSummary = styled(AccordionSummary)({\n '&.Mui-expanded': {\n minHeight: '48px !important',\n },\n});\n\nexport const ComponentGroupCard = ({\n components,\n componentGroup,\n expanded = false,\n}: ComponentGroupProps) => {\n return (\n <DenseAccordion key={componentGroup.id} defaultExpanded={expanded}>\n <DenseAccordionSummary expandIcon={<ExpandMoreIcon />}>\n <Typography variant=\"subtitle1\">{componentGroup.name}</Typography>\n <ComponentGroupStatusChips components={components} />\n </DenseAccordionSummary>\n <AccordionDetails>\n <ComponentsTable components={components} />\n </AccordionDetails>\n </DenseAccordion>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;;AAmBA,MAAM,cAAA,GAAiB,MAAO,CAAA,SAAS,CAAE,CAAA;AAAA,EACvC,MAAQ,EAAA,KAAA;AAAA,EACR,YAAc,EAAA;AAChB,CAAC,CAAA;AAED,MAAM,qBAAA,GAAwB,MAAO,CAAA,gBAAgB,CAAE,CAAA;AAAA,EACrD,gBAAkB,EAAA;AAAA,IAChB,SAAW,EAAA;AAAA;AAEf,CAAC,CAAA;AAEM,MAAM,qBAAqB,CAAC;AAAA,EACjC,UAAA;AAAA,EACA,cAAA;AAAA,EACA,QAAW,GAAA;AACb,CAA2B,KAAA;AACzB,EACE,uBAAA,IAAA,CAAC,cAAuC,EAAA,EAAA,eAAA,EAAiB,QACvD,EAAA,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,qBAAsB,EAAA,EAAA,UAAA,kBAAa,GAAA,CAAA,cAAA,EAAA,EAAe,CACjD,EAAA,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,UAAW,EAAA,EAAA,OAAA,EAAQ,WAAa,EAAA,QAAA,EAAA,cAAA,CAAe,IAAK,EAAA,CAAA;AAAA,sBACrD,GAAA,CAAC,6BAA0B,UAAwB,EAAA;AAAA,KACrD,EAAA,CAAA;AAAA,oBACC,GAAA,CAAA,gBAAA,EAAA,EACC,QAAC,kBAAA,GAAA,CAAA,eAAA,EAAA,EAAgB,YAAwB,CAC3C,EAAA;AAAA,GAAA,EAAA,EAPmB,eAAe,EAQpC,CAAA;AAEJ;;;;"}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { jsx, Fragment } from 'react/jsx-runtime';
|
|
2
2
|
import Grid from '@mui/material/Unstable_Grid2';
|
|
3
3
|
import { StatusChip } from './StatusChip.esm.js';
|
|
4
4
|
|
|
5
5
|
const ComponentGroupStatusChips = ({
|
|
6
6
|
components
|
|
7
|
-
}) => /* @__PURE__ */
|
|
7
|
+
}) => /* @__PURE__ */ jsx(Fragment, { children: components.some((component) => component.status !== "operational") ? components.filter((component) => component.status !== "operational").map((component) => /* @__PURE__ */ jsx(Grid, { padding: 0, alignSelf: "center", children: /* @__PURE__ */ jsx(StatusChip, { status: component.status }) }, component.id)) : /* @__PURE__ */ jsx(Grid, { padding: 0, alignSelf: "center", children: /* @__PURE__ */ jsx(StatusChip, { status: "operational" }) }) });
|
|
8
8
|
|
|
9
9
|
export { ComponentGroupStatusChips };
|
|
10
10
|
//# sourceMappingURL=ComponentGroupStatusChips.esm.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComponentGroupStatusChips.esm.js","sources":["../../src/components/ComponentGroupStatusChips.tsx"],"sourcesContent":["import
|
|
1
|
+
{"version":3,"file":"ComponentGroupStatusChips.esm.js","sources":["../../src/components/ComponentGroupStatusChips.tsx"],"sourcesContent":["import Grid from '@mui/material/Unstable_Grid2';\nimport { ComponentsTableProps } from './ComponentsTable';\nimport { StatusChip } from './StatusChip';\n\nexport const ComponentGroupStatusChips = ({\n components,\n}: ComponentsTableProps) => (\n <>\n {components.some(component => component.status !== 'operational') ? (\n components\n .filter(component => component.status !== 'operational')\n .map(component => (\n <Grid padding={0} alignSelf=\"center\" key={component.id}>\n <StatusChip status={component.status} />\n </Grid>\n ))\n ) : (\n <Grid padding={0} alignSelf=\"center\">\n <StatusChip status=\"operational\" />\n </Grid>\n )}\n </>\n);\n"],"names":[],"mappings":";;;;AAIO,MAAM,4BAA4B,CAAC;AAAA,EACxC;AACF,CACE,qBAAA,GAAA,CAAA,QAAA,EAAA,EACG,qBAAW,IAAK,CAAA,CAAA,SAAA,KAAa,UAAU,MAAW,KAAA,aAAa,IAC9D,UACG,CAAA,MAAA,CAAO,eAAa,SAAU,CAAA,MAAA,KAAW,aAAa,CACtD,CAAA,GAAA,CAAI,+BACF,GAAA,CAAA,IAAA,EAAA,EAAK,SAAS,CAAG,EAAA,SAAA,EAAU,UAC1B,QAAC,kBAAA,GAAA,CAAA,UAAA,EAAA,EAAW,QAAQ,SAAU,CAAA,MAAA,EAAQ,KADE,SAAU,CAAA,EAEpD,CACD,CAEH,mBAAA,GAAA,CAAC,QAAK,OAAS,EAAA,CAAA,EAAG,WAAU,QAC1B,EAAA,QAAA,kBAAA,GAAA,CAAC,cAAW,MAAO,EAAA,aAAA,EAAc,GACnC,CAEJ,EAAA;;;;"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { jsx } from 'react/jsx-runtime';
|
|
2
2
|
import Stack from '@mui/material/Stack';
|
|
3
3
|
import { ComponentGroupCard } from './ComponentGroupCard.esm.js';
|
|
4
4
|
|
|
@@ -7,15 +7,15 @@ const ComponentGroupsList = ({
|
|
|
7
7
|
componentGroups,
|
|
8
8
|
expanded
|
|
9
9
|
}) => {
|
|
10
|
-
return /* @__PURE__ */
|
|
10
|
+
return /* @__PURE__ */ jsx(Stack, { paddingTop: "10px", children: componentGroups.map((componentGroup) => /* @__PURE__ */ jsx(
|
|
11
11
|
ComponentGroupCard,
|
|
12
12
|
{
|
|
13
|
-
key: componentGroup.id,
|
|
14
13
|
componentGroup,
|
|
15
14
|
components: components.filter((c) => c.group_id === componentGroup.id),
|
|
16
15
|
expanded
|
|
17
|
-
}
|
|
18
|
-
|
|
16
|
+
},
|
|
17
|
+
componentGroup.id
|
|
18
|
+
)) });
|
|
19
19
|
};
|
|
20
20
|
|
|
21
21
|
export { ComponentGroupsList };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComponentGroupsList.esm.js","sources":["../../src/components/ComponentGroupsList.tsx"],"sourcesContent":["import
|
|
1
|
+
{"version":3,"file":"ComponentGroupsList.esm.js","sources":["../../src/components/ComponentGroupsList.tsx"],"sourcesContent":["import Stack from '@mui/material/Stack';\nimport { ComponentGroupCard } from './ComponentGroupCard';\nimport type {\n Component,\n ComponentGroup,\n} from '@axis-backstage/plugin-statuspage-common';\n\nexport type ComponentGroupListProps = {\n components: Component[];\n componentGroups: ComponentGroup[];\n expanded?: boolean;\n};\n\nexport const ComponentGroupsList = ({\n components,\n componentGroups,\n expanded,\n}: ComponentGroupListProps) => {\n return (\n <Stack paddingTop=\"10px\">\n {componentGroups.map(componentGroup => (\n <ComponentGroupCard\n key={componentGroup.id}\n componentGroup={componentGroup}\n components={components.filter(c => c.group_id === componentGroup.id)}\n expanded={expanded}\n />\n ))}\n </Stack>\n );\n};\n"],"names":[],"mappings":";;;;AAaO,MAAM,sBAAsB,CAAC;AAAA,EAClC,UAAA;AAAA,EACA,eAAA;AAAA,EACA;AACF,CAA+B,KAAA;AAC7B,EAAA,2BACG,KAAM,EAAA,EAAA,UAAA,EAAW,MACf,EAAA,QAAA,EAAA,eAAA,CAAgB,IAAI,CACnB,cAAA,qBAAA,GAAA;AAAA,IAAC,kBAAA;AAAA,IAAA;AAAA,MAEC,cAAA;AAAA,MACA,YAAY,UAAW,CAAA,MAAA,CAAO,OAAK,CAAE,CAAA,QAAA,KAAa,eAAe,EAAE,CAAA;AAAA,MACnE;AAAA,KAAA;AAAA,IAHK,cAAe,CAAA;AAAA,GAKvB,CACH,EAAA,CAAA;AAEJ;;;;"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { Table } from '@backstage/core-components';
|
|
3
3
|
import { StatusChip } from './StatusChip.esm.js';
|
|
4
4
|
|
|
@@ -8,11 +8,11 @@ const ComponentsTable = ({ components }) => {
|
|
|
8
8
|
{
|
|
9
9
|
title: "Status",
|
|
10
10
|
field: "status",
|
|
11
|
-
render: (rowData) => /* @__PURE__ */
|
|
11
|
+
render: (rowData) => /* @__PURE__ */ jsx(StatusChip, { status: rowData.status }),
|
|
12
12
|
align: "right"
|
|
13
13
|
}
|
|
14
14
|
];
|
|
15
|
-
return /* @__PURE__ */
|
|
15
|
+
return /* @__PURE__ */ jsx(
|
|
16
16
|
Table,
|
|
17
17
|
{
|
|
18
18
|
options: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComponentsTable.esm.js","sources":["../../src/components/ComponentsTable.tsx"],"sourcesContent":["import
|
|
1
|
+
{"version":3,"file":"ComponentsTable.esm.js","sources":["../../src/components/ComponentsTable.tsx"],"sourcesContent":["import { Table, TableColumn } from '@backstage/core-components';\nimport type { Component } from '@axis-backstage/plugin-statuspage-common';\nimport { StatusChip } from './StatusChip';\n\nexport type ComponentsTableProps = {\n components: Component[];\n};\n\nexport const ComponentsTable = ({ components }: ComponentsTableProps) => {\n // Columns definition\n const columns: TableColumn[] = [\n { title: 'System', field: 'name', id: 'id' },\n {\n title: 'Status',\n field: 'status',\n render: (rowData: any) => <StatusChip status={rowData.status} />,\n align: 'right',\n },\n ];\n\n return (\n <Table\n options={{\n search: false,\n paging: false,\n header: false,\n padding: 'dense',\n toolbar: false,\n }}\n columns={columns}\n data={components.map(({ name, status, id }) => ({ name, status, id }))}\n />\n );\n};\n"],"names":[],"mappings":";;;;AAQO,MAAM,eAAkB,GAAA,CAAC,EAAE,UAAA,EAAuC,KAAA;AAEvE,EAAA,MAAM,OAAyB,GAAA;AAAA,IAC7B,EAAE,KAAO,EAAA,QAAA,EAAU,KAAO,EAAA,MAAA,EAAQ,IAAI,IAAK,EAAA;AAAA,IAC3C;AAAA,MACE,KAAO,EAAA,QAAA;AAAA,MACP,KAAO,EAAA,QAAA;AAAA,MACP,QAAQ,CAAC,OAAA,yBAAkB,UAAW,EAAA,EAAA,MAAA,EAAQ,QAAQ,MAAQ,EAAA,CAAA;AAAA,MAC9D,KAAO,EAAA;AAAA;AACT,GACF;AAEA,EACE,uBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,OAAS,EAAA;AAAA,QACP,MAAQ,EAAA,KAAA;AAAA,QACR,MAAQ,EAAA,KAAA;AAAA,QACR,MAAQ,EAAA,KAAA;AAAA,QACR,OAAS,EAAA,OAAA;AAAA,QACT,OAAS,EAAA;AAAA,OACX;AAAA,MACA,OAAA;AAAA,MACA,IAAM,EAAA,UAAA,CAAW,GAAI,CAAA,CAAC,EAAE,IAAA,EAAM,MAAQ,EAAA,EAAA,EAAU,MAAA,EAAE,IAAM,EAAA,MAAA,EAAQ,IAAK,CAAA;AAAA;AAAA,GACvE;AAEJ;;;;"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { jsx } from 'react/jsx-runtime';
|
|
2
2
|
import Chip from '@mui/material/Chip';
|
|
3
3
|
|
|
4
4
|
const statusColorMap = {
|
|
@@ -9,7 +9,7 @@ const statusColorMap = {
|
|
|
9
9
|
major_outage: "error"
|
|
10
10
|
};
|
|
11
11
|
const formatStatusString = (status) => status.split("_").map((word) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase()).join(" ");
|
|
12
|
-
const StatusChip = ({ status }) => /* @__PURE__ */
|
|
12
|
+
const StatusChip = ({ status }) => /* @__PURE__ */ jsx(
|
|
13
13
|
Chip,
|
|
14
14
|
{
|
|
15
15
|
sx: { margin: "0 8px" },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StatusChip.esm.js","sources":["../../src/components/StatusChip.tsx"],"sourcesContent":["import
|
|
1
|
+
{"version":3,"file":"StatusChip.esm.js","sources":["../../src/components/StatusChip.tsx"],"sourcesContent":["import Chip from '@mui/material/Chip';\nimport type { ComponentStatus } from '@axis-backstage/plugin-statuspage-common';\n\n/**\n * Maps statuspage component statuses to MUI colors.\n *\n */\nconst statusColorMap: { [key in ComponentStatus]: string } = {\n under_maintenance: 'info',\n operational: 'success',\n degraded_performance: 'warning',\n partial_outage: 'warning',\n major_outage: 'error',\n};\n\ntype StatusChipProps = {\n status: ComponentStatus;\n};\n\nconst formatStatusString = (status: string): string =>\n status\n .split('_')\n .map(word => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase())\n .join(' ');\n\nexport const StatusChip = ({ status }: StatusChipProps) => (\n <Chip\n sx={{ margin: '0 8px' }}\n size=\"small\"\n label={formatStatusString(status)}\n color={statusColorMap[status] || ('default' as any)}\n />\n);\n"],"names":[],"mappings":";;;AAOA,MAAM,cAAuD,GAAA;AAAA,EAC3D,iBAAmB,EAAA,MAAA;AAAA,EACnB,WAAa,EAAA,SAAA;AAAA,EACb,oBAAsB,EAAA,SAAA;AAAA,EACtB,cAAgB,EAAA,SAAA;AAAA,EAChB,YAAc,EAAA;AAChB,CAAA;AAMA,MAAM,kBAAA,GAAqB,CAAC,MAC1B,KAAA,MAAA,CACG,MAAM,GAAG,CAAA,CACT,GAAI,CAAA,CAAA,IAAA,KAAQ,IAAK,CAAA,MAAA,CAAO,CAAC,CAAE,CAAA,WAAA,EAAgB,GAAA,IAAA,CAAK,KAAM,CAAA,CAAC,EAAE,WAAY,EAAC,CACtE,CAAA,IAAA,CAAK,GAAG,CAAA;AAEN,MAAM,UAAa,GAAA,CAAC,EAAE,MAAA,EAC3B,qBAAA,GAAA;AAAA,EAAC,IAAA;AAAA,EAAA;AAAA,IACC,EAAA,EAAI,EAAE,MAAA,EAAQ,OAAQ,EAAA;AAAA,IACtB,IAAK,EAAA,OAAA;AAAA,IACL,KAAA,EAAO,mBAAmB,MAAM,CAAA;AAAA,IAChC,KAAA,EAAO,cAAe,CAAA,MAAM,CAAM,IAAA;AAAA;AACpC;;;;"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { Progress, ResponseErrorPanel, InfoCard } from '@backstage/core-components';
|
|
3
3
|
import { ComponentGroupsList } from './ComponentGroupsList.esm.js';
|
|
4
4
|
import IconButton from '@mui/material/IconButton';
|
|
@@ -8,29 +8,29 @@ import { useComponents } from '../hooks/useComponents.esm.js';
|
|
|
8
8
|
const StatuspageComponent = ({ name }) => {
|
|
9
9
|
const { loading, error, value } = useComponents(name);
|
|
10
10
|
if (loading) {
|
|
11
|
-
return /* @__PURE__ */
|
|
11
|
+
return /* @__PURE__ */ jsx(Progress, {});
|
|
12
12
|
}
|
|
13
13
|
if (error) {
|
|
14
|
-
return /* @__PURE__ */
|
|
14
|
+
return /* @__PURE__ */ jsx(ResponseErrorPanel, { error });
|
|
15
15
|
}
|
|
16
|
-
const linkAction = value?.url && /* @__PURE__ */
|
|
16
|
+
const linkAction = value?.url && /* @__PURE__ */ jsx(
|
|
17
17
|
IconButton,
|
|
18
18
|
{
|
|
19
19
|
"aria-label": "Go to our statuspage",
|
|
20
20
|
role: "button",
|
|
21
21
|
title: "Go to statuspage(.io)",
|
|
22
22
|
href: value?.url,
|
|
23
|
-
target: "_blank"
|
|
24
|
-
|
|
25
|
-
|
|
23
|
+
target: "_blank",
|
|
24
|
+
children: /* @__PURE__ */ jsx(OpenInNewIcon, {})
|
|
25
|
+
}
|
|
26
26
|
);
|
|
27
|
-
return /* @__PURE__ */
|
|
27
|
+
return /* @__PURE__ */ jsx(InfoCard, { title: "Status of our services", action: linkAction, children: /* @__PURE__ */ jsx(
|
|
28
28
|
ComponentGroupsList,
|
|
29
29
|
{
|
|
30
30
|
components: value?.components || [],
|
|
31
31
|
componentGroups: value?.componentGroups || []
|
|
32
32
|
}
|
|
33
|
-
));
|
|
33
|
+
) });
|
|
34
34
|
};
|
|
35
35
|
|
|
36
36
|
export { StatuspageComponent };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StatuspageComponent.esm.js","sources":["../../src/components/StatuspageComponent.tsx"],"sourcesContent":["import
|
|
1
|
+
{"version":3,"file":"StatuspageComponent.esm.js","sources":["../../src/components/StatuspageComponent.tsx"],"sourcesContent":["import {\n InfoCard,\n Progress,\n ResponseErrorPanel,\n} from '@backstage/core-components';\nimport { ComponentGroupsList } from './ComponentGroupsList';\nimport IconButton from '@mui/material/IconButton';\nimport OpenInNewIcon from '@mui/icons-material/OpenInNew';\nimport { useComponents } from '../hooks/useComponents';\n\n/**\n * StatuspageComponent props.\n *\n * @public\n */\nexport type StatuspageProps = {\n name: string;\n};\n\n/**\n * Visualizes a full statuspage.\n *\n * @param name - instance name from app config.\n * @public\n */\nexport const StatuspageComponent = ({ name }: StatuspageProps) => {\n const { loading, error, value } = useComponents(name);\n\n if (loading) {\n return <Progress />;\n }\n if (error) {\n return <ResponseErrorPanel error={error} />;\n }\n\n const linkAction = value?.url && (\n <IconButton\n aria-label=\"Go to our statuspage\"\n role=\"button\"\n title=\"Go to statuspage(.io)\"\n href={value?.url}\n target=\"_blank\"\n >\n <OpenInNewIcon />\n </IconButton>\n );\n\n return (\n <InfoCard title=\"Status of our services\" action={linkAction}>\n <ComponentGroupsList\n components={value?.components || []}\n componentGroups={value?.componentGroups || []}\n />\n </InfoCard>\n );\n};\n"],"names":[],"mappings":";;;;;;;AAyBO,MAAM,mBAAsB,GAAA,CAAC,EAAE,IAAA,EAA4B,KAAA;AAChE,EAAA,MAAM,EAAE,OAAS,EAAA,KAAA,EAAO,KAAM,EAAA,GAAI,cAAc,IAAI,CAAA;AAEpD,EAAA,IAAI,OAAS,EAAA;AACX,IAAA,2BAAQ,QAAS,EAAA,EAAA,CAAA;AAAA;AAEnB,EAAA,IAAI,KAAO,EAAA;AACT,IAAO,uBAAA,GAAA,CAAC,sBAAmB,KAAc,EAAA,CAAA;AAAA;AAG3C,EAAM,MAAA,UAAA,GAAa,OAAO,GACxB,oBAAA,GAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,YAAW,EAAA,sBAAA;AAAA,MACX,IAAK,EAAA,QAAA;AAAA,MACL,KAAM,EAAA,uBAAA;AAAA,MACN,MAAM,KAAO,EAAA,GAAA;AAAA,MACb,MAAO,EAAA,QAAA;AAAA,MAEP,8BAAC,aAAc,EAAA,EAAA;AAAA;AAAA,GACjB;AAGF,EAAA,uBACG,GAAA,CAAA,QAAA,EAAA,EAAS,KAAM,EAAA,wBAAA,EAAyB,QAAQ,UAC/C,EAAA,QAAA,kBAAA,GAAA;AAAA,IAAC,mBAAA;AAAA,IAAA;AAAA,MACC,UAAA,EAAY,KAAO,EAAA,UAAA,IAAc,EAAC;AAAA,MAClC,eAAA,EAAiB,KAAO,EAAA,eAAA,IAAmB;AAAC;AAAA,GAEhD,EAAA,CAAA;AAEJ;;;;"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
2
|
import { Progress, ResponseErrorPanel, InfoCard } from '@backstage/core-components';
|
|
3
3
|
import OpenInNewIcon from '@mui/icons-material/OpenInNew';
|
|
4
4
|
import { useEntity } from '@backstage/plugin-catalog-react';
|
|
@@ -15,27 +15,27 @@ const StatuspageEntityCard = () => {
|
|
|
15
15
|
const wantedComponents = wantedComponentsStr?.split(",").map((it) => it.trim());
|
|
16
16
|
const { loading, error, value } = useComponents(name);
|
|
17
17
|
if (loading) {
|
|
18
|
-
return /* @__PURE__ */
|
|
18
|
+
return /* @__PURE__ */ jsx(Progress, {});
|
|
19
19
|
}
|
|
20
20
|
if (error) {
|
|
21
|
-
return /* @__PURE__ */
|
|
21
|
+
return /* @__PURE__ */ jsx(ResponseErrorPanel, { error });
|
|
22
22
|
}
|
|
23
23
|
if (loading) {
|
|
24
|
-
return /* @__PURE__ */
|
|
24
|
+
return /* @__PURE__ */ jsx(Progress, {});
|
|
25
25
|
}
|
|
26
26
|
if (error) {
|
|
27
|
-
return /* @__PURE__ */
|
|
27
|
+
return /* @__PURE__ */ jsx(ResponseErrorPanel, { error });
|
|
28
28
|
}
|
|
29
|
-
const linkAction = value?.url && /* @__PURE__ */
|
|
29
|
+
const linkAction = value?.url && /* @__PURE__ */ jsx(
|
|
30
30
|
IconButton,
|
|
31
31
|
{
|
|
32
32
|
"aria-label": "Go to our statuspage",
|
|
33
33
|
role: "button",
|
|
34
34
|
title: "Go to statuspage(.io)",
|
|
35
35
|
href: value?.url,
|
|
36
|
-
target: "_blank"
|
|
37
|
-
|
|
38
|
-
|
|
36
|
+
target: "_blank",
|
|
37
|
+
children: /* @__PURE__ */ jsx(OpenInNewIcon, {})
|
|
38
|
+
}
|
|
39
39
|
);
|
|
40
40
|
const fullStatuspage = !wantedComponents;
|
|
41
41
|
const filteredComponents = value?.components.filter(
|
|
@@ -46,16 +46,19 @@ const StatuspageEntityCard = () => {
|
|
|
46
46
|
) || [];
|
|
47
47
|
const noComponents = (!filteredComponents || filteredComponentGroups.length === 0) && filteredComponents && filteredComponents.length === 0;
|
|
48
48
|
if (noComponents) {
|
|
49
|
-
return /* @__PURE__ */
|
|
49
|
+
return /* @__PURE__ */ jsx(InfoCard, { title: "Service Status", action: linkAction, children: /* @__PURE__ */ jsx(Typography, { variant: "body2", color: "#FF5555", children: "The specified statuspage.io components could not be found. Check your annotation." }) });
|
|
50
50
|
}
|
|
51
|
-
return /* @__PURE__ */
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
51
|
+
return /* @__PURE__ */ jsxs(InfoCard, { title: "Service Status", action: linkAction, children: [
|
|
52
|
+
filteredComponents && filteredComponents.length > 0 && /* @__PURE__ */ jsx(ComponentsTable, { components: filteredComponents }),
|
|
53
|
+
filteredComponentGroups && filteredComponentGroups.length > 0 && /* @__PURE__ */ jsx(
|
|
54
|
+
ComponentGroupsList,
|
|
55
|
+
{
|
|
56
|
+
components: value?.components || [],
|
|
57
|
+
componentGroups: filteredComponentGroups,
|
|
58
|
+
expanded: !fullStatuspage
|
|
59
|
+
}
|
|
60
|
+
)
|
|
61
|
+
] });
|
|
59
62
|
};
|
|
60
63
|
|
|
61
64
|
export { StatuspageEntityCard };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StatuspageEntityCard.esm.js","sources":["../../src/components/StatuspageEntityCard.tsx"],"sourcesContent":["import
|
|
1
|
+
{"version":3,"file":"StatuspageEntityCard.esm.js","sources":["../../src/components/StatuspageEntityCard.tsx"],"sourcesContent":["import {\n InfoCard,\n Progress,\n ResponseErrorPanel,\n} from '@backstage/core-components';\nimport OpenInNewIcon from '@mui/icons-material/OpenInNew';\nimport { useEntity } from '@backstage/plugin-catalog-react';\nimport { ComponentsTable } from './ComponentsTable';\nimport { ComponentGroupsList } from './ComponentGroupsList';\nimport IconButton from '@mui/material/IconButton';\nimport Typography from '@mui/material/Typography';\nimport { STATUSPAGE_ANNOTATION } from '@axis-backstage/plugin-statuspage-common';\nimport { useComponents } from '../hooks/useComponents';\n\n/**\n * Statuspage card intended for the EntityPage. Allows embedding of specific\n * statuspage components and component groups.\n *\n * @public\n */\nexport const StatuspageEntityCard = () => {\n const { entity } = useEntity();\n const [name, wantedComponentsStr] =\n entity.metadata.annotations?.[STATUSPAGE_ANNOTATION]?.split(':')!;\n const wantedComponents = wantedComponentsStr?.split(',').map(it => it.trim());\n\n const { loading, error, value } = useComponents(name);\n\n if (loading) {\n return <Progress />;\n }\n if (error) {\n return <ResponseErrorPanel error={error} />;\n }\n\n if (loading) {\n return <Progress />;\n }\n if (error) {\n return <ResponseErrorPanel error={error} />;\n }\n\n const linkAction = value?.url && (\n <IconButton\n aria-label=\"Go to our statuspage\"\n role=\"button\"\n title=\"Go to statuspage(.io)\"\n href={value?.url}\n target=\"_blank\"\n >\n <OpenInNewIcon />\n </IconButton>\n );\n\n const fullStatuspage = !wantedComponents;\n const filteredComponents =\n value?.components.filter(\n c => !fullStatuspage && !c.group && wantedComponents.includes(c.id),\n ) || [];\n const filteredComponentGroups =\n value?.componentGroups.filter(\n c => fullStatuspage || wantedComponents.includes(c.id),\n ) || [];\n const noComponents =\n (!filteredComponents || filteredComponentGroups.length === 0) &&\n filteredComponents &&\n filteredComponents.length === 0;\n\n if (noComponents) {\n return (\n <InfoCard title=\"Service Status\" action={linkAction}>\n <Typography variant=\"body2\" color=\"#FF5555\">\n The specified statuspage.io components could not be found. Check your\n annotation.\n </Typography>\n </InfoCard>\n );\n }\n return (\n <InfoCard title=\"Service Status\" action={linkAction}>\n {filteredComponents && filteredComponents.length > 0 && (\n <ComponentsTable components={filteredComponents} />\n )}\n {filteredComponentGroups && filteredComponentGroups.length > 0 && (\n <ComponentGroupsList\n components={value?.components || []}\n componentGroups={filteredComponentGroups}\n expanded={!fullStatuspage}\n />\n )}\n </InfoCard>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;;;AAoBO,MAAM,uBAAuB,MAAM;AACxC,EAAM,MAAA,EAAE,MAAO,EAAA,GAAI,SAAU,EAAA;AAC7B,EAAM,MAAA,CAAC,IAAM,EAAA,mBAAmB,CAC9B,GAAA,MAAA,CAAO,SAAS,WAAc,GAAA,qBAAqB,CAAG,EAAA,KAAA,CAAM,GAAG,CAAA;AACjE,EAAM,MAAA,gBAAA,GAAmB,qBAAqB,KAAM,CAAA,GAAG,EAAE,GAAI,CAAA,CAAA,EAAA,KAAM,EAAG,CAAA,IAAA,EAAM,CAAA;AAE5E,EAAA,MAAM,EAAE,OAAS,EAAA,KAAA,EAAO,KAAM,EAAA,GAAI,cAAc,IAAI,CAAA;AAEpD,EAAA,IAAI,OAAS,EAAA;AACX,IAAA,2BAAQ,QAAS,EAAA,EAAA,CAAA;AAAA;AAEnB,EAAA,IAAI,KAAO,EAAA;AACT,IAAO,uBAAA,GAAA,CAAC,sBAAmB,KAAc,EAAA,CAAA;AAAA;AAG3C,EAAA,IAAI,OAAS,EAAA;AACX,IAAA,2BAAQ,QAAS,EAAA,EAAA,CAAA;AAAA;AAEnB,EAAA,IAAI,KAAO,EAAA;AACT,IAAO,uBAAA,GAAA,CAAC,sBAAmB,KAAc,EAAA,CAAA;AAAA;AAG3C,EAAM,MAAA,UAAA,GAAa,OAAO,GACxB,oBAAA,GAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,YAAW,EAAA,sBAAA;AAAA,MACX,IAAK,EAAA,QAAA;AAAA,MACL,KAAM,EAAA,uBAAA;AAAA,MACN,MAAM,KAAO,EAAA,GAAA;AAAA,MACb,MAAO,EAAA,QAAA;AAAA,MAEP,8BAAC,aAAc,EAAA,EAAA;AAAA;AAAA,GACjB;AAGF,EAAA,MAAM,iBAAiB,CAAC,gBAAA;AACxB,EAAM,MAAA,kBAAA,GACJ,OAAO,UAAW,CAAA,MAAA;AAAA,IAChB,CAAA,CAAA,KAAK,CAAC,cAAkB,IAAA,CAAC,EAAE,KAAS,IAAA,gBAAA,CAAiB,QAAS,CAAA,CAAA,CAAE,EAAE;AAAA,OAC/D,EAAC;AACR,EAAM,MAAA,uBAAA,GACJ,OAAO,eAAgB,CAAA,MAAA;AAAA,IACrB,CAAK,CAAA,KAAA,cAAA,IAAkB,gBAAiB,CAAA,QAAA,CAAS,EAAE,EAAE;AAAA,OAClD,EAAC;AACR,EAAM,MAAA,YAAA,GAAA,CACH,CAAC,kBAAsB,IAAA,uBAAA,CAAwB,WAAW,CAC3D,KAAA,kBAAA,IACA,mBAAmB,MAAW,KAAA,CAAA;AAEhC,EAAA,IAAI,YAAc,EAAA;AAChB,IAAA,uBACG,GAAA,CAAA,QAAA,EAAA,EAAS,KAAM,EAAA,gBAAA,EAAiB,MAAQ,EAAA,UAAA,EACvC,QAAC,kBAAA,GAAA,CAAA,UAAA,EAAA,EAAW,OAAQ,EAAA,OAAA,EAAQ,KAAM,EAAA,SAAA,EAAU,+FAG5C,CACF,EAAA,CAAA;AAAA;AAGJ,EAAA,uBACG,IAAA,CAAA,QAAA,EAAA,EAAS,KAAM,EAAA,gBAAA,EAAiB,QAAQ,UACtC,EAAA,QAAA,EAAA;AAAA,IAAA,kBAAA,IAAsB,mBAAmB,MAAS,GAAA,CAAA,oBAChD,GAAA,CAAA,eAAA,EAAA,EAAgB,YAAY,kBAAoB,EAAA,CAAA;AAAA,IAElD,uBAAA,IAA2B,uBAAwB,CAAA,MAAA,GAAS,CAC3D,oBAAA,GAAA;AAAA,MAAC,mBAAA;AAAA,MAAA;AAAA,QACC,UAAA,EAAY,KAAO,EAAA,UAAA,IAAc,EAAC;AAAA,QAClC,eAAiB,EAAA,uBAAA;AAAA,QACjB,UAAU,CAAC;AAAA;AAAA;AACb,GAEJ,EAAA,CAAA;AAEJ;;;;"}
|
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
import * as React from 'react';
|
|
3
|
-
import React__default from 'react';
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
4
2
|
import * as _backstage_core_plugin_api from '@backstage/core-plugin-api';
|
|
5
3
|
import { DiscoveryApi, FetchApi } from '@backstage/core-plugin-api';
|
|
6
4
|
import { Entity } from '@backstage/catalog-model';
|
|
@@ -34,7 +32,7 @@ declare const statuspagePlugin: _backstage_core_plugin_api.BackstagePlugin<{
|
|
|
34
32
|
*
|
|
35
33
|
* @public
|
|
36
34
|
*/
|
|
37
|
-
declare const StatuspagePage: ({ name }: StatuspageProps) =>
|
|
35
|
+
declare const StatuspagePage: ({ name }: StatuspageProps) => react_jsx_runtime.JSX.Element;
|
|
38
36
|
|
|
39
37
|
/**
|
|
40
38
|
* Statuspage card intended for the EntityPage. Allows embedding of specific
|
|
@@ -42,7 +40,7 @@ declare const StatuspagePage: ({ name }: StatuspageProps) => React.JSX.Element;
|
|
|
42
40
|
*
|
|
43
41
|
* @public
|
|
44
42
|
*/
|
|
45
|
-
declare const StatuspageEntityCard: () =>
|
|
43
|
+
declare const StatuspageEntityCard: () => react_jsx_runtime.JSX.Element;
|
|
46
44
|
|
|
47
45
|
/**
|
|
48
46
|
* The definition for the statuspage api.
|
package/dist/index.esm.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
export { StatuspagePage, isStatuspageAvailable, statuspagePlugin } from './plugin.esm.js';
|
|
2
2
|
export { StatuspageEntityCard } from './components/StatuspageEntityCard.esm.js';
|
|
3
3
|
import './components/ComponentGroupCard.esm.js';
|
|
4
|
-
import 'react';
|
|
4
|
+
import 'react/jsx-runtime';
|
|
5
5
|
import '@mui/material/Stack';
|
|
6
6
|
import '@backstage/core-components';
|
|
7
7
|
import '@mui/material/Chip';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@axis-backstage/plugin-statuspage",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.8.0",
|
|
4
4
|
"main": "dist/index.esm.js",
|
|
5
5
|
"types": "dist/index.d.ts",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -30,30 +30,33 @@
|
|
|
30
30
|
"postpack": "backstage-cli package postpack"
|
|
31
31
|
},
|
|
32
32
|
"dependencies": {
|
|
33
|
-
"@axis-backstage/plugin-statuspage-common": "^0.
|
|
34
|
-
"@backstage/catalog-model": "^1.7.
|
|
35
|
-
"@backstage/core-components": "^0.
|
|
36
|
-
"@backstage/core-plugin-api": "^1.10.
|
|
37
|
-
"@backstage/plugin-catalog-react": "^1.
|
|
33
|
+
"@axis-backstage/plugin-statuspage-common": "^0.7.0",
|
|
34
|
+
"@backstage/catalog-model": "^1.7.4",
|
|
35
|
+
"@backstage/core-components": "^0.17.3",
|
|
36
|
+
"@backstage/core-plugin-api": "^1.10.8",
|
|
37
|
+
"@backstage/plugin-catalog-react": "^1.19.0",
|
|
38
38
|
"@mui/icons-material": "^5.15.7",
|
|
39
39
|
"@mui/material": "^5.15.7",
|
|
40
40
|
"react-use": "^17.2.4"
|
|
41
41
|
},
|
|
42
42
|
"peerDependencies": {
|
|
43
|
-
"react": "^17.0.0
|
|
43
|
+
"@types/react": "^17.0.0 || ^18.0.0",
|
|
44
|
+
"react": "^17.0.0 || ^18.0.0",
|
|
45
|
+
"react-dom": "^17.0.0 || ^18.0.0",
|
|
46
|
+
"react-router-dom": "^6.3.0"
|
|
44
47
|
},
|
|
45
48
|
"devDependencies": {
|
|
46
|
-
"@backstage/cli": "^0.
|
|
47
|
-
"@backstage/dev-utils": "^1.1.
|
|
48
|
-
"@testing-library/jest-dom": "^
|
|
49
|
+
"@backstage/cli": "^0.33.0",
|
|
50
|
+
"@backstage/dev-utils": "^1.1.11",
|
|
51
|
+
"@testing-library/jest-dom": "^6.0.0"
|
|
49
52
|
},
|
|
50
53
|
"files": [
|
|
51
54
|
"dist"
|
|
52
55
|
],
|
|
53
56
|
"typesVersions": {
|
|
54
57
|
"*": {
|
|
55
|
-
"
|
|
56
|
-
"
|
|
58
|
+
"package.json": [
|
|
59
|
+
"package.json"
|
|
57
60
|
]
|
|
58
61
|
}
|
|
59
62
|
},
|