feat: support order change

web/app/components/workflow/nodes/list-filter/components/sub-variable-picker.tsx

@@ -1,6 +1,7 @@
 'use client'
 import type { FC } from 'react'
 import React, { useCallback } from 'react'
+import { useTranslation } from 'react-i18next'
 import { SUB_VARIABLES } from '../../if-else/default'
 import type { Item } from '@/app/components/base/select'
 import { SimpleSelect as Select } from '@/app/components/base/select'
@@ -18,6 +19,7 @@ const SubVariablePicker: FC<Props> = ({
   onChange,
   className,
 }) => {
+  const { t } = useTranslation()
   const subVarOptions = SUB_VARIABLES.map(item => ({
     value: item,
     name: item,
@@ -46,7 +48,7 @@ const SubVariablePicker: FC<Props> = ({
         defaultValue={value}
         onSelect={handleChange}
         className='!text-[13px]'
-        placeholder='Select sub variable key'
+        placeholder={t('workflow.nodes.listFilter.selectVariableKeyPlaceholder')!}
         optionClassName='pl-4 pr-5 py-0'
         renderOption={renderOption}
       />

web/app/components/workflow/nodes/list-filter/panel.tsx

@@ -32,6 +32,7 @@ const Panel: FC<NodePanelProps<ListFilterNodeType>> = ({
     handleFilterChange,
     handleLimitChange,
     handleOrderByEnabledChange,
+    handleOrderByKeyChange,
     handleOrderByTypeChange,
   } = useConfig(id, data)
 
@@ -81,7 +82,7 @@ const Panel: FC<NodePanelProps<ListFilterNodeType>> = ({
                   <div className='grow mr-2'>
                     <SubVariablePicker
                       value={inputs.order_by.key as string}
-                      onChange={() => { }}
+                      onChange={handleOrderByKeyChange}
                     />
                   </div>
                 )}

web/app/components/workflow/nodes/list-filter/use-config.ts

@@ -106,6 +106,13 @@ const useConfig = (id: string, payload: ListFilterNodeType) => {
     setInputs(newInputs)
   }, [inputs, setInputs])
 
+  const handleOrderByKeyChange = useCallback((key: string) => {
+    const newInputs = produce(inputs, (draft) => {
+      draft.order_by.key = key
+    })
+    setInputs(newInputs)
+  }, [inputs, setInputs])
+
   const handleOrderByTypeChange = useCallback((type: OrderBy) => {
     return () => {
       const newInputs = produce(inputs, (draft) => {
@@ -126,6 +133,7 @@ const useConfig = (id: string, payload: ListFilterNodeType) => {
     handleFilterChange,
     handleLimitChange,
     handleOrderByEnabledChange,
+    handleOrderByKeyChange,
     handleOrderByTypeChange,
   }
 }

web/i18n/en-US/workflow.ts

@@ -562,6 +562,7 @@ const translation = {
     listFilter: {
       inputVar: 'Input Variable',
       filterCondition: 'Filter Condition',
+      selectVariableKeyPlaceholder: 'Select sub variable key',
       limit: 'Limit',
       orderBy: 'Order by',
       asc: 'ASC',

web/i18n/zh-Hans/workflow.ts

@@ -562,6 +562,7 @@ const translation = {
     listFilter: {
       inputVar: '输入变量',
       filterCondition: '过滤条件',
+      selectVariableKeyPlaceholder: '选择子变量的 Key',
       limit: '限制',
       orderBy: '排序',
       asc: '升序',