From 8e9c43a209da910e36b12fad181f0913ebe5edbd Mon Sep 17 00:00:00 2001 From: AmbrishRamachandiran Date: Mon, 24 Jul 2023 22:50:43 +0530 Subject: [PATCH 1/6] Displaying an alert popup everytime the Playlist is created or deleted Signed-off-by: AmbrishRamachandiran --- .changeset/purple-dolls-change.md | 5 +++++ .../CreatePlaylistButton.tsx | 15 ++++++++++++-- .../PlaylistPage/PlaylistHeader.tsx | 20 +++++++++++++++++-- 3 files changed, 36 insertions(+), 4 deletions(-) create mode 100644 .changeset/purple-dolls-change.md diff --git a/.changeset/purple-dolls-change.md b/.changeset/purple-dolls-change.md new file mode 100644 index 0000000000..702f2cf704 --- /dev/null +++ b/.changeset/purple-dolls-change.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-playlist': patch +--- + +Displaying an alert popup everytime the Playlist is created or deleted diff --git a/plugins/playlist/src/components/CreatePlaylistButton/CreatePlaylistButton.tsx b/plugins/playlist/src/components/CreatePlaylistButton/CreatePlaylistButton.tsx index 7669a48c26..d88ffbcda4 100644 --- a/plugins/playlist/src/components/CreatePlaylistButton/CreatePlaylistButton.tsx +++ b/plugins/playlist/src/components/CreatePlaylistButton/CreatePlaylistButton.tsx @@ -14,7 +14,12 @@ * limitations under the License. */ -import { errorApiRef, useApi, useRouteRef } from '@backstage/core-plugin-api'; +import { + errorApiRef, + useApi, + useRouteRef, + alertApiRef, +} from '@backstage/core-plugin-api'; import { BackstageTheme } from '@backstage/theme'; import { usePermission } from '@backstage/plugin-permission-react'; import { @@ -34,6 +39,7 @@ import { useTitle } from '../../hooks'; export const CreatePlaylistButton = () => { const navigate = useNavigate(); const errorApi = useApi(errorApiRef); + const alertApi = useApi(alertApiRef); const playlistApi = useApi(playlistApiRef); const playlistRoute = useRouteRef(playlistRouteRef); const [openDialog, setOpenDialog] = useState(false); @@ -49,11 +55,16 @@ export const CreatePlaylistButton = () => { try { const playlistId = await playlistApi.createPlaylist(playlist); navigate(playlistRoute({ playlistId })); + alertApi.post({ + message: `Added playlist '${playlist.name}'`, + severity: 'success', + display: 'transient', + }); } catch (e) { errorApi.post(e); } }, - [errorApi, navigate, playlistApi, playlistRoute], + [errorApi, navigate, playlistApi, playlistRoute, alertApi], ); const singularTitle = useTitle({ diff --git a/plugins/playlist/src/components/PlaylistPage/PlaylistHeader.tsx b/plugins/playlist/src/components/PlaylistPage/PlaylistHeader.tsx index 621f94f75c..f892e8de7f 100644 --- a/plugins/playlist/src/components/PlaylistPage/PlaylistHeader.tsx +++ b/plugins/playlist/src/components/PlaylistPage/PlaylistHeader.tsx @@ -19,7 +19,12 @@ import { HeaderActionMenu, HeaderLabel, } from '@backstage/core-components'; -import { errorApiRef, useApi, useRouteRef } from '@backstage/core-plugin-api'; +import { + errorApiRef, + useApi, + useRouteRef, + alertApiRef, +} from '@backstage/core-plugin-api'; import { EntityRefLink } from '@backstage/plugin-catalog-react'; import { usePermission } from '@backstage/plugin-permission-react'; import { @@ -72,6 +77,7 @@ export type PlaylistHeaderProps = { export const PlaylistHeader = ({ playlist, onUpdate }: PlaylistHeaderProps) => { const classes = useStyles(); const errorApi = useApi(errorApiRef); + const alertApi = useApi(alertApiRef); const playlistApi = useApi(playlistApiRef); const navigate = useNavigate(); const rootRoute = useRouteRef(rootRouteRef); @@ -94,17 +100,27 @@ export const PlaylistHeader = ({ playlist, onUpdate }: PlaylistHeaderProps) => { await playlistApi.updatePlaylist({ ...update, id: playlist.id }); setOpenEditDialog(false); onUpdate(); + alertApi.post({ + message: `Updated playlist '${playlist.name}'`, + severity: 'success', + display: 'transient', + }); } catch (e) { errorApi.post(e); } }, - [errorApi, onUpdate, playlist, playlistApi], + [errorApi, onUpdate, playlist, playlistApi, alertApi], ); const [deleting, deletePlaylist] = useAsyncFn(async () => { try { await playlistApi.deletePlaylist(playlist.id); navigate(rootRoute()); + alertApi.post({ + message: `Deleted playlist '${playlist.name}'`, + severity: 'success', + display: 'transient', + }); } catch (e) { errorApi.post(e); } From ce1e31711341b7d51e34a37dbedc9e7aa9d2ee82 Mon Sep 17 00:00:00 2001 From: AmbrishRamachandiran Date: Mon, 24 Jul 2023 23:22:16 +0530 Subject: [PATCH 2/6] Displaying an alert popup everytime the Playlist is created or deleted Signed-off-by: AmbrishRamachandiran --- .changeset/proud-ligers-sing.md | 5 +++++ .../components/EntityPlaylistDialog/EntityPlaylistDialog.tsx | 5 +++++ 2 files changed, 10 insertions(+) create mode 100644 .changeset/proud-ligers-sing.md diff --git a/.changeset/proud-ligers-sing.md b/.changeset/proud-ligers-sing.md new file mode 100644 index 0000000000..ebff7386a6 --- /dev/null +++ b/.changeset/proud-ligers-sing.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-playlist': patch +--- + +Displaying an alert popup every time the Playlist is created or deleted diff --git a/plugins/playlist/src/components/EntityPlaylistDialog/EntityPlaylistDialog.tsx b/plugins/playlist/src/components/EntityPlaylistDialog/EntityPlaylistDialog.tsx index 2c675d357f..26b727fbc0 100644 --- a/plugins/playlist/src/components/EntityPlaylistDialog/EntityPlaylistDialog.tsx +++ b/plugins/playlist/src/components/EntityPlaylistDialog/EntityPlaylistDialog.tsx @@ -131,6 +131,11 @@ export const EntityPlaylistDialog = (props: EntityPlaylistDialogProps) => { await playlistApi.addPlaylistEntities(playlistId, [ stringifyEntityRef(entity!), ]); + alertApi.post({ + message: `Added playlist '${playlist.name}'`, + severity: 'success', + display: 'transient', + }); navigate(playlistRoute({ playlistId })); } catch (e) { alertApi.post({ From 4062b54970e560bb5f03ecd71457693fc45c2c03 Mon Sep 17 00:00:00 2001 From: AmbrishRamachandiran <133481507+AmbrishRamachandiran@users.noreply.github.com> Date: Mon, 24 Jul 2023 23:27:26 +0530 Subject: [PATCH 3/6] Update .changeset/purple-dolls-change.md Co-authored-by: Phil Kuang Signed-off-by: AmbrishRamachandiran <133481507+AmbrishRamachandiran@users.noreply.github.com> --- .changeset/purple-dolls-change.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.changeset/purple-dolls-change.md b/.changeset/purple-dolls-change.md index 702f2cf704..ebff7386a6 100644 --- a/.changeset/purple-dolls-change.md +++ b/.changeset/purple-dolls-change.md @@ -2,4 +2,4 @@ '@backstage/plugin-playlist': patch --- -Displaying an alert popup everytime the Playlist is created or deleted +Displaying an alert popup every time the Playlist is created or deleted From 23bcc2fca4d6053f4d137b1c036d3a261a52608e Mon Sep 17 00:00:00 2001 From: AmbrishRamachandiran <133481507+AmbrishRamachandiran@users.noreply.github.com> Date: Tue, 25 Jul 2023 00:27:51 +0530 Subject: [PATCH 4/6] Delete proud-ligers-sing.md Signed-off-by: AmbrishRamachandiran <133481507+AmbrishRamachandiran@users.noreply.github.com> --- .changeset/proud-ligers-sing.md | 5 ----- 1 file changed, 5 deletions(-) delete mode 100644 .changeset/proud-ligers-sing.md diff --git a/.changeset/proud-ligers-sing.md b/.changeset/proud-ligers-sing.md deleted file mode 100644 index ebff7386a6..0000000000 --- a/.changeset/proud-ligers-sing.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@backstage/plugin-playlist': patch ---- - -Displaying an alert popup every time the Playlist is created or deleted From d1e0588324d1e6f171ef87795a29068b0fbf56aa Mon Sep 17 00:00:00 2001 From: AmbrishRamachandiran Date: Tue, 25 Jul 2023 09:41:21 +0530 Subject: [PATCH 5/6] Displaying an alert popup each time the Playlist is created or deleted Signed-off-by: AmbrishRamachandiran --- .changeset/chilly-keys-count.md | 5 +++++ .../components/EntityPlaylistDialog/EntityPlaylistDialog.tsx | 2 +- 2 files changed, 6 insertions(+), 1 deletion(-) create mode 100644 .changeset/chilly-keys-count.md diff --git a/.changeset/chilly-keys-count.md b/.changeset/chilly-keys-count.md new file mode 100644 index 0000000000..3bbc4e40dc --- /dev/null +++ b/.changeset/chilly-keys-count.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-playlist': patch +--- + +Displaying an alert popup each time the Playlist is created or deleted diff --git a/plugins/playlist/src/components/EntityPlaylistDialog/EntityPlaylistDialog.tsx b/plugins/playlist/src/components/EntityPlaylistDialog/EntityPlaylistDialog.tsx index 26b727fbc0..38ea156320 100644 --- a/plugins/playlist/src/components/EntityPlaylistDialog/EntityPlaylistDialog.tsx +++ b/plugins/playlist/src/components/EntityPlaylistDialog/EntityPlaylistDialog.tsx @@ -131,12 +131,12 @@ export const EntityPlaylistDialog = (props: EntityPlaylistDialogProps) => { await playlistApi.addPlaylistEntities(playlistId, [ stringifyEntityRef(entity!), ]); + navigate(playlistRoute({ playlistId })); alertApi.post({ message: `Added playlist '${playlist.name}'`, severity: 'success', display: 'transient', }); - navigate(playlistRoute({ playlistId })); } catch (e) { alertApi.post({ message: `Failed to add entity to ${singularTitleLowerCase}: ${e}`, From e15359ba035941c168589619fc4d94ef4a63e3a4 Mon Sep 17 00:00:00 2001 From: AmbrishRamachandiran <133481507+AmbrishRamachandiran@users.noreply.github.com> Date: Tue, 25 Jul 2023 18:34:35 +0530 Subject: [PATCH 6/6] Delete purple-dolls-change.md deleted duplicate changeset file Signed-off-by: AmbrishRamachandiran <133481507+AmbrishRamachandiran@users.noreply.github.com> --- .changeset/purple-dolls-change.md | 5 ----- 1 file changed, 5 deletions(-) delete mode 100644 .changeset/purple-dolls-change.md diff --git a/.changeset/purple-dolls-change.md b/.changeset/purple-dolls-change.md deleted file mode 100644 index ebff7386a6..0000000000 --- a/.changeset/purple-dolls-change.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@backstage/plugin-playlist': patch ---- - -Displaying an alert popup every time the Playlist is created or deleted