diff --git a/packages/neuron-ui/src/components/OfflineSign/index.tsx b/packages/neuron-ui/src/components/OfflineSign/index.tsx
index ebe5b8159b..8916a2077b 100644
--- a/packages/neuron-ui/src/components/OfflineSign/index.tsx
+++ b/packages/neuron-ui/src/components/OfflineSign/index.tsx
@@ -3,7 +3,8 @@ import { useTranslation } from 'react-i18next'
 import { useNavigate } from 'react-router-dom'
 import { isSuccessResponse, RoutePath, useDidMount } from 'utils'
 import Dialog from 'widgets/Dialog'
-import { addNotification, useDispatch, useState as useGlobalState } from 'states'
+import AlertDialog from 'widgets/AlertDialog'
+import { useDispatch, useState as useGlobalState } from 'states'
 import { broadcastTransaction, getCurrentWallet, OfflineSignStatus } from 'services/remote'
 import { ReactComponent as HardWalletIcon } from 'widgets/Icons/HardWallet.svg'
 import OfflineSignDialog from '../OfflineSignDialog'
@@ -20,6 +21,7 @@ const OfflineSign = () => {
   const [isBroadCasting, setIsBroadcasting] = useState(false)
   const [t] = useTranslation()
   const dispatch = useDispatch()
+  const [errMsg, setErrMsg] = useState('')
 
   const { filePath, json } = loadedTransaction
 
@@ -60,19 +62,12 @@ const OfflineSign = () => {
       if (isSuccessResponse(res)) {
         navigate(RoutePath.History)
       } else {
-        addNotification({
-          type: 'alert',
-          timestamp: +new Date(),
-          code: res.status,
-          content: typeof res.message === 'string' ? res.message : res.message.content,
-          meta: typeof res.message === 'string' ? undefined : res.message.meta,
-        })(dispatch)
-        onBack()
+        setErrMsg(typeof res.message === 'string' ? res.message : res.message.content || '')
       }
     } finally {
       setIsBroadcasting(false)
     }
-  }, [wallet, json, navigate, dispatch, onBack])
+  }, [wallet, json, navigate, dispatch])
 
   useDidMount(() => {
     getCurrentWallet().then(res => {
@@ -93,43 +88,52 @@ const OfflineSign = () => {
   }
 
   return (
-    <Dialog
-      show={!isSigning}
-      title={t('offline-sign.title')}
-      cancelText={t('offline-sign.actions.cancel')}
-      onCancel={onBack}
-      confirmText={
-        signStatus === OfflineSignStatus.Signed ? t('offline-sign.actions.broadcast') : t('offline-sign.actions.sign')
-      }
-      isLoading={signStatus === OfflineSignStatus.Signed && isBroadCasting}
-      onConfirm={signStatus === OfflineSignStatus.Signed ? onBroadcast : onSign}
-    >
-      <div className={styles.main}>
-        <table>
-          <tbody>
-            <tr>
-              <td className={styles.first}>{t('offline-sign.json-file')}</td>
-              <td>{filePath}</td>
-            </tr>
-            <tr>
-              <td className={styles.first}>{t('offline-sign.status.label')}</td>
-              <td>{status}</td>
-            </tr>
-            <tr>
-              <td className={styles.first}>{t('offline-sign.wallet')}</td>
-              <td>
-                {wallet?.device ? <HardWalletIcon /> : null}
-                <span>{wallet?.name ?? ''}</span>
-              </td>
-            </tr>
-            <tr>
-              <td className={styles.first}>{t('offline-sign.content')}</td>
-            </tr>
-          </tbody>
-        </table>
-        <textarea disabled value={jsonContent} className={styles.textarea} />
-      </div>
-    </Dialog>
+    <>
+      <Dialog
+        show={!isSigning}
+        title={t('offline-sign.title')}
+        cancelText={t('offline-sign.actions.cancel')}
+        onCancel={onBack}
+        confirmText={
+          signStatus === OfflineSignStatus.Signed ? t('offline-sign.actions.broadcast') : t('offline-sign.actions.sign')
+        }
+        isLoading={signStatus === OfflineSignStatus.Signed && isBroadCasting}
+        onConfirm={signStatus === OfflineSignStatus.Signed ? onBroadcast : onSign}
+      >
+        <div className={styles.main}>
+          <table>
+            <tbody>
+              <tr>
+                <td className={styles.first}>{t('offline-sign.json-file')}</td>
+                <td>{filePath}</td>
+              </tr>
+              <tr>
+                <td className={styles.first}>{t('offline-sign.status.label')}</td>
+                <td>{status}</td>
+              </tr>
+              <tr>
+                <td className={styles.first}>{t('offline-sign.wallet')}</td>
+                <td>
+                  {wallet?.device ? <HardWalletIcon /> : null}
+                  <span>{wallet?.name ?? ''}</span>
+                </td>
+              </tr>
+              <tr>
+                <td className={styles.first}>{t('offline-sign.content')}</td>
+              </tr>
+            </tbody>
+          </table>
+          <textarea disabled value={jsonContent} className={styles.textarea} />
+        </div>
+      </Dialog>
+      <AlertDialog
+        show={!!errMsg}
+        title={t('message-types.alert')}
+        message={errMsg}
+        type="failed"
+        onCancel={() => setErrMsg('')}
+      />
+    </>
   )
 }
 
diff --git a/packages/neuron-ui/src/widgets/AlertDialog/alertDialog.module.scss b/packages/neuron-ui/src/widgets/AlertDialog/alertDialog.module.scss
index 36f68b5f08..ac08941983 100644
--- a/packages/neuron-ui/src/widgets/AlertDialog/alertDialog.module.scss
+++ b/packages/neuron-ui/src/widgets/AlertDialog/alertDialog.module.scss
@@ -4,6 +4,7 @@
   @include dialog-container;
   padding: 28px 24px 24px;
   text-align: center;
+  width: 456px;
 
   &::backdrop {
     @include overlay;
@@ -22,6 +23,7 @@
     line-height: 28px;
     margin: 0;
     color: var(--dialog-secondary-text-color);
+    word-break: break-word;
   }
 
   .actions {