diff --git a/extension/package.json b/extension/package.json
index a4f3b9d09..008859ada 100644
--- a/extension/package.json
+++ b/extension/package.json
@@ -99,7 +99,7 @@
     "@headlessui/react": "^2.2.0",
     "date-fns": "^4.1.0",
     "lucide-react": "^0.468.0",
-    "react-toastify": "10.0.6",
+    "react-toastify": "11.0.0",
     "react-router": "7.0.2",
     "react-stick": "^5.0.6",
     "zod": "^3.23.8"
diff --git a/extension/src/components/toasts/Toast.tsx b/extension/src/components/toasts/Toast.tsx
index e1d676d82..98e67389b 100644
--- a/extension/src/components/toasts/Toast.tsx
+++ b/extension/src/components/toasts/Toast.tsx
@@ -6,33 +6,47 @@ import {
   toast as baseToast,
   Slide,
   type ToastOptions as BaseToastOptions,
+  type ToastContent,
+  type ToastContentProps,
 } from 'react-toastify'
 
-type ToastRenderProps = {
-  dismiss: () => void
-}
+type ToastData = { message: ReactNode; title: string }
 
-type ToastRenderFn = (props: ToastRenderProps) => ReactNode
+export type DerivedToastProps = ToastContentProps<ToastData>
+
+export const Toast = ({
+  children,
+  className,
+}: PropsWithChildren<{ className: string }>) => (
+  <div
+    className={classNames(
+      'flex max-w-full flex-col gap-1 rounded-md border p-2 text-sm shadow-lg',
+      className,
+    )}
+  >
+    {children}
+  </div>
+)
 
 type ToastOptions = Omit<
   BaseToastOptions,
-  'toastId' | 'closeButton' | 'hideProgressBar' | 'transition'
->
+  'toastId' | 'closeButton' | 'hideProgressBar' | 'transition' | 'className'
+> & { data: ToastData }
 
 export const toast = (
-  renderFn: ToastRenderFn,
-  { className, ...options }: ToastOptions = {},
+  ToastComponent: ToastContent<ToastData>,
+  options: ToastOptions,
 ) => {
   const id = nanoid()
 
   const dismiss = () => baseToast.dismiss(id)
 
-  baseToast(renderFn({ dismiss }), {
+  baseToast(ToastComponent, {
     toastId: id,
     closeButton: false,
     hideProgressBar: true,
     transition: Slide,
-    className: `mx-4 mt-2 flex max-w-full flex-col gap-1 rounded-md border p-2 text-sm shadow-lg ${className}`,
+    className: `p-0 m-4 `,
 
     ...options,
   })
@@ -47,6 +61,8 @@ const Title = ({
   <h2 className={classNames('font-semibold', className)}>{children}</h2>
 )
 
+Toast.Title = Title
+
 const Dismiss = ({
   children,
   className,
@@ -63,4 +79,4 @@ const Dismiss = ({
   </button>
 )
 
-export const Toast = { Title, Dismiss }
+Toast.Dismiss = Dismiss
diff --git a/extension/src/components/toasts/errorToast.tsx b/extension/src/components/toasts/errorToast.tsx
index 6fd8dc7ed..593f39171 100644
--- a/extension/src/components/toasts/errorToast.tsx
+++ b/extension/src/components/toasts/errorToast.tsx
@@ -1,24 +1,26 @@
-import { Toast, toast } from './Toast'
+import { type DerivedToastProps, Toast, toast } from './Toast'
 import type { ToastProps } from './ToastProps'
 
-export const errorToast = ({ title, message }: ToastProps) =>
-  toast(
-    ({ dismiss }) => (
-      <>
-        <div className="flex items-center justify-between gap-4">
-          {title && <Toast.Title className="text-white">{title}</Toast.Title>}
+const ErrorToast = ({
+  data: { title, message },
+  closeToast,
+}: DerivedToastProps) => (
+  <Toast className="border-red-500/60 bg-red-500 dark:border-red-700">
+    <div className="flex items-center justify-between gap-4">
+      {title && <Toast.Title className="text-white">{title}</Toast.Title>}
+
+      <Toast.Dismiss
+        className="text-white hover:bg-white/20"
+        onDismiss={closeToast}
+      />
+    </div>
 
-          <Toast.Dismiss
-            className="text-white hover:bg-white/20"
-            onDismiss={dismiss}
-          />
-        </div>
+    <div className="text-red-50">{message}</div>
+  </Toast>
+)
 
-        <div className="text-red-50">{message}</div>
-      </>
-    ),
-    {
-      className: 'border-red-500/60 bg-red-500 dark:border-red-700',
-      autoClose: false,
-    },
-  )
+export const errorToast = ({ title, message }: ToastProps) =>
+  toast(ErrorToast, {
+    data: { title, message },
+    autoClose: false,
+  })
diff --git a/extension/src/components/toasts/infoToast.tsx b/extension/src/components/toasts/infoToast.tsx
index e3f8ce71e..b9c0632a8 100644
--- a/extension/src/components/toasts/infoToast.tsx
+++ b/extension/src/components/toasts/infoToast.tsx
@@ -1,28 +1,27 @@
-import { Toast, toast } from './Toast'
+import { Toast, toast, type DerivedToastProps } from './Toast'
 import type { ToastProps } from './ToastProps'
 
-export const infoToast = ({ title, message }: ToastProps) =>
-  toast(
-    ({ dismiss }) => (
-      <>
-        <div className="flex items-center justify-between gap-4">
-          {title && (
-            <Toast.Title className="text-zinc-50 dark:text-zinc-900">
-              {title}
-            </Toast.Title>
-          )}
+const InfoToast = ({
+  data: { title, message },
+  closeToast,
+}: DerivedToastProps) => (
+  <Toast className="border-zinc-800/80 bg-zinc-900 dark:border-zinc-300/80 dark:bg-zinc-100">
+    <div className="flex items-center justify-between gap-4">
+      {title && (
+        <Toast.Title className="text-zinc-50 dark:text-zinc-900">
+          {title}
+        </Toast.Title>
+      )}
+
+      <Toast.Dismiss
+        className="text-zinc-50 hover:bg-white/20 dark:text-zinc-900 dark:hover:bg-zinc-900/10"
+        onDismiss={closeToast}
+      />
+    </div>
 
-          <Toast.Dismiss
-            className="text-zinc-50 hover:bg-white/20 dark:text-zinc-900 dark:hover:bg-zinc-900/10"
-            onDismiss={dismiss}
-          />
-        </div>
+    <div className="text-zinc-200 dark:text-zinc-700">{message}</div>
+  </Toast>
+)
 
-        <div className="text-zinc-200 dark:text-zinc-700">{message}</div>
-      </>
-    ),
-    {
-      className:
-        'border-zinc-800/80 bg-zinc-900 dark:border-zinc-300/80 dark:bg-zinc-100',
-    },
-  )
+export const infoToast = ({ title, message }: ToastProps) =>
+  toast(InfoToast, { data: { title, message } })
diff --git a/extension/src/components/toasts/successToast.tsx b/extension/src/components/toasts/successToast.tsx
index 6998f8964..102d68b6d 100644
--- a/extension/src/components/toasts/successToast.tsx
+++ b/extension/src/components/toasts/successToast.tsx
@@ -1,28 +1,27 @@
-import { Toast, toast } from './Toast'
+import { Toast, toast, type DerivedToastProps } from './Toast'
 import type { ToastProps } from './ToastProps'
 
-export const successToast = ({ title, message }: ToastProps) =>
-  toast(
-    ({ dismiss }) => (
-      <>
-        <div className="flex items-center justify-between gap-4">
-          {title && (
-            <Toast.Title className="text-green-900 dark:text-white">
-              {title}
-            </Toast.Title>
-          )}
+const SuccessToast = ({
+  data: { title, message },
+  closeToast,
+}: DerivedToastProps) => (
+  <Toast className="border-green-300/80 bg-green-200 dark:border-green-500/80 dark:bg-green-600">
+    <div className="flex items-center justify-between gap-4">
+      {title && (
+        <Toast.Title className="text-green-900 dark:text-white">
+          {title}
+        </Toast.Title>
+      )}
+
+      <Toast.Dismiss
+        className="text-green-900 hover:bg-green-500/20 dark:text-white dark:hover:bg-white/10"
+        onDismiss={closeToast}
+      />
+    </div>
 
-          <Toast.Dismiss
-            className="text-green-900 hover:bg-green-500/20 dark:text-white dark:hover:bg-white/10"
-            onDismiss={dismiss}
-          />
-        </div>
+    <div className="text-green-700 dark:text-green-50">{message}</div>
+  </Toast>
+)
 
-        <div className="text-green-700 dark:text-green-50">{message}</div>
-      </>
-    ),
-    {
-      className:
-        'border-green-300/80 bg-green-200 dark:border-green-500/80 dark:bg-green-600',
-    },
-  )
+export const successToast = ({ title, message }: ToastProps) =>
+  toast(SuccessToast, { data: { message, title } })
diff --git a/extension/src/panel/app.tsx b/extension/src/panel/app.tsx
index d2792a5f4..e17196ece 100644
--- a/extension/src/panel/app.tsx
+++ b/extension/src/panel/app.tsx
@@ -6,7 +6,6 @@ import { StrictMode } from 'react'
 import { createRoot } from 'react-dom/client'
 import { createHashRouter, RouterProvider } from 'react-router'
 import { ToastContainer } from 'react-toastify'
-import 'react-toastify/dist/ReactToastify.min.css'
 import '../global.css'
 import { pages } from './pages'
 import { ProvidePort } from './port-handling'
diff --git a/extension/src/panel/pages/$activeRouteId/transactions/Transactions.tsx b/extension/src/panel/pages/$activeRouteId/transactions/Transactions.tsx
index 2e9c23623..efadedc7f 100644
--- a/extension/src/panel/pages/$activeRouteId/transactions/Transactions.tsx
+++ b/extension/src/panel/pages/$activeRouteId/transactions/Transactions.tsx
@@ -2,6 +2,7 @@ import { getChainId } from '@/chains'
 import { CopyToClipboard, GhostButton, Info, Page } from '@/components'
 import { useExecutionRoute } from '@/execution-routes'
 import { useProviderBridge } from '@/inject-bridge'
+import { usePilotIsReady } from '@/port-handling'
 import { ForkProvider } from '@/providers'
 import { useProvider } from '@/providers-ui'
 import { useDispatch, useTransactions } from '@/state'
@@ -20,6 +21,7 @@ export const Transactions = () => {
   const dispatch = useDispatch()
   const provider = useProvider()
   const route = useExecutionRoute()
+  const pilotIsReady = usePilotIsReady()
 
   useProviderBridge({
     provider,
@@ -101,7 +103,7 @@ export const Transactions = () => {
       </Page.Content>
 
       <Page.Footer>
-        {!route.initiator && (
+        {!route.initiator && pilotIsReady && (
           <CopyToClipboard
             data={transactions.map((txState) => txState.transaction)}
             disabled={transactions.length === 0}
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 3957e6a6b..e560066d1 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -129,8 +129,8 @@ importers:
         specifier: ^5.0.6
         version: 5.0.6(react-dom@19.0.0(react@19.0.0))(react@19.0.0)
       react-toastify:
-        specifier: 10.0.6
-        version: 10.0.6(react-dom@19.0.0(react@19.0.0))(react@19.0.0)
+        specifier: 11.0.0
+        version: 11.0.0(react-dom@19.0.0(react@19.0.0))(react@19.0.0)
       zod:
         specifier: ^3.23.8
         version: 3.24.1
@@ -6032,11 +6032,11 @@ packages:
       react: '>=16.8.0'
       react-dom: '>=16.8.0'
 
-  react-toastify@10.0.6:
-    resolution: {integrity: sha512-yYjp+omCDf9lhZcrZHKbSq7YMuK0zcYkDFTzfRFgTXkTFHZ1ToxwAonzA4JI5CxA91JpjFLmwEsZEgfYfOqI1A==}
+  react-toastify@11.0.0:
+    resolution: {integrity: sha512-NLTt0hNNlVZPLnY+uzUvmE2H2jRHUpaPi7H3+84+3fMjZSpfngyL/r+2VcaepNItWuN0BCBiZdVluXixXYSFmw==}
     peerDependencies:
-      react: '>=18'
-      react-dom: '>=18'
+      react: ^18 || ^19
+      react-dom: ^18 || ^19
 
   react-transition-group@4.4.5:
     resolution: {integrity: sha512-pZcd1MCJoiKiBR2NRxeCRg13uCXbydPnmB4EOeRrY7480qNWO8IIgQG6zlDkm6uRMsURXPuKq0GWtiM59a5Q6g==}
@@ -14395,7 +14395,7 @@ snapshots:
       requestidlecallback: 0.3.0
       substyle: 9.4.1(react@19.0.0)
 
-  react-toastify@10.0.6(react-dom@19.0.0(react@19.0.0))(react@19.0.0):
+  react-toastify@11.0.0(react-dom@19.0.0(react@19.0.0))(react@19.0.0):
     dependencies:
       clsx: 2.1.1
       react: 19.0.0