From efd42d9da0b81c9b5b150b5d837dc476f366b865 Mon Sep 17 00:00:00 2001
From: 0XE <83485408+XiaoYu0807@users.noreply.github.com>
Date: Wed, 5 Mar 2025 14:20:07 +0800
Subject: [PATCH] fix: ISSUES #2727 (#2913)

---
 src/components/connection/connection-detail.tsx | 16 +++++++++++++---
 1 file changed, 13 insertions(+), 3 deletions(-)

diff --git a/src/components/connection/connection-detail.tsx b/src/components/connection/connection-detail.tsx
index 3ee9da06..515fd90c 100644
--- a/src/components/connection/connection-detail.tsx
+++ b/src/components/connection/connection-detail.tsx
@@ -30,7 +30,13 @@ export const ConnectionDetail = forwardRef<ConnectionDetailRef>(
         anchorOrigin={{ vertical: "bottom", horizontal: "right" }}
         open={open}
         onClose={onClose}
-        sx={{ maxWidth: "520px" }}
+        sx={{
+          ".MuiSnackbarContent-root": {
+            maxWidth: "520px",
+            maxHeight: "480px",
+            overflowY: "auto",
+          },
+        }}
         message={
           detail ? (
             <InnerConnectionDetail data={detail} onClose={onClose} />
@@ -69,7 +75,10 @@ const InnerConnectionDetail = ({ data, onClose }: InnerProps) => {
       label: t("UL Speed"),
       value: parseTraffic(data.curUpload ?? -1).join(" ") + "/s",
     },
-    { label: t("Chains"), value: chains },
+    {
+      label: t("Chains"),
+      value: chains,
+    },
     { label: t("Rule"), value: rule },
     {
       label: t("Process"),
@@ -93,7 +102,8 @@ const InnerConnectionDetail = ({ data, onClose }: InnerProps) => {
     <Box sx={{ userSelect: "text" }}>
       {information.map((each) => (
         <div key={each.label}>
-          <b>{each.label}</b>: <span>{each.value}</span>
+          <b>{each.label}</b>
+          <span style={{ wordBreak: "break-all" }}>: {each.value}</span>
         </div>
       ))}