From 651c397a4b68062035b2ed03bb08d710ad681e31 Mon Sep 17 00:00:00 2001
From: Allison Levine <1689238+allilevine@users.noreply.github.com>
Date: Tue, 31 Dec 2024 13:14:23 -0500
Subject: [PATCH] Notifications: Fix the undo dismiss button (#97850)

* Position the dismiss button correctly, and only close the undo notification.

* Remove unnecessary styling.

* Stop event propagation instead of using a new function.
---
 apps/notifications/src/panel/boot/stylesheets/main.scss   | 6 ++++--
 apps/notifications/src/panel/templates/undo-list-item.jsx | 3 ++-
 2 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/apps/notifications/src/panel/boot/stylesheets/main.scss b/apps/notifications/src/panel/boot/stylesheets/main.scss
index f363cf4b82507a..c385d20efc7811 100644
--- a/apps/notifications/src/panel/boot/stylesheets/main.scss
+++ b/apps/notifications/src/panel/boot/stylesheets/main.scss
@@ -579,6 +579,8 @@ $with-sidebar-min-page-width: 1114px;
 		p {
 			padding-top: 1em;
 			padding-bottom: 1em;
+			display: flex;
+			align-items: center;
 		}
 
 		.wpnc__undo-link {
@@ -594,8 +596,8 @@ $with-sidebar-min-page-width: 1114px;
 
 	.wpnc__close-link {
 		color: var(--color-text-inverted);
-		position: absolute;
-		right: 10px;
+		margin-left: auto;
+		padding: 0 10px;
 		cursor: pointer;
 		user-select: none;
 	}
diff --git a/apps/notifications/src/panel/templates/undo-list-item.jsx b/apps/notifications/src/panel/templates/undo-list-item.jsx
index b01c5a432546a8..f271bb2b373d3b 100644
--- a/apps/notifications/src/panel/templates/undo-list-item.jsx
+++ b/apps/notifications/src/panel/templates/undo-list-item.jsx
@@ -132,8 +132,9 @@ export class UndoListItem extends Component {
 	};
 
 	actImmediately = ( event ) => {
-		if ( event && event.preventDefault ) {
+		if ( event ) {
 			event.preventDefault();
+			event.stopPropagation();
 		}
 		clearTimeout( this.state.undoTimer );
 		this.instance && this.setState( { isVisible: false } );