From bb8552fa8106ae02000d1f51008dd2188f36ef0d Mon Sep 17 00:00:00 2001
From: catloversg <152669316+catloversg@users.noreply.github.com>
Date: Sun, 28 Sep 2025 13:25:52 +0700
Subject: [PATCH] UI: Prevent text from overflowing when script's args are too
 long in Active Scripts page (#2324)

---
 src/ui/ActiveScripts/RecentScriptAccordion.tsx | 4 +++-
 src/ui/ActiveScripts/WorkerScriptAccordion.tsx | 6 ++++--
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/ui/ActiveScripts/RecentScriptAccordion.tsx b/src/ui/ActiveScripts/RecentScriptAccordion.tsx
index 0af412d5f..dfdfa8f0d 100644
--- a/src/ui/ActiveScripts/RecentScriptAccordion.tsx
+++ b/src/ui/ActiveScripts/RecentScriptAccordion.tsx
@@ -77,7 +77,9 @@ export function RecentScriptAccordion(props: IProps): React.ReactElement {
               </TableRow>
               <TableRow>
                 <TableCell className={classes.noborder} colSpan={2}>
-                  <Typography>└ Args: {arrayToString(recentScript.runningScript.args)}</Typography>
+                  <Typography sx={{ overflowWrap: "anywhere" }}>
+                    └ Args: {arrayToString(recentScript.runningScript.args)}
+                  </Typography>
                 </TableCell>
               </TableRow>
               <TableRow>
diff --git a/src/ui/ActiveScripts/WorkerScriptAccordion.tsx b/src/ui/ActiveScripts/WorkerScriptAccordion.tsx
index bf9311d79..d2f852c7a 100644
--- a/src/ui/ActiveScripts/WorkerScriptAccordion.tsx
+++ b/src/ui/ActiveScripts/WorkerScriptAccordion.tsx
@@ -68,7 +68,7 @@ export function WorkerScriptAccordion(props: IProps): React.ReactElement {
       <ListItemButton onClick={() => setOpen((old) => !old)} component={Paper}>
         <ListItemText
           primary={
-            <Typography style={{ wordWrap: "break-word" }}>
+            <Typography sx={{ overflowWrap: "break-word" }}>
               └ {props.workerScript.name} {JSON.stringify(props.workerScript.args)}
             </Typography>
           }
@@ -89,7 +89,9 @@ export function WorkerScriptAccordion(props: IProps): React.ReactElement {
               </TableRow>
               <TableRow>
                 <TableCell className={classes.noborder} colSpan={2}>
-                  <Typography>└ Args: {arrayToString(props.workerScript.args)}</Typography>
+                  <Typography sx={{ overflowWrap: "anywhere" }}>
+                    └ Args: {arrayToString(props.workerScript.args)}
+                  </Typography>
                 </TableCell>
               </TableRow>
               <TableRow>