chore: if not align

web/app/components/workflow/nodes/_base/components/selector.tsx

@@ -16,6 +16,7 @@ type Props = {
   onChange: (value: any) => void
   uppercase?: boolean
   popupClassName?: string
+  itemClassName?: string
   readonly?: boolean
   showChecked?: boolean
 }
@@ -27,6 +28,7 @@ const TypeSelector: FC<Props> = ({
   onChange,
   uppercase,
   popupClassName,
+  itemClassName,
   readonly,
   showChecked,
 }) => {
@@ -64,7 +66,7 @@ const TypeSelector: FC<Props> = ({
                 setHide()
                 onChange(item.value)
               }}
-              className={cn(uppercase && 'uppercase', 'flex items-center h-[30px] justify-between min-w-[44px] px-3 rounded-lg cursor-pointer text-[13px] font-medium text-gray-700 hover:bg-gray-50')}
+              className={cn(itemClassName, uppercase && 'uppercase', 'flex items-center h-[30px] justify-between min-w-[44px] px-3 rounded-lg cursor-pointer text-[13px] font-medium text-gray-700 hover:bg-gray-50')}
             >
               <div>{item.label}</div>
               {showChecked && item.value === value && <Check className='text-primary-600 w-4 h-4' />}

web/app/components/workflow/nodes/if-else/components/condition-item.tsx

@@ -85,6 +85,7 @@ const Item: FC<ItemProps> = ({
   onLogicalOperatorToggle,
 }) => {
   const { t } = useTranslation()
+  const isValueReadOnly = [ComparisonOperator.empty, ComparisonOperator.notEmpty, ComparisonOperator.isNull, ComparisonOperator.isNotNull].includes(payload.comparison_operator)
 
   const handleVarReferenceChange = useCallback((value: ValueSelector) => {
     onChange({
@@ -140,8 +141,9 @@ const Item: FC<ItemProps> = ({
 
         <Selector
           popupClassName='top-[34px]'
+          itemClassName='capitalize'
           trigger={
-            <div className='shrink-0 whitespace-nowrap flex items-center h-8 justify-between px-2.5 rounded-lg bg-gray-100 capitalize'>
+            <div className='shrink-0 w-[100px] whitespace-nowrap flex items-center h-8 justify-between px-2.5 rounded-lg bg-gray-100 capitalize cursor-pointer'>
               <div className='text-[13px] font-normal text-gray-900'>{isComparisonOperatorNeedTranslate(payload.comparison_operator) ? t(`${i18nPrefix}.comparisonOperator.${payload.comparison_operator}`) : payload.comparison_operator}</div>
             </div>
           }
@@ -157,11 +159,11 @@ const Item: FC<ItemProps> = ({
         />
 
         <input
-          readOnly={readonly}
-          value={payload.value}
+          readOnly={readonly || isValueReadOnly}
+          value={!isValueReadOnly ? payload.value : ''}
           onChange={handleValueChange}
-          placeholder={t(`${i18nPrefix}.enterValue`)!}
-          className='max-w-[144px] h-8 leading-8 px-2.5  rounded-lg border-0 bg-gray-100  text-gray-900 text-[13px]  placeholder:text-gray-400 focus:outline-none focus:ring-1 focus:ring-inset focus:ring-gray-200'
+          placeholder={!isValueReadOnly ? t(`${i18nPrefix}.enterValue`)! : ''}
+          className='w-[80px] h-8 leading-8 px-2.5  rounded-lg border-0 bg-gray-100  text-gray-900 text-[13px]  placeholder:text-gray-400 focus:outline-none focus:ring-1 focus:ring-inset focus:ring-gray-200'
           type='text'
         />
 

web/i18n/en-US/workflow.ts

@@ -84,8 +84,8 @@ const translation = {
         'end with': 'end with',
         'is': 'is',
         'is not': 'is not',
-        'empty': 'empty',
-        'not empty': 'not empty',
+        'empty': 'is empty',
+        'not empty': 'is not empty',
         'null': 'is null',
         'not null': 'is not null',
       },