@pagerduty/backstage-plugin 0.13.0-next.30 → 0.13.0-next.32

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.
@@ -30,7 +30,10 @@ function makeReadable(status) {
30
30
  return "Refresh to Update";
31
31
  }
32
32
  }
33
- const MappingTable = ({ mappings, catalogEntities }) => {
33
+ const MappingTable = ({
34
+ mappings,
35
+ catalogEntities
36
+ }) => {
34
37
  const DenseTable = () => {
35
38
  const [validationErrors, setValidationErrors] = useState({});
36
39
  const pagerDutyApi = useApi(pagerDutyApiRef);
@@ -191,7 +194,7 @@ const MappingTable = ({ mappings, catalogEntities }) => {
191
194
  (item) => item.entityRef === entity.id
192
195
  );
193
196
  const foundServiceAnnotation = entity.annotations["pagerduty.com/service-id"];
194
- if (!foundMapping && !foundServiceAnnotation) {
197
+ if (!foundMapping && !foundServiceAnnotation || foundServiceAnnotation && foundMapping && foundServiceAnnotation !== (foundMapping == null ? void 0 : foundMapping.serviceId)) {
195
198
  options.push({
196
199
  value: entity.id,
197
200
  label: entity.name
@@ -1 +1 @@
1
- {"version":3,"file":"MappingTable.esm.js","sources":["../../../src/components/PagerDutyPage/MappingTable.tsx"],"sourcesContent":["import React, { useMemo, useState } from 'react';\nimport { PagerDutyEntityMapping } from \"@pagerduty/backstage-plugin-common\";\nimport { MRT_ColumnDef, MRT_EditActionButtons, MRT_TableOptions, MaterialReactTable, useMaterialReactTable } from 'material-react-table';\nimport { Box, DialogActions, DialogContent, DialogTitle, IconButton, Tooltip, Typography } from '@material-ui/core';\nimport { QueryClient, QueryClientProvider, useMutation } from '@tanstack/react-query';\nimport {Edit, OpenInBrowser } from '@mui/icons-material';\nimport { useApi } from '@backstage/core-plugin-api';\nimport { pagerDutyApiRef } from \"../../api\";\n\ntype BackstageEntity = {\n name: string; // \"Ads\"\n id: string; // \"QWe1j283n12j132\"\n system: string; // \"Production\"\n owner: string; // \"Mapped\"\n lifecycle: string; // \"Ads\"\n annotations: Annotations;\n};\n\nexport type Annotations = {\n \"pagerduty.com/integration-key\": string;\n \"pagerduty.com/service-id\": string;\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\ntype CatalogEntityOptions = {\n value: string;\n label: string;\n};\n\ntype MappingTableProps = {\n mappings: PagerDutyEntityMapping[];\n catalogEntities: BackstageEntity[];\n};\n\nexport const MappingTable = ({mappings, catalogEntities} : MappingTableProps) => {\n const DenseTable = () => {\n const [validationErrors, setValidationErrors] = useState<\n Record<string, string | undefined>\n >({});\n\n const pagerDutyApi = useApi(pagerDutyApiRef);\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 // 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 catalogEntities.find((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: mappings,\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:\n mappings === undefined\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 <Edit />\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: mappings.length === 0 || catalogEntities.length === 0,\n isSaving: isUpdatingMapping,\n showAlertBanner:\n mappings === undefined || catalogEntities === undefined,\n showProgressBars: mappings.length === 0 || catalogEntities.length === 0,\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 catalogEntities.forEach((entity) => {\n // find entity with entity.id in entityMappings array\n const foundMapping = mappings.find(\n (item) => item.entityRef === entity.id\n );\n\n const foundServiceAnnotation = entity.annotations[\"pagerduty.com/service-id\"];\n\n if (!foundMapping && !foundServiceAnnotation) {\n options.push({\n value: entity.id,\n label: entity.name,\n });\n }\n });\n\n return options;\n }\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}"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"MappingTable.esm.js","sources":["../../../src/components/PagerDutyPage/MappingTable.tsx"],"sourcesContent":["import React, { useMemo, useState } from \"react\";\nimport { PagerDutyEntityMapping } from \"@pagerduty/backstage-plugin-common\";\nimport {\n MRT_ColumnDef,\n MRT_EditActionButtons,\n MRT_TableOptions,\n MaterialReactTable,\n useMaterialReactTable,\n} from \"material-react-table\";\nimport {\n Box,\n DialogActions,\n DialogContent,\n DialogTitle,\n IconButton,\n Tooltip,\n Typography,\n} from \"@material-ui/core\";\nimport {\n QueryClient,\n QueryClientProvider,\n useMutation,\n} from \"@tanstack/react-query\";\nimport { Edit, OpenInBrowser } from \"@mui/icons-material\";\nimport { useApi } from \"@backstage/core-plugin-api\";\nimport { pagerDutyApiRef } from \"../../api\";\n\ntype BackstageEntity = {\n name: string; // \"Ads\"\n id: string; // \"QWe1j283n12j132\"\n system: string; // \"Production\"\n owner: string; // \"Mapped\"\n lifecycle: string; // \"Ads\"\n annotations: Annotations;\n};\n\nexport type Annotations = {\n \"pagerduty.com/integration-key\": string;\n \"pagerduty.com/service-id\": string;\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\ntype CatalogEntityOptions = {\n value: string;\n label: string;\n};\n\ntype MappingTableProps = {\n mappings: PagerDutyEntityMapping[];\n catalogEntities: BackstageEntity[];\n};\n\nexport const MappingTable = ({\n mappings,\n catalogEntities,\n}: MappingTableProps) => {\n const DenseTable = () => {\n const [validationErrors, setValidationErrors] = useState<\n Record<string, string | undefined>\n >({});\n\n const pagerDutyApi = useApi(pagerDutyApiRef);\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 // 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 catalogEntities.find((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: mappings,\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:\n mappings === undefined\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 <Edit />\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: mappings.length === 0 || catalogEntities.length === 0,\n isSaving: isUpdatingMapping,\n showAlertBanner:\n mappings === undefined || catalogEntities === undefined,\n showProgressBars: mappings.length === 0 || catalogEntities.length === 0,\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 catalogEntities.forEach((entity) => {\n // find entity with entity.id in entityMappings array\n const foundMapping = mappings.find(\n (item) => item.entityRef === entity.id\n );\n\n const foundServiceAnnotation =\n entity.annotations[\"pagerduty.com/service-id\"];\n\n if (\n (!foundMapping && !foundServiceAnnotation) ||\n (foundServiceAnnotation &&\n foundMapping &&\n foundServiceAnnotation !== foundMapping?.serviceId)\n ) {\n options.push({\n value: entity.id,\n label: entity.name,\n });\n }\n });\n\n return options;\n }\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":[],"mappings":"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"}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@pagerduty/backstage-plugin",
3
3
  "description": "A Backstage plugin that integrates towards PagerDuty",
4
- "version": "0.13.0-next.30",
4
+ "version": "0.13.0-next.32",
5
5
  "main": "dist/index.esm.js",
6
6
  "types": "dist/index.d.ts",
7
7
  "license": "Apache-2.0",