From e5e52ab4b9f8b30be1660dc74df7cacb1e826493 Mon Sep 17 00:00:00 2001
From: twwu <twwu@dify.ai>
Date: Tue, 2 Sep 2025 10:19:01 +0800
Subject: [PATCH] refactor(value-content): improve JSX formatting for
 readability in variable inspect component

---
 .../variable-inspect/value-content.tsx        | 30 ++++++++++---------
 1 file changed, 16 insertions(+), 14 deletions(-)

diff --git a/web/app/components/workflow/variable-inspect/value-content.tsx b/web/app/components/workflow/variable-inspect/value-content.tsx
index 65265904a2..b704abccc9 100644
--- a/web/app/components/workflow/variable-inspect/value-content.tsx
+++ b/web/app/components/workflow/variable-inspect/value-content.tsx
@@ -276,20 +276,22 @@ const ValueContent = ({
         {showTextEditor && (
           <>
             {isTruncated && <LargeDataAlert className='absolute left-3 right-3 top-1' />}
-            currentVar.value_type === 'string' ? (
-            <DisplayContent
-              type={ContentType.Markdown}
-              mdString={value as any}
-              readonly={textEditorDisabled}
-              handleTextChange={handleTextChange}
-            />
-            ) : <Textarea
-              readOnly={textEditorDisabled}
-              disabled={textEditorDisabled || isTruncated}
-              className={cn('h-full', isTruncated && 'pt-[48px]')}
-              value={value as any}
-              onChange={e => handleTextChange(e.target.value)}
-            />
+            {
+              currentVar.value_type === 'string' ? (
+                <DisplayContent
+                  type={ContentType.Markdown}
+                  mdString={value as any}
+                  readonly={textEditorDisabled}
+                  handleTextChange={handleTextChange}
+                />
+              ) : <Textarea
+                readOnly={textEditorDisabled}
+                disabled={textEditorDisabled || isTruncated}
+                className={cn('h-full', isTruncated && 'pt-[48px]')}
+                value={value as any}
+                onChange={e => handleTextChange(e.target.value)}
+              />
+            }
           </>
         )}
         {showBoolEditor && (