diff --git a/packages/apps/esm-implementer-tools-app/src/implementer-tools.component.tsx b/packages/apps/esm-implementer-tools-app/src/implementer-tools.component.tsx
index 447326d74..7c76e24e8 100644
--- a/packages/apps/esm-implementer-tools-app/src/implementer-tools.component.tsx
+++ b/packages/apps/esm-implementer-tools-app/src/implementer-tools.component.tsx
@@ -1,5 +1,5 @@
 import React, { useState, useEffect } from 'react';
-import { showActionableNotification, UserHasAccess, useStore } from '@openmrs/esm-framework';
+import { showToast, UserHasAccess, useStore } from '@openmrs/esm-framework';
 import { implementerToolsStore, showModuleDiagnostics, togglePopup } from './store';
 
 import { useBackendDependencies } from './backend-dependencies/useBackendDependencies';
@@ -24,10 +24,10 @@ function PopupHandler() {
   useEffect(() => {
     // only show notification max. 1 time
     if (shouldShowNotification) {
-      showActionableNotification({
+      showToast({
         critical: false,
         kind: 'error',
-        subtitle: t(
+        description: t(
           'checkImplementerToolsMessage',
           'Check the Backend Modules tab in the Implementer Tools for more details',
         ),
diff --git a/packages/framework/esm-framework/docs/API.md b/packages/framework/esm-framework/docs/API.md
index 09454248f..7ac0b16fc 100644
--- a/packages/framework/esm-framework/docs/API.md
+++ b/packages/framework/esm-framework/docs/API.md
@@ -688,7 +688,7 @@ ___
 
 #### Defined in
 
-[packages/framework/esm-styleguide/src/toasts/toast.component.tsx:26](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-styleguide/src/toasts/toast.component.tsx#L26)
+[packages/framework/esm-styleguide/src/toasts/toast.component.tsx:28](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-styleguide/src/toasts/toast.component.tsx#L28)
 
 ___
 
@@ -4564,7 +4564,7 @@ ___
 
 #### Defined in
 
-[packages/framework/esm-globals/src/events.ts:102](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-globals/src/events.ts#L102)
+[packages/framework/esm-globals/src/events.ts:104](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-globals/src/events.ts#L104)
 
 ___
 
@@ -4590,7 +4590,7 @@ ___
 
 #### Defined in
 
-[packages/framework/esm-globals/src/events.ts:95](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-globals/src/events.ts#L95)
+[packages/framework/esm-globals/src/events.ts:97](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-globals/src/events.ts#L97)
 
 ___
 
@@ -4616,7 +4616,7 @@ ___
 
 #### Defined in
 
-[packages/framework/esm-globals/src/events.ts:116](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-globals/src/events.ts#L116)
+[packages/framework/esm-globals/src/events.ts:118](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-globals/src/events.ts#L118)
 
 ___
 
@@ -4642,7 +4642,7 @@ ___
 
 #### Defined in
 
-[packages/framework/esm-globals/src/events.ts:109](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-globals/src/events.ts#L109)
+[packages/framework/esm-globals/src/events.ts:111](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-globals/src/events.ts#L111)
 
 ___
 
diff --git a/packages/framework/esm-framework/docs/interfaces/ShowSnackbarEvent.md b/packages/framework/esm-framework/docs/interfaces/ShowSnackbarEvent.md
index e2a3ef832..177b43bc2 100644
--- a/packages/framework/esm-framework/docs/interfaces/ShowSnackbarEvent.md
+++ b/packages/framework/esm-framework/docs/interfaces/ShowSnackbarEvent.md
@@ -26,7 +26,7 @@
 
 #### Defined in
 
-[packages/framework/esm-globals/src/events.ts:70](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-globals/src/events.ts#L70)
+[packages/framework/esm-globals/src/events.ts:72](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-globals/src/events.ts#L72)
 
 ___
 
@@ -36,7 +36,7 @@ ___
 
 #### Defined in
 
-[packages/framework/esm-globals/src/events.ts:73](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-globals/src/events.ts#L73)
+[packages/framework/esm-globals/src/events.ts:75](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-globals/src/events.ts#L75)
 
 ___
 
@@ -46,7 +46,7 @@ ___
 
 #### Defined in
 
-[packages/framework/esm-globals/src/events.ts:68](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-globals/src/events.ts#L68)
+[packages/framework/esm-globals/src/events.ts:70](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-globals/src/events.ts#L70)
 
 ___
 
@@ -56,7 +56,7 @@ ___
 
 #### Defined in
 
-[packages/framework/esm-globals/src/events.ts:72](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-globals/src/events.ts#L72)
+[packages/framework/esm-globals/src/events.ts:74](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-globals/src/events.ts#L74)
 
 ___
 
@@ -66,7 +66,7 @@ ___
 
 #### Defined in
 
-[packages/framework/esm-globals/src/events.ts:67](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-globals/src/events.ts#L67)
+[packages/framework/esm-globals/src/events.ts:69](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-globals/src/events.ts#L69)
 
 ___
 
@@ -76,7 +76,7 @@ ___
 
 #### Defined in
 
-[packages/framework/esm-globals/src/events.ts:74](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-globals/src/events.ts#L74)
+[packages/framework/esm-globals/src/events.ts:76](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-globals/src/events.ts#L76)
 
 ___
 
@@ -86,7 +86,7 @@ ___
 
 #### Defined in
 
-[packages/framework/esm-globals/src/events.ts:69](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-globals/src/events.ts#L69)
+[packages/framework/esm-globals/src/events.ts:71](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-globals/src/events.ts#L71)
 
 ## Methods
 
@@ -100,4 +100,4 @@ ___
 
 #### Defined in
 
-[packages/framework/esm-globals/src/events.ts:71](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-globals/src/events.ts#L71)
+[packages/framework/esm-globals/src/events.ts:73](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-globals/src/events.ts#L73)
diff --git a/packages/framework/esm-framework/docs/interfaces/ShowToastEvent.md b/packages/framework/esm-framework/docs/interfaces/ShowToastEvent.md
index 23c2b5604..25956470b 100644
--- a/packages/framework/esm-framework/docs/interfaces/ShowToastEvent.md
+++ b/packages/framework/esm-framework/docs/interfaces/ShowToastEvent.md
@@ -6,13 +6,28 @@
 
 ### Properties
 
+- [actionButtonLabel](ShowToastEvent.md#actionbuttonlabel)
 - [description](ShowToastEvent.md#description)
 - [kind](ShowToastEvent.md#kind)
 - [millis](ShowToastEvent.md#millis)
 - [title](ShowToastEvent.md#title)
 
+### Methods
+
+- [onActionButtonClick](ShowToastEvent.md#onactionbuttonclick)
+
 ## Properties
 
+### actionButtonLabel
+
+• `Optional` **actionButtonLabel**: `any`
+
+#### Defined in
+
+[packages/framework/esm-globals/src/events.ts:63](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-globals/src/events.ts#L63)
+
+___
+
 ### description
 
 • **description**: `any`
@@ -50,3 +65,17 @@ ___
 #### Defined in
 
 [packages/framework/esm-globals/src/events.ts:61](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-globals/src/events.ts#L61)
+
+## Methods
+
+### onActionButtonClick
+
+▸ `Optional` **onActionButtonClick**(): `void`
+
+#### Returns
+
+`void`
+
+#### Defined in
+
+[packages/framework/esm-globals/src/events.ts:64](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-globals/src/events.ts#L64)
diff --git a/packages/framework/esm-framework/docs/interfaces/ToastDescriptor.md b/packages/framework/esm-framework/docs/interfaces/ToastDescriptor.md
index 5bd800d22..a28d49913 100644
--- a/packages/framework/esm-framework/docs/interfaces/ToastDescriptor.md
+++ b/packages/framework/esm-framework/docs/interfaces/ToastDescriptor.md
@@ -12,21 +12,36 @@
 
 ### UI Properties
 
+- [actionButtonLabel](ToastDescriptor.md#actionbuttonlabel)
 - [critical](ToastDescriptor.md#critical)
 - [description](ToastDescriptor.md#description)
 - [kind](ToastDescriptor.md#kind)
 - [millis](ToastDescriptor.md#millis)
 - [title](ToastDescriptor.md#title)
 
+### UI Methods
+
+- [onActionButtonClick](ToastDescriptor.md#onactionbuttonclick)
+
 ## UI Properties
 
+### actionButtonLabel
+
+• `Optional` **actionButtonLabel**: `string`
+
+#### Defined in
+
+[packages/framework/esm-styleguide/src/toasts/toast.component.tsx:17](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-styleguide/src/toasts/toast.component.tsx#L17)
+
+___
+
 ### critical
 
 • `Optional` **critical**: `boolean`
 
 #### Defined in
 
-[packages/framework/esm-styleguide/src/toasts/toast.component.tsx:17](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-styleguide/src/toasts/toast.component.tsx#L17)
+[packages/framework/esm-styleguide/src/toasts/toast.component.tsx:19](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-styleguide/src/toasts/toast.component.tsx#L19)
 
 ___
 
@@ -46,7 +61,7 @@ ___
 
 #### Defined in
 
-[packages/framework/esm-styleguide/src/toasts/toast.component.tsx:16](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-styleguide/src/toasts/toast.component.tsx#L16)
+[packages/framework/esm-styleguide/src/toasts/toast.component.tsx:18](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-styleguide/src/toasts/toast.component.tsx#L18)
 
 ___
 
@@ -56,7 +71,7 @@ ___
 
 #### Defined in
 
-[packages/framework/esm-styleguide/src/toasts/toast.component.tsx:19](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-styleguide/src/toasts/toast.component.tsx#L19)
+[packages/framework/esm-styleguide/src/toasts/toast.component.tsx:21](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-styleguide/src/toasts/toast.component.tsx#L21)
 
 ___
 
@@ -66,4 +81,18 @@ ___
 
 #### Defined in
 
-[packages/framework/esm-styleguide/src/toasts/toast.component.tsx:18](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-styleguide/src/toasts/toast.component.tsx#L18)
+[packages/framework/esm-styleguide/src/toasts/toast.component.tsx:20](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-styleguide/src/toasts/toast.component.tsx#L20)
+
+## UI Methods
+
+### onActionButtonClick
+
+▸ `Optional` **onActionButtonClick**(): `void`
+
+#### Returns
+
+`void`
+
+#### Defined in
+
+[packages/framework/esm-styleguide/src/toasts/toast.component.tsx:16](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-styleguide/src/toasts/toast.component.tsx#L16)
diff --git a/packages/framework/esm-framework/docs/interfaces/ToastNotificationMeta.md b/packages/framework/esm-framework/docs/interfaces/ToastNotificationMeta.md
index 0a2b3f303..58257952d 100644
--- a/packages/framework/esm-framework/docs/interfaces/ToastNotificationMeta.md
+++ b/packages/framework/esm-framework/docs/interfaces/ToastNotificationMeta.md
@@ -12,6 +12,7 @@
 
 ### UI Properties
 
+- [actionButtonLabel](ToastNotificationMeta.md#actionbuttonlabel)
 - [critical](ToastNotificationMeta.md#critical)
 - [description](ToastNotificationMeta.md#description)
 - [id](ToastNotificationMeta.md#id)
@@ -19,8 +20,26 @@
 - [millis](ToastNotificationMeta.md#millis)
 - [title](ToastNotificationMeta.md#title)
 
+### UI Methods
+
+- [onActionButtonClick](ToastNotificationMeta.md#onactionbuttonclick)
+
 ## UI Properties
 
+### actionButtonLabel
+
+• `Optional` **actionButtonLabel**: `string`
+
+#### Inherited from
+
+[ToastDescriptor](ToastDescriptor.md).[actionButtonLabel](ToastDescriptor.md#actionbuttonlabel)
+
+#### Defined in
+
+[packages/framework/esm-styleguide/src/toasts/toast.component.tsx:17](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-styleguide/src/toasts/toast.component.tsx#L17)
+
+___
+
 ### critical
 
 • `Optional` **critical**: `boolean`
@@ -31,7 +50,7 @@
 
 #### Defined in
 
-[packages/framework/esm-styleguide/src/toasts/toast.component.tsx:17](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-styleguide/src/toasts/toast.component.tsx#L17)
+[packages/framework/esm-styleguide/src/toasts/toast.component.tsx:19](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-styleguide/src/toasts/toast.component.tsx#L19)
 
 ___
 
@@ -55,7 +74,7 @@ ___
 
 #### Defined in
 
-[packages/framework/esm-styleguide/src/toasts/toast.component.tsx:23](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-styleguide/src/toasts/toast.component.tsx#L23)
+[packages/framework/esm-styleguide/src/toasts/toast.component.tsx:25](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-styleguide/src/toasts/toast.component.tsx#L25)
 
 ___
 
@@ -69,7 +88,7 @@ ___
 
 #### Defined in
 
-[packages/framework/esm-styleguide/src/toasts/toast.component.tsx:16](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-styleguide/src/toasts/toast.component.tsx#L16)
+[packages/framework/esm-styleguide/src/toasts/toast.component.tsx:18](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-styleguide/src/toasts/toast.component.tsx#L18)
 
 ___
 
@@ -83,7 +102,7 @@ ___
 
 #### Defined in
 
-[packages/framework/esm-styleguide/src/toasts/toast.component.tsx:19](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-styleguide/src/toasts/toast.component.tsx#L19)
+[packages/framework/esm-styleguide/src/toasts/toast.component.tsx:21](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-styleguide/src/toasts/toast.component.tsx#L21)
 
 ___
 
@@ -97,4 +116,22 @@ ___
 
 #### Defined in
 
-[packages/framework/esm-styleguide/src/toasts/toast.component.tsx:18](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-styleguide/src/toasts/toast.component.tsx#L18)
+[packages/framework/esm-styleguide/src/toasts/toast.component.tsx:20](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-styleguide/src/toasts/toast.component.tsx#L20)
+
+## UI Methods
+
+### onActionButtonClick
+
+▸ `Optional` **onActionButtonClick**(): `void`
+
+#### Returns
+
+`void`
+
+#### Inherited from
+
+[ToastDescriptor](ToastDescriptor.md).[onActionButtonClick](ToastDescriptor.md#onactionbuttonclick)
+
+#### Defined in
+
+[packages/framework/esm-styleguide/src/toasts/toast.component.tsx:16](https://github.com/openmrs/openmrs-esm-core/blob/main/packages/framework/esm-styleguide/src/toasts/toast.component.tsx#L16)
diff --git a/packages/framework/esm-globals/src/events.ts b/packages/framework/esm-globals/src/events.ts
index a48645721..d2504e682 100644
--- a/packages/framework/esm-globals/src/events.ts
+++ b/packages/framework/esm-globals/src/events.ts
@@ -60,6 +60,8 @@ export interface ShowToastEvent {
   kind?: 'error' | 'info' | 'info-square' | 'success' | 'warning' | 'warning-alt';
   title?: string;
   millis?: number;
+  actionButtonLabel?: string | any;
+  onActionButtonClick?: () => void;
 }
 
 /** @category UI */
@@ -77,7 +79,7 @@ export interface ShowSnackbarEvent {
 const notificationShownName = 'openmrs:notification-shown';
 const actionableNotificationShownName = 'openmrs:actionable-notification-shown';
 const toastShownName = 'openmrs:toast-shown';
-const SnackbarShownName = 'openmrs:snack-bar-shown';
+const snackbarShownName = 'openmrs:snack-bar-shown';
 
 export function dispatchNotificationShown(data: ShowNotificationEvent) {
   window.dispatchEvent(new CustomEvent(notificationShownName, { detail: data }));
@@ -88,7 +90,7 @@ export function dispatchActionableNotificationShown(data: ShowActionableNotifica
 }
 
 export function dispatchSnackbarShown(data: ShowSnackbarEvent) {
-  window.dispatchEvent(new CustomEvent(SnackbarShownName, { detail: data }));
+  window.dispatchEvent(new CustomEvent(snackbarShownName, { detail: data }));
 }
 
 /** @category UI */
@@ -115,6 +117,6 @@ export function subscribeToastShown(cb: (data: ShowToastEvent) => void) {
 /** @category UI */
 export function subscribeSnackbarShown(cb: (data: ShowSnackbarEvent) => void) {
   const handler = (ev: CustomEvent) => cb(ev.detail);
-  window.addEventListener(SnackbarShownName, handler);
-  return () => window.removeEventListener(SnackbarShownName, handler);
+  window.addEventListener(snackbarShownName, handler);
+  return () => window.removeEventListener(snackbarShownName, handler);
 }
diff --git a/packages/framework/esm-styleguide/src/_overrides.scss b/packages/framework/esm-styleguide/src/_overrides.scss
index 36bb6d1c0..d2bf52ad4 100644
--- a/packages/framework/esm-styleguide/src/_overrides.scss
+++ b/packages/framework/esm-styleguide/src/_overrides.scss
@@ -621,3 +621,10 @@ html[dir='rtl'] {
     }
   }
 }
+
+// This is to override the green border and background color which we apply to tertiary buttons. Since this in the Notification carbon uses blue.
+.cds--actionable-notification__action-button.cds--btn--tertiary {
+  background-color: transparent;
+  border: 1px solid #0f62fe;
+  color: #0f62fe;
+}
diff --git a/packages/framework/esm-styleguide/src/snackbars/_snackbars.scss b/packages/framework/esm-styleguide/src/snackbars/_snackbars.scss
index c8c3c6762..ad186dbf1 100644
--- a/packages/framework/esm-styleguide/src/snackbars/_snackbars.scss
+++ b/packages/framework/esm-styleguide/src/snackbars/_snackbars.scss
@@ -4,7 +4,6 @@
   z-index: 1000;
   position: fixed;
   width: 20rem;
-  display: flex;
   bottom: 1rem;
   left: 1rem;
   gap: 0.5rem;
diff --git a/packages/framework/esm-styleguide/src/toasts/_toasts.scss b/packages/framework/esm-styleguide/src/toasts/_toasts.scss
index 7583445fe..d4eaa10f2 100644
--- a/packages/framework/esm-styleguide/src/toasts/_toasts.scss
+++ b/packages/framework/esm-styleguide/src/toasts/_toasts.scss
@@ -1,8 +1,12 @@
 .omrs-toasts-container {
+  display: flex;
+  flex-direction: column;
   z-index: 100000;
   position: fixed;
+  width: 20rem;
   top: 4rem;
   right: 1rem;
+  gap: 0.5rem;
 }
 
 .omrs-toast-mounting,
diff --git a/packages/framework/esm-styleguide/src/toasts/active-toasts.component.tsx b/packages/framework/esm-styleguide/src/toasts/active-toasts.component.tsx
index 0484ee689..18cac7558 100644
--- a/packages/framework/esm-styleguide/src/toasts/active-toasts.component.tsx
+++ b/packages/framework/esm-styleguide/src/toasts/active-toasts.component.tsx
@@ -18,7 +18,12 @@ const ActiveToasts: React.FC<ActiveToastsProps> = ({ subject }) => {
     const subscription = subject.subscribe((toast) =>
       setToasts((toasts) => [
         ...toasts.filter(
-          (t) => t.description !== toast.description || t.kind !== toast.kind || t.title !== toast.title,
+          (t) =>
+            t.description !== toast.description ||
+            t.kind !== toast.kind ||
+            t.title !== toast.title ||
+            t.actionButtonLabel !== toast.actionButtonLabel ||
+            t.onActionButtonClick !== toast.onActionButtonClick,
         ),
         toast,
       ]),
diff --git a/packages/framework/esm-styleguide/src/toasts/toast.component.tsx b/packages/framework/esm-styleguide/src/toasts/toast.component.tsx
index f26f1ffcc..263a75023 100644
--- a/packages/framework/esm-styleguide/src/toasts/toast.component.tsx
+++ b/packages/framework/esm-styleguide/src/toasts/toast.component.tsx
@@ -1,6 +1,6 @@
 /** @module @category UI */
-import React, { useEffect, useState } from 'react';
-import { ToastNotification } from '@carbon/react';
+import React, { useEffect, useCallback, useState } from 'react';
+import { ActionableNotification } from '@carbon/react';
 
 const defaultOptions = {
   millis: 5000,
@@ -13,6 +13,8 @@ export interface ToastProps {
 
 export interface ToastDescriptor {
   description: React.ReactNode;
+  onActionButtonClick?: () => void;
+  actionButtonLabel?: string;
   kind?: ToastType;
   critical?: boolean;
   title?: string;
@@ -26,25 +28,38 @@ export interface ToastNotificationMeta extends ToastDescriptor {
 export type ToastType = 'error' | 'info' | 'info-square' | 'success' | 'warning' | 'warning-alt';
 
 export const Toast: React.FC<ToastProps> = ({ toast, closeToast }) => {
-  const { description, kind, critical, title, millis = defaultOptions.millis } = toast;
-
+  const {
+    description,
+    kind,
+    critical,
+    title,
+    actionButtonLabel,
+    onActionButtonClick = () => {},
+    millis = defaultOptions.millis,
+  } = toast;
   const [waitingForTime, setWaitingForTime] = useState(true);
+  const handleActionClick = useCallback(() => {
+    onActionButtonClick();
+    closeToast();
+  }, [closeToast, onActionButtonClick]);
 
   useEffect(() => {
-    if (waitingForTime) {
+    if (!actionButtonLabel && waitingForTime) {
       const timeoutId = setTimeout(closeToast, millis);
       return () => clearTimeout(timeoutId);
     }
-  }, [waitingForTime]);
+  }, [closeToast, waitingForTime, millis, actionButtonLabel]);
 
   return (
     <div onMouseEnter={() => setWaitingForTime(false)} onMouseLeave={() => setWaitingForTime(true)}>
-      <ToastNotification
+      <ActionableNotification
+        actionButtonLabel={actionButtonLabel}
         kind={kind || 'info'}
         lowContrast={critical}
         subtitle={description}
         title={title || ''}
-        timeout={millis}
+        onActionButtonClick={handleActionClick}
+        onClose={closeToast}
       />
     </div>
   );