From 477ca48844bc0e36dd8ad1af11ea1206eea5823e Mon Sep 17 00:00:00 2001
From: "junjie.miao" <junjie.miao@goupwith.com>
Date: Sun, 27 Apr 2025 14:42:01 +0800
Subject: [PATCH] feat: <Field> support 'required' is in red * displayed

---
 .../components/workflow/nodes/_base/components/field.tsx    | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/web/app/components/workflow/nodes/_base/components/field.tsx b/web/app/components/workflow/nodes/_base/components/field.tsx
index 14e850b99a..aadcea1065 100644
--- a/web/app/components/workflow/nodes/_base/components/field.tsx
+++ b/web/app/components/workflow/nodes/_base/components/field.tsx
@@ -17,6 +17,7 @@ type Props = {
   children?: React.JSX.Element | string | null
   operations?: React.JSX.Element
   inline?: boolean
+  required?: boolean
 }
 
 const Field: FC<Props> = ({
@@ -28,6 +29,7 @@ const Field: FC<Props> = ({
   operations,
   inline,
   supportFold,
+  required,
 }) => {
   const [fold, {
     toggle: toggleFold,
@@ -38,7 +40,9 @@ const Field: FC<Props> = ({
         onClick={() => supportFold && toggleFold()}
         className={cn('flex items-center justify-between', supportFold && 'cursor-pointer')}>
         <div className='flex h-6 items-center'>
-          <div className={cn(isSubTitle ? 'system-xs-medium-uppercase text-text-tertiary' : 'system-sm-semibold-uppercase text-text-secondary')}>{title}</div>
+          <div className={cn(isSubTitle ? 'system-xs-medium-uppercase text-text-tertiary' : 'system-sm-semibold-uppercase text-text-secondary')}>
+            {title} {required && <span className='text-text-destructive'>*</span>}
+          </div>
           {tooltip && (
             <Tooltip
               popupContent={tooltip}