@pagerduty/backstage-plugin 0.13.0-next.10 → 0.13.0-next.12
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.
|
@@ -3,7 +3,7 @@ import { Typography, Box, DialogTitle, DialogContent, DialogActions, Tooltip, Ic
|
|
|
3
3
|
import EditIcon from '@mui/icons-material/Edit';
|
|
4
4
|
import { useApi } from '@backstage/core-plugin-api';
|
|
5
5
|
import { pagerDutyApiRef } from '../../api/client.esm.js';
|
|
6
|
-
import { QueryClient,
|
|
6
|
+
import { QueryClient, QueryClientProvider, useQuery, useMutation } from '@tanstack/react-query';
|
|
7
7
|
import { useMaterialReactTable, MRT_EditActionButtons, MaterialReactTable } from 'material-react-table';
|
|
8
8
|
import { catalogApiRef } from '@backstage/plugin-catalog-react';
|
|
9
9
|
import OpenInBrowserIcon from '@material-ui/icons/OpenInBrowser';
|
|
@@ -33,9 +33,9 @@ function makeReadable(status) {
|
|
|
33
33
|
}
|
|
34
34
|
}
|
|
35
35
|
const ServiceMappingComponent = () => {
|
|
36
|
+
const [entityOptions, setEntityOptions] = useState([]);
|
|
36
37
|
const pagerDutyApi = useApi(pagerDutyApiRef);
|
|
37
38
|
const catalogApi = useApi(catalogApiRef);
|
|
38
|
-
const queryClient = new QueryClient();
|
|
39
39
|
async function fetchMappings() {
|
|
40
40
|
const { mappings: foundMappings } = await pagerDutyApi.getEntityMappings();
|
|
41
41
|
return foundMappings;
|
|
@@ -57,88 +57,6 @@ const ServiceMappingComponent = () => {
|
|
|
57
57
|
});
|
|
58
58
|
return entities;
|
|
59
59
|
}
|
|
60
|
-
const {
|
|
61
|
-
data: fetchedMappings = [],
|
|
62
|
-
isError: isLoadingMappingsError,
|
|
63
|
-
isFetching: isFetchingMappings,
|
|
64
|
-
isLoading: isLoadingMappings
|
|
65
|
-
} = useGetMappings();
|
|
66
|
-
const {
|
|
67
|
-
data: fetchedCatalogEntities = [],
|
|
68
|
-
isError: isLoadingCatalogEntitiesError,
|
|
69
|
-
isFetching: isFetchingCatalogEntities,
|
|
70
|
-
isLoading: isLoadingCatalogEntities
|
|
71
|
-
} = useGetCatalogEntities();
|
|
72
|
-
function getCatalogEntityOptions() {
|
|
73
|
-
const options = [];
|
|
74
|
-
options.push({ value: "", label: "None" });
|
|
75
|
-
fetchedCatalogEntities.forEach((entity) => {
|
|
76
|
-
const foundEntity = fetchedMappings.find(
|
|
77
|
-
(item) => item.entityRef === entity.id
|
|
78
|
-
);
|
|
79
|
-
if (!foundEntity) {
|
|
80
|
-
options.push({
|
|
81
|
-
value: entity.id,
|
|
82
|
-
label: entity.name
|
|
83
|
-
});
|
|
84
|
-
}
|
|
85
|
-
});
|
|
86
|
-
return options;
|
|
87
|
-
}
|
|
88
|
-
function useGetMappings() {
|
|
89
|
-
return useQuery({
|
|
90
|
-
queryKey: ["mappings"],
|
|
91
|
-
queryFn: async () => fetchMappings(),
|
|
92
|
-
refetchOnWindowFocus: false
|
|
93
|
-
});
|
|
94
|
-
}
|
|
95
|
-
function useGetCatalogEntities() {
|
|
96
|
-
return useQuery({
|
|
97
|
-
queryKey: ["entities"],
|
|
98
|
-
queryFn: async () => fetchCatalogEntities(),
|
|
99
|
-
refetchOnMount: false,
|
|
100
|
-
refetchOnWindowFocus: false,
|
|
101
|
-
refetchOnReconnect: false
|
|
102
|
-
});
|
|
103
|
-
}
|
|
104
|
-
function useUpdateMapping() {
|
|
105
|
-
return useMutation({
|
|
106
|
-
mutationFn: async (mapping) => {
|
|
107
|
-
return await pagerDutyApi.storeServiceMapping(
|
|
108
|
-
mapping.serviceId,
|
|
109
|
-
mapping.entityRef
|
|
110
|
-
);
|
|
111
|
-
}
|
|
112
|
-
// client side optimistic update
|
|
113
|
-
// onMutate: (newMappingInfo: PagerDutyEntityMapping) => {
|
|
114
|
-
// queryClient.setQueryData(["updateMappings"], (prevMappings: any) =>
|
|
115
|
-
// prevMappings?.map((prevMapping: PagerDutyEntityMapping) => {
|
|
116
|
-
// if (prevMapping.serviceId === newMappingInfo.serviceId) {
|
|
117
|
-
// newMappingInfo.entityName =
|
|
118
|
-
// fetchedCatalogEntities.find(
|
|
119
|
-
// (entity) => entity.id === newMappingInfo.entityRef
|
|
120
|
-
// )?.name || "";
|
|
121
|
-
// return newMappingInfo;
|
|
122
|
-
// }
|
|
123
|
-
// return prevMapping;
|
|
124
|
-
// })
|
|
125
|
-
// );
|
|
126
|
-
// },
|
|
127
|
-
});
|
|
128
|
-
}
|
|
129
|
-
const { mutateAsync: updateMapping, isPending: isUpdatingMapping } = useUpdateMapping();
|
|
130
|
-
const handleSaveMapping = async ({ values, table }) => {
|
|
131
|
-
var _a;
|
|
132
|
-
values.entityName = ((_a = fetchedCatalogEntities.find(
|
|
133
|
-
(entity) => entity.id === values.entityRef
|
|
134
|
-
)) == null ? void 0 : _a.name) || "";
|
|
135
|
-
values.status = "RefreshToUpdate";
|
|
136
|
-
await updateMapping(values);
|
|
137
|
-
table.setEditingRow(null);
|
|
138
|
-
};
|
|
139
|
-
const openInBrowser = (url) => {
|
|
140
|
-
window.open(url, "_blank", "noreferrer");
|
|
141
|
-
};
|
|
142
60
|
const DenseTable = () => {
|
|
143
61
|
const [validationErrors, setValidationErrors] = useState({});
|
|
144
62
|
const columns = useMemo(
|
|
@@ -171,7 +89,7 @@ const ServiceMappingComponent = () => {
|
|
|
171
89
|
header: "Mapping",
|
|
172
90
|
visibleInShowHideMenu: false,
|
|
173
91
|
editVariant: "select",
|
|
174
|
-
editSelectOptions:
|
|
92
|
+
editSelectOptions: entityOptions,
|
|
175
93
|
muiEditTextFieldProps: {
|
|
176
94
|
select: true,
|
|
177
95
|
error: !!(validationErrors == null ? void 0 : validationErrors.state),
|
|
@@ -211,6 +129,69 @@ const ServiceMappingComponent = () => {
|
|
|
211
129
|
],
|
|
212
130
|
[validationErrors]
|
|
213
131
|
);
|
|
132
|
+
const {
|
|
133
|
+
data: fetchedMappings = [],
|
|
134
|
+
isError: isLoadingMappingsError,
|
|
135
|
+
isFetching: isFetchingMappings,
|
|
136
|
+
isLoading: isLoadingMappings
|
|
137
|
+
} = useGetMappings();
|
|
138
|
+
const {
|
|
139
|
+
data: fetchedCatalogEntities = [],
|
|
140
|
+
isError: isLoadingCatalogEntitiesError,
|
|
141
|
+
isFetching: isFetchingCatalogEntities,
|
|
142
|
+
isLoading: isLoadingCatalogEntities
|
|
143
|
+
} = useGetCatalogEntities();
|
|
144
|
+
function useGetMappings() {
|
|
145
|
+
return useQuery({
|
|
146
|
+
queryKey: ["mappings"],
|
|
147
|
+
queryFn: async () => fetchMappings(),
|
|
148
|
+
refetchOnWindowFocus: false
|
|
149
|
+
});
|
|
150
|
+
}
|
|
151
|
+
function useGetCatalogEntities() {
|
|
152
|
+
return useQuery({
|
|
153
|
+
queryKey: ["entities"],
|
|
154
|
+
queryFn: async () => fetchCatalogEntities(),
|
|
155
|
+
refetchOnMount: false,
|
|
156
|
+
refetchOnWindowFocus: false,
|
|
157
|
+
refetchOnReconnect: false
|
|
158
|
+
});
|
|
159
|
+
}
|
|
160
|
+
function useUpdateMapping() {
|
|
161
|
+
return useMutation({
|
|
162
|
+
mutationFn: async (mapping) => {
|
|
163
|
+
return await pagerDutyApi.storeServiceMapping(
|
|
164
|
+
mapping.serviceId,
|
|
165
|
+
mapping.entityRef
|
|
166
|
+
);
|
|
167
|
+
}
|
|
168
|
+
// client side optimistic update
|
|
169
|
+
// onMutate: (newMappingInfo: PagerDutyEntityMapping) => {
|
|
170
|
+
// queryClient.setQueryData(["updateMappings"], (prevMappings: any) =>
|
|
171
|
+
// prevMappings?.map((prevMapping: PagerDutyEntityMapping) => {
|
|
172
|
+
// if (prevMapping.serviceId === newMappingInfo.serviceId) {
|
|
173
|
+
// newMappingInfo.entityName =
|
|
174
|
+
// fetchedCatalogEntities.find(
|
|
175
|
+
// (entity) => entity.id === newMappingInfo.entityRef
|
|
176
|
+
// )?.name || "";
|
|
177
|
+
// return newMappingInfo;
|
|
178
|
+
// }
|
|
179
|
+
// return prevMapping;
|
|
180
|
+
// })
|
|
181
|
+
// );
|
|
182
|
+
// },
|
|
183
|
+
});
|
|
184
|
+
}
|
|
185
|
+
const { mutateAsync: updateMapping, isPending: isUpdatingMapping } = useUpdateMapping();
|
|
186
|
+
const handleSaveMapping = async ({ values, table }) => {
|
|
187
|
+
setValidationErrors({});
|
|
188
|
+
values.status = "RefreshToUpdate";
|
|
189
|
+
await updateMapping(values);
|
|
190
|
+
table.setEditingRow(null);
|
|
191
|
+
};
|
|
192
|
+
const openInBrowser = (url) => {
|
|
193
|
+
window.open(url, "_blank", "noreferrer");
|
|
194
|
+
};
|
|
214
195
|
const dataTable = useMaterialReactTable({
|
|
215
196
|
columns,
|
|
216
197
|
data: fetchedMappings,
|
|
@@ -253,8 +234,26 @@ const ServiceMappingComponent = () => {
|
|
|
253
234
|
}
|
|
254
235
|
}
|
|
255
236
|
});
|
|
237
|
+
function getCatalogEntityOptions() {
|
|
238
|
+
const options = [];
|
|
239
|
+
options.push({ value: "", label: "None" });
|
|
240
|
+
fetchedCatalogEntities.forEach((entity) => {
|
|
241
|
+
const foundEntity = fetchedMappings.find(
|
|
242
|
+
(item) => item.entityRef === entity.id
|
|
243
|
+
);
|
|
244
|
+
if (!foundEntity) {
|
|
245
|
+
options.push({
|
|
246
|
+
value: entity.id,
|
|
247
|
+
label: entity.name
|
|
248
|
+
});
|
|
249
|
+
}
|
|
250
|
+
});
|
|
251
|
+
setEntityOptions(options);
|
|
252
|
+
}
|
|
253
|
+
getCatalogEntityOptions();
|
|
256
254
|
return /* @__PURE__ */ React.createElement(MaterialReactTable, { table: dataTable });
|
|
257
255
|
};
|
|
256
|
+
const queryClient = new QueryClient();
|
|
258
257
|
return /* @__PURE__ */ React.createElement(QueryClientProvider, { client: queryClient }, /* @__PURE__ */ React.createElement(DenseTable, null));
|
|
259
258
|
};
|
|
260
259
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ServiceMappingComponent.esm.js","sources":["../../../src/components/PagerDutyPage/ServiceMappingComponent.tsx"],"sourcesContent":["import React, { useMemo, useState } from \"react\";\nimport {\n Box,\n DialogActions,\n DialogContent,\n DialogTitle,\n IconButton,\n Tooltip,\n Typography,\n} from \"@material-ui/core\";\nimport EditIcon from \"@mui/icons-material/Edit\";\nimport { PagerDutyEntityMapping } from \"@pagerduty/backstage-plugin-common\";\nimport { useApi } from \"@backstage/core-plugin-api\";\nimport { pagerDutyApiRef } from \"../../api\";\nimport {\n QueryClient,\n QueryClientProvider,\n useMutation,\n // useQueries,\n useQuery,\n} from \"@tanstack/react-query\";\nimport {\n MRT_ColumnDef,\n MRT_EditActionButtons,\n MRT_TableOptions,\n MaterialReactTable,\n useMaterialReactTable,\n} from \"material-react-table\";\nimport { catalogApiRef } from \"@backstage/plugin-catalog-react\";\nimport OpenInBrowser from \"@material-ui/icons/OpenInBrowser\";\n\ntype Service = {\n name: string; // \"Ads\"\n id: string; // \"QWe1j283n12j132\"\n system: string; // \"Production\"\n owner: string; // \"Mapped\"\n lifecycle: string; // \"Ads\"\n};\n\nfunction getColorFromStatus(status?: string) {\n switch (status) {\n case \"InSync\":\n return \"green\";\n case \"OutOfSync\":\n return \"red\";\n case \"NotMapped\":\n return \"orange\";\n default:\n return \"gray\";\n }\n}\n\nfunction makeReadable(status?: string) {\n switch (status) {\n case \"InSync\":\n return \"In Sync\";\n case \"OutOfSync\":\n return \"Out of Sync\";\n case \"NotMapped\":\n return \"Not Mapped\";\n default:\n return \"Refresh to Update\";\n }\n}\n\nexport const ServiceMappingComponent = () => {\n // const [_, setEntityMappings] = useState<\n // PagerDutyEntityMapping[]\n // >([]);\n // const [catalogEntities, setCatalogEntities] = useState<Service[]>([]);\n // const [entityOptions, setEntityOptions] = useState<CatalogEntityOptions[]>([]);\n\n const pagerDutyApi = useApi(pagerDutyApiRef);\n const catalogApi = useApi(catalogApiRef);\n \n const queryClient = new QueryClient();\n\n // function fetchCatalogEntities() {\n // catalogApi\n // .getEntities({\n // filter: { kind: \"Component\" },\n // })\n // .then((result) => {\n // const entities: Service[] = [];\n // result.items.forEach((entity: any) => {\n // entities.push({\n // name: entity.metadata?.name,\n // id: entity.metadata?.uid ?? \"\",\n // system: JSON.stringify(entity.spec?.system) || \"\",\n // owner: JSON.stringify(entity.spec?.owner) || \"\",\n // lifecycle: JSON.stringify(entity.spec?.lifecycle) || \"\",\n // });\n // });\n\n // setCatalogEntities(entities);\n // });\n // }\n\n async function fetchMappings(): Promise<PagerDutyEntityMapping[]> {\n const { mappings: foundMappings } = await pagerDutyApi.getEntityMappings();\n\n // setEntityMappings(foundMappings);\n\n return foundMappings;\n }\n\n async function fetchCatalogEntities(): Promise<Service[]> {\n // if (catalogEntities.length === 0) {\n const result = await catalogApi.getEntities({\n filter: { kind: \"Component\" },\n });\n\n const entities: Service[] = [];\n result.items.forEach((entity: any) => {\n entities.push({\n name: entity.metadata?.name,\n id: entity.metadata?.uid ?? \"\",\n system: JSON.stringify(entity.spec?.system) || \"\",\n owner: JSON.stringify(entity.spec?.owner) || \"\",\n lifecycle: JSON.stringify(entity.spec?.lifecycle) || \"\",\n });\n });\n\n // setCatalogEntities(entities);\n\n return entities;\n // }\n\n // return catalogEntities;\n }\n\n type CatalogEntityOptions = {\n value: string;\n label: string;\n };\n\n // call READ hook\n const {\n data: fetchedMappings = [],\n isError: isLoadingMappingsError,\n isFetching: isFetchingMappings,\n isLoading: isLoadingMappings,\n } = useGetMappings();\n\n // call READ hook\n const {\n data: fetchedCatalogEntities = [],\n isError: isLoadingCatalogEntitiesError,\n isFetching: isFetchingCatalogEntities,\n isLoading: isLoadingCatalogEntities,\n } = useGetCatalogEntities();\n\n function getCatalogEntityOptions(): CatalogEntityOptions[] {\n const options: CatalogEntityOptions[] = [];\n // if (entityOptions.length === 0) {\n // initialize with empty object\n options.push({ value: \"\", label: \"None\" });\n // }\n\n fetchedCatalogEntities.forEach((entity) => {\n // find entity with entity.id in entityMappings array\n const foundEntity = fetchedMappings.find(\n (item) => item.entityRef === entity.id\n );\n\n if (!foundEntity) {\n options.push({\n value: entity.id,\n label: entity.name,\n });\n }\n });\n\n // setEntityOptions(options);\n\n return options;\n }\n\n function useGetMappings() {\n return useQuery<PagerDutyEntityMapping[]>({\n queryKey: [\"mappings\"],\n queryFn: async () => fetchMappings(),\n refetchOnWindowFocus: false,\n });\n }\n\n // READ hook (get catalog entities from api)\n function useGetCatalogEntities() {\n return useQuery<Service[]>({\n queryKey: [\"entities\"],\n queryFn: async () => fetchCatalogEntities(),\n refetchOnMount: false,\n refetchOnWindowFocus: false,\n refetchOnReconnect: false,\n });\n }\n\n // UPDATE hook (put mapping in api)\n function useUpdateMapping() {\n // const queryClient = useQueryClient();\n return useMutation({\n mutationFn: async (mapping: PagerDutyEntityMapping) => {\n return await pagerDutyApi.storeServiceMapping(\n mapping.serviceId,\n mapping.entityRef\n );\n },\n // client side optimistic update\n // onMutate: (newMappingInfo: PagerDutyEntityMapping) => {\n // queryClient.setQueryData([\"updateMappings\"], (prevMappings: any) =>\n // prevMappings?.map((prevMapping: PagerDutyEntityMapping) => {\n // if (prevMapping.serviceId === newMappingInfo.serviceId) {\n // newMappingInfo.entityName =\n // fetchedCatalogEntities.find(\n // (entity) => entity.id === newMappingInfo.entityRef\n // )?.name || \"\";\n\n // return newMappingInfo;\n // }\n // return prevMapping;\n // })\n // );\n // },\n });\n }\n\n // call UPDATE hook\n const { mutateAsync: updateMapping, isPending: isUpdatingMapping } =\n useUpdateMapping();\n\n // UPDATE action\n const handleSaveMapping: MRT_TableOptions<PagerDutyEntityMapping>[\"onEditingRowSave\"] =\n async ({ values, table }) => {\n values.entityName =\n fetchedCatalogEntities.find(\n (entity) => entity.id === values.entityRef\n )?.name || \"\";\n values.status = \"RefreshToUpdate\";\n await updateMapping(values);\n table.setEditingRow(null); // exit editing mode\n };\n\n const openInBrowser = (url: string) => {\n window.open(url, \"_blank\", \"noreferrer\");\n };\n\n const DenseTable = () => {\n const [validationErrors, setValidationErrors] = useState<\n Record<string, string | undefined>\n >({});\n\n const columns = useMemo<MRT_ColumnDef<PagerDutyEntityMapping>[]>(\n () => [\n {\n accessorKey: \"serviceId\",\n header: \"Service ID\",\n visibleInShowHideMenu: false,\n enableEditing: false,\n Edit: () => null,\n Cell: ({ cell }) => (\n <Typography variant=\"body1\" style={{ fontWeight: 600 }}>\n {cell.getValue<string>()}\n </Typography>\n ),\n },\n {\n accessorKey: \"serviceName\",\n header: \"PagerDuty Service\",\n enableEditing: false,\n },\n {\n accessorKey: \"team\",\n header: \"Team\",\n enableEditing: false,\n },\n {\n accessorKey: \"escalationPolicy\",\n header: \"Escalation Policy\",\n enableEditing: false,\n },\n {\n accessorKey: \"entityRef\",\n header: \"Mapping\",\n visibleInShowHideMenu: false,\n editVariant: \"select\",\n editSelectOptions: getCatalogEntityOptions(),\n muiEditTextFieldProps: {\n select: true,\n error: !!validationErrors?.state,\n helperText: validationErrors?.state,\n },\n },\n {\n accessorKey: \"entityName\",\n header: \"Mapped Entity Name\",\n enableEditing: false,\n Edit: () => null,\n },\n {\n accessorKey: \"status\",\n header: \"Status\",\n enableEditing: false,\n Edit: () => null,\n Cell: ({ cell }) => (\n <Box\n component=\"span\"\n bgcolor={getColorFromStatus(cell.getValue<string>())}\n borderRadius=\"0.25rem\"\n color=\"white\"\n p=\"0.25rem\"\n >\n {makeReadable(cell.getValue<string>())}\n </Box>\n ),\n },\n {\n accessorKey: \"serviceUrl\",\n header: \"Service URL\",\n visibleInShowHideMenu: false,\n enableEditing: false,\n Edit: () => null,\n },\n ],\n [validationErrors]\n );\n\n const dataTable = useMaterialReactTable({\n columns,\n data: fetchedMappings,\n editDisplayMode: \"modal\", // default ('row', 'cell', 'table', and 'custom' are also available)\n enableEditing: true,\n positionActionsColumn: \"last\",\n enableStickyHeader: true,\n enableFilters: true,\n getRowId: (row) => row.serviceId,\n muiToolbarAlertBannerProps: isLoadingMappingsError\n ? {\n color: \"error\",\n children: \"Error loading data\",\n }\n : undefined,\n muiTableContainerProps: {\n sx: {\n minHeight: \"500px\",\n },\n },\n onEditingRowCancel: () => setValidationErrors({}),\n onEditingRowSave: handleSaveMapping,\n // optionally customize modal content\n renderEditRowDialogContent: ({ table, row, internalEditComponents }) => (\n <>\n <DialogTitle>Edit Mapping</DialogTitle>\n <DialogContent>{internalEditComponents} </DialogContent>\n <DialogActions>\n <MRT_EditActionButtons variant=\"text\" table={table} row={row} />\n </DialogActions>\n </>\n ),\n renderRowActions: ({ row, table }) => (\n <Box sx={{ display: \"flex\" }}>\n <Tooltip title=\"Edit\">\n <IconButton onClick={() => table.setEditingRow(row)}>\n <EditIcon />\n </IconButton>\n </Tooltip>\n <Tooltip title=\"Open in PagerDuty\">\n <IconButton\n onClick={() => openInBrowser(row.getValue(\"serviceUrl\"))}\n >\n <OpenInBrowser />\n </IconButton>\n </Tooltip>\n </Box>\n ),\n state: {\n isLoading: isLoadingMappings || isLoadingCatalogEntities,\n isSaving: isUpdatingMapping,\n showAlertBanner:\n isLoadingMappingsError || isLoadingCatalogEntitiesError,\n showProgressBars: isFetchingMappings || isFetchingCatalogEntities,\n columnVisibility: {\n serviceId: false,\n entityRef: false,\n serviceUrl: false,\n },\n },\n });\n\n return <MaterialReactTable table={dataTable} />;\n };\n\n return (\n <QueryClientProvider client={queryClient}>\n <DenseTable />\n </QueryClientProvider>\n );\n};\n"],"names":["OpenInBrowser"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ServiceMappingComponent.esm.js","sources":["../../../src/components/PagerDutyPage/ServiceMappingComponent.tsx"],"sourcesContent":["import React, { useMemo, useState } from \"react\";\nimport {\n Box,\n DialogActions,\n DialogContent,\n DialogTitle,\n IconButton,\n Tooltip,\n Typography,\n} from \"@material-ui/core\";\nimport EditIcon from \"@mui/icons-material/Edit\";\nimport { PagerDutyEntityMapping } from \"@pagerduty/backstage-plugin-common\";\nimport { useApi } from \"@backstage/core-plugin-api\";\nimport { pagerDutyApiRef } from \"../../api\";\nimport {\n QueryClient,\n QueryClientProvider,\n useMutation,\n // useQueries,\n useQuery,\n} from \"@tanstack/react-query\";\nimport {\n MRT_ColumnDef,\n MRT_EditActionButtons,\n MRT_TableOptions,\n MaterialReactTable,\n useMaterialReactTable,\n} from \"material-react-table\";\nimport { catalogApiRef } from \"@backstage/plugin-catalog-react\";\nimport OpenInBrowser from \"@material-ui/icons/OpenInBrowser\";\n\ntype Service = {\n name: string; // \"Ads\"\n id: string; // \"QWe1j283n12j132\"\n system: string; // \"Production\"\n owner: string; // \"Mapped\"\n lifecycle: string; // \"Ads\"\n};\n\nfunction getColorFromStatus(status?: string) {\n switch (status) {\n case \"InSync\":\n return \"green\";\n case \"OutOfSync\":\n return \"red\";\n case \"NotMapped\":\n return \"orange\";\n default:\n return \"gray\";\n }\n}\n\nfunction makeReadable(status?: string) {\n switch (status) {\n case \"InSync\":\n return \"In Sync\";\n case \"OutOfSync\":\n return \"Out of Sync\";\n case \"NotMapped\":\n return \"Not Mapped\";\n default:\n return \"Refresh to Update\";\n }\n}\n\nexport const ServiceMappingComponent = () => {\n // const [_, setEntityMappings] = useState<\n // PagerDutyEntityMapping[]\n // >([]);\n // const [catalogEntities, setCatalogEntities] = useState<Service[]>([]);\n const [entityOptions, setEntityOptions] = useState<CatalogEntityOptions[]>([]);\n\n const pagerDutyApi = useApi(pagerDutyApiRef);\n const catalogApi = useApi(catalogApiRef);\n\n // function fetchCatalogEntities() {\n // catalogApi\n // .getEntities({\n // filter: { kind: \"Component\" },\n // })\n // .then((result) => {\n // const entities: Service[] = [];\n // result.items.forEach((entity: any) => {\n // entities.push({\n // name: entity.metadata?.name,\n // id: entity.metadata?.uid ?? \"\",\n // system: JSON.stringify(entity.spec?.system) || \"\",\n // owner: JSON.stringify(entity.spec?.owner) || \"\",\n // lifecycle: JSON.stringify(entity.spec?.lifecycle) || \"\",\n // });\n // });\n\n // setCatalogEntities(entities);\n // });\n // }\n\n async function fetchMappings(): Promise<PagerDutyEntityMapping[]> {\n const { mappings: foundMappings } = await pagerDutyApi.getEntityMappings();\n\n // setEntityMappings(foundMappings);\n\n return foundMappings;\n }\n\n async function fetchCatalogEntities(): Promise<Service[]> {\n // if (catalogEntities.length === 0) {\n const result = await catalogApi.getEntities({\n filter: { kind: \"Component\" },\n });\n\n const entities: Service[] = [];\n result.items.forEach((entity: any) => {\n entities.push({\n name: entity.metadata?.name,\n id: entity.metadata?.uid ?? \"\",\n system: JSON.stringify(entity.spec?.system) || \"\",\n owner: JSON.stringify(entity.spec?.owner) || \"\",\n lifecycle: JSON.stringify(entity.spec?.lifecycle) || \"\",\n });\n });\n\n // setCatalogEntities(entities);\n\n return entities;\n // }\n\n // return catalogEntities;\n }\n\n type CatalogEntityOptions = {\n value: string;\n label: string;\n };\n\n // READ hook (get mappings from api)\n\n const DenseTable = () => {\n const [validationErrors, setValidationErrors] = useState<\n Record<string, string | undefined>\n >({});\n\n const columns = useMemo<MRT_ColumnDef<PagerDutyEntityMapping>[]>(\n () => [\n {\n accessorKey: \"serviceId\",\n header: \"Service ID\",\n visibleInShowHideMenu: false,\n enableEditing: false,\n Edit: () => null,\n Cell: ({ cell }) => (\n <Typography variant=\"body1\" style={{ fontWeight: 600 }}>\n {cell.getValue<string>()}\n </Typography>\n ),\n },\n {\n accessorKey: \"serviceName\",\n header: \"PagerDuty Service\",\n enableEditing: false,\n },\n {\n accessorKey: \"team\",\n header: \"Team\",\n enableEditing: false,\n },\n {\n accessorKey: \"escalationPolicy\",\n header: \"Escalation Policy\",\n enableEditing: false,\n },\n {\n accessorKey: \"entityRef\",\n header: \"Mapping\",\n visibleInShowHideMenu: false,\n editVariant: \"select\",\n editSelectOptions: entityOptions,\n muiEditTextFieldProps: {\n select: true,\n error: !!validationErrors?.state,\n helperText: validationErrors?.state,\n },\n },\n {\n accessorKey: \"entityName\",\n header: \"Mapped Entity Name\",\n enableEditing: false,\n Edit: () => null,\n },\n {\n accessorKey: \"status\",\n header: \"Status\",\n enableEditing: false,\n Edit: () => null,\n Cell: ({ cell }) => (\n <Box\n component=\"span\"\n bgcolor={getColorFromStatus(cell.getValue<string>())}\n borderRadius=\"0.25rem\"\n color=\"white\"\n p=\"0.25rem\"\n >\n {makeReadable(cell.getValue<string>())}\n </Box>\n ),\n },\n {\n accessorKey: \"serviceUrl\",\n header: \"Service URL\",\n visibleInShowHideMenu: false,\n enableEditing: false,\n Edit: () => null,\n },\n ],\n [validationErrors]\n );\n\n // call READ hook\n const {\n data: fetchedMappings = [],\n isError: isLoadingMappingsError,\n isFetching: isFetchingMappings,\n isLoading: isLoadingMappings,\n } = useGetMappings();\n\n // call READ hook\n const {\n data: fetchedCatalogEntities = [],\n isError: isLoadingCatalogEntitiesError,\n isFetching: isFetchingCatalogEntities,\n isLoading: isLoadingCatalogEntities,\n } = useGetCatalogEntities();\n\n function useGetMappings() {\n return useQuery<PagerDutyEntityMapping[]>({\n queryKey: [\"mappings\"],\n queryFn: async () => fetchMappings(),\n refetchOnWindowFocus: false,\n });\n }\n\n // READ hook (get catalog entities from api)\n function useGetCatalogEntities() {\n return useQuery<Service[]>({\n queryKey: [\"entities\"],\n queryFn: async () => fetchCatalogEntities(),\n refetchOnMount: false,\n refetchOnWindowFocus: false,\n refetchOnReconnect: false,\n });\n }\n\n // UPDATE hook (put mapping in api)\n function useUpdateMapping() {\n // const queryClient = useQueryClient();\n return useMutation({\n mutationFn: async (mapping: PagerDutyEntityMapping) => {\n return await pagerDutyApi.storeServiceMapping(\n mapping.serviceId,\n mapping.entityRef\n );\n },\n // client side optimistic update\n // onMutate: (newMappingInfo: PagerDutyEntityMapping) => {\n // queryClient.setQueryData([\"updateMappings\"], (prevMappings: any) =>\n // prevMappings?.map((prevMapping: PagerDutyEntityMapping) => {\n // if (prevMapping.serviceId === newMappingInfo.serviceId) {\n // newMappingInfo.entityName =\n // fetchedCatalogEntities.find(\n // (entity) => entity.id === newMappingInfo.entityRef\n // )?.name || \"\";\n\n // return newMappingInfo;\n // }\n // return prevMapping;\n // })\n // );\n // },\n });\n }\n\n // call UPDATE hook\n const { mutateAsync: updateMapping, isPending: isUpdatingMapping } =\n useUpdateMapping();\n\n // UPDATE action\n const handleSaveMapping: MRT_TableOptions<PagerDutyEntityMapping>[\"onEditingRowSave\"] =\n async ({ values, table }) => {\n setValidationErrors({});\n // values.entityName =\n // fetchedCatalogEntities.find(\n // (entity) => entity.id === values.entityRef\n // )?.name || \"\";\n values.status = \"RefreshToUpdate\";\n await updateMapping(values);\n table.setEditingRow(null); // exit editing mode\n };\n\n const openInBrowser = (url: string) => {\n window.open(url, \"_blank\", \"noreferrer\");\n };\n\n const dataTable = useMaterialReactTable({\n columns,\n data: fetchedMappings,\n editDisplayMode: \"modal\", // default ('row', 'cell', 'table', and 'custom' are also available)\n enableEditing: true,\n positionActionsColumn: \"last\",\n enableStickyHeader: true,\n enableFilters: true,\n getRowId: (row) => row.serviceId,\n muiToolbarAlertBannerProps: isLoadingMappingsError\n ? {\n color: \"error\",\n children: \"Error loading data\",\n }\n : undefined,\n muiTableContainerProps: {\n sx: {\n minHeight: \"500px\",\n },\n },\n onEditingRowCancel: () => setValidationErrors({}),\n onEditingRowSave: handleSaveMapping,\n // optionally customize modal content\n renderEditRowDialogContent: ({ table, row, internalEditComponents }) => (\n <>\n <DialogTitle>Edit Mapping</DialogTitle>\n <DialogContent>{internalEditComponents} </DialogContent>\n <DialogActions>\n <MRT_EditActionButtons variant=\"text\" table={table} row={row} />\n </DialogActions>\n </>\n ),\n renderRowActions: ({ row, table }) => (\n <Box sx={{ display: \"flex\" }}>\n <Tooltip title=\"Edit\">\n <IconButton onClick={() => table.setEditingRow(row)}>\n <EditIcon />\n </IconButton>\n </Tooltip>\n <Tooltip title=\"Open in PagerDuty\">\n <IconButton\n onClick={() => openInBrowser(row.getValue(\"serviceUrl\"))}\n >\n <OpenInBrowser />\n </IconButton>\n </Tooltip>\n </Box>\n ),\n state: {\n isLoading: isLoadingMappings || isLoadingCatalogEntities,\n isSaving: isUpdatingMapping,\n showAlertBanner:\n isLoadingMappingsError || isLoadingCatalogEntitiesError,\n showProgressBars: isFetchingMappings || isFetchingCatalogEntities,\n columnVisibility: {\n serviceId: false,\n entityRef: false,\n serviceUrl: false,\n },\n },\n });\n\n // function getCatalogEntityOptions(): CatalogEntityOptions[] {\n // const options: CatalogEntityOptions[] = [];\n // // if (entityOptions.length === 0) {\n // // initialize with empty object\n // options.push({ value: \"\", label: \"None\" });\n // // }\n\n // fetchedCatalogEntities.forEach((entity) => {\n // // find entity with entity.id in entityMappings array\n // const foundEntity = fetchedMappings.find(\n // (item) => item.entityRef === entity.id\n // );\n\n // if (!foundEntity) {\n // options.push({\n // value: entity.id,\n // label: entity.name,\n // });\n // }\n // });\n\n // // setEntityOptions(options);\n\n // return options;\n // }\n\n function getCatalogEntityOptions() {\n const options: CatalogEntityOptions[] = [];\n // if (entityOptions.length === 0) {\n // initialize with empty object\n options.push({ value: \"\", label: \"None\" });\n // }\n\n fetchedCatalogEntities.forEach((entity) => {\n // find entity with entity.id in entityMappings array\n const foundEntity = fetchedMappings.find(\n (item) => item.entityRef === entity.id\n );\n\n if (!foundEntity) {\n options.push({\n value: entity.id,\n label: entity.name,\n });\n }\n });\n\n setEntityOptions(options);\n }\n\n getCatalogEntityOptions();\n\n return <MaterialReactTable table={dataTable} />;\n };\n\n const queryClient = new QueryClient();\n\n return (\n <QueryClientProvider client={queryClient}>\n <DenseTable />\n </QueryClientProvider>\n );\n};\n"],"names":["OpenInBrowser"],"mappings":"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"}
|
package/package.json
CHANGED