diff --git a/.changeset/green-experts-happen.md b/.changeset/green-experts-happen.md new file mode 100644 index 0000000000..6c892a2038 --- /dev/null +++ b/.changeset/green-experts-happen.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-bazaar': patch +--- + +Added alert popup for link and unlink entity in bazaar project diff --git a/plugins/bazaar/src/components/HomePageBazaarInfoCard/HomePageBazaarInfoCard.tsx b/plugins/bazaar/src/components/HomePageBazaarInfoCard/HomePageBazaarInfoCard.tsx index 782b7d3c67..c361098273 100644 --- a/plugins/bazaar/src/components/HomePageBazaarInfoCard/HomePageBazaarInfoCard.tsx +++ b/plugins/bazaar/src/components/HomePageBazaarInfoCard/HomePageBazaarInfoCard.tsx @@ -41,6 +41,7 @@ import { useApi, identityApiRef, useRouteRef, + alertApiRef, } from '@backstage/core-plugin-api'; import { Member, BazaarProject } from '../../types'; import { bazaarApiRef } from '../../api'; @@ -86,6 +87,7 @@ export const HomePageBazaarInfoCard = ({ const entityLink = useRouteRef(entityRouteRef); const bazaarApi = useApi(bazaarApiRef); const identity = useApi(identityApiRef); + const alertApi = useApi(alertApiRef); const catalogApi = useApi(catalogApiRef); const [openEdit, setOpenEdit] = useState(false); const [openProjectSelector, setOpenProjectSelector] = useState(false); @@ -216,6 +218,13 @@ export const HomePageBazaarInfoCard = ({ if (updateResponse.status === 'ok') { setOpenUnlink(false); fetchBazaarProject(); + alertApi.post({ + message: `Unlinked entity '${ + parseEntityRef(bazaarProject.value?.entityRef!).name + }' from the project ${bazaarProject.value?.title}`, + severity: 'success', + display: 'transient', + }); } }; diff --git a/plugins/bazaar/src/components/LinkProjectDialog/LinkProjectDialog.tsx b/plugins/bazaar/src/components/LinkProjectDialog/LinkProjectDialog.tsx index 92a7344dac..e1ef1e217f 100644 --- a/plugins/bazaar/src/components/LinkProjectDialog/LinkProjectDialog.tsx +++ b/plugins/bazaar/src/components/LinkProjectDialog/LinkProjectDialog.tsx @@ -27,7 +27,7 @@ import { CustomDialogTitle } from '../CustomDialogTitle'; import { Entity, stringifyEntityRef } from '@backstage/catalog-model'; import { bazaarApiRef } from '../../api'; -import { useApi } from '@backstage/core-plugin-api'; +import { useApi, alertApiRef } from '@backstage/core-plugin-api'; import { BazaarProject } from '../../types'; @@ -54,9 +54,12 @@ export const LinkProjectDialog = ({ }: Props) => { const classes = useStyles(); const bazaarApi = useApi(bazaarApiRef); + const alertApi = useApi(alertApiRef); const [selectedEntity, setSelectedEntity] = useState(initEntity); + const [selectedEntityName, setSelectedEntityName] = useState(''); const handleEntityClick = (entity: Entity) => { setSelectedEntity(entity); + setSelectedEntityName(entity.metadata.name); }; const handleSubmit = async () => { @@ -66,7 +69,14 @@ export const LinkProjectDialog = ({ ...bazaarProject, entityRef: stringifyEntityRef(selectedEntity!), }); - if (updateResponse.status === 'ok') fetchBazaarProject(); + if (updateResponse.status === 'ok') { + fetchBazaarProject(); + alertApi.post({ + message: `linked entity '${selectedEntityName}' to the project ${bazaarProject.title}`, + severity: 'success', + display: 'transient', + }); + } }; return (