fix(default-value): fix tag in RemoteSelect (#2306)

packages/core/client/src/schema-component/antd/form-item/FormItem.tsx

@@ -353,34 +353,7 @@ FormItem.Designer = function Designer() {
                 type: 'object',
                 title: t('Set default value'),
                 properties: {
-                  default:
+                  default: {
-                    //  isInvariable(interfaceConfig)
-                    // ? {
-                    //     ...(fieldSchemaWithoutRequired || {}),
-                    //     'x-decorator': 'FormItem',
-                    //     'x-component-props': {
-                    //       ...fieldSchema['x-component-props'],
-                    //       targetField,
-                    //       component:
-                    //         collectionField?.target && collectionField?.interface !== 'chinaRegion'
-                    //           ? 'AssociationSelect'
-                    //           : undefined,
-                    //       service: {
-                    //         resource: collectionField?.target,
-                    //       },
-                    //       style: {
-                    //         width: '100%',
-                    //         verticalAlign: 'top',
-                    //       },
-                    //     },
-                    //     name: 'default',
-                    //     title: t('Default value'),
-                    //     default: getFieldDefaultValue(fieldSchema, collectionField),
-                    //     'x-read-pretty': false,
-                    //     'x-disabled': false,
-                    //   }
-                    // :
-                    {
                     ...(fieldSchemaWithoutRequired || {}),
                     'x-decorator': 'FormItem',
                     'x-component': 'VariableInput',
@@ -393,6 +366,7 @@ FormItem.Designer = function Designer() {
                       className: defaultInputStyle,
                       renderSchemaComponent: function Com(props) {
                         const s = _.cloneDeep(fieldSchemaWithoutRequired) || ({} as Schema);
+
                         s.title = '';
                         s['x-read-pretty'] = false;
                         s['x-disabled'] = false;

packages/core/client/src/schema-component/antd/remote-select/RemoteSelect.tsx

@@ -35,6 +35,7 @@ const InternalRemoteSelect = connect(
       service = {},
       wait = 300,
       value,
+      defaultValue,
       objectValue,
       manual = true,
       mapOptions,
@@ -249,12 +250,13 @@ const InternalRemoteSelect = connect(
     };
 
     const options = useMemo(() => {
+      const v = value || defaultValue;
       if (!data?.data?.length) {
-        return value != null ? (Array.isArray(value) ? value : [value]) : [];
+        return v != null ? (Array.isArray(v) ? v : [v]) : [];
       }
-      const valueOptions = (value != null && (Array.isArray(value) ? value : [value])) || [];
+      const valueOptions = (v != null && (Array.isArray(v) ? v : [v])) || [];
       return uniqBy(data?.data?.concat(valueOptions) || [], fieldNames.value);
-    }, [data?.data, value]);
+    }, [value, defaultValue, data?.data, fieldNames.value]);
 
     const onDropdownVisibleChange = (visible) => {
       setOpen(visible);
@@ -264,6 +266,7 @@ const InternalRemoteSelect = connect(
       }
       firstRun.current = true;
     };
+
     return (
       <Select
         open={open}
@@ -276,6 +279,7 @@ const InternalRemoteSelect = connect(
         onDropdownVisibleChange={onDropdownVisibleChange}
         objectValue={objectValue}
         value={value}
+        defaultValue={defaultValue}
         {...others}
         loading={data! ? loading : true}
         options={mapOptionsToTags(options)}

packages/core/client/src/schema-component/antd/select/Select.tsx

@@ -3,10 +3,10 @@ import { connect, mapProps, mapReadPretty } from '@formily/react';
 import { isValid, toArr } from '@formily/shared';
 import { isPlainObject } from '@nocobase/utils/client';
 import type { SelectProps } from 'antd';
-import { Empty, Select as AntdSelect, Spin } from 'antd';
+import { Select as AntdSelect, Empty, Spin } from 'antd';
 import React from 'react';
 import { ReadPretty } from './ReadPretty';
-import { defaultFieldNames, FieldNames, getCurrentOptions } from './utils';
+import { FieldNames, defaultFieldNames, getCurrentOptions } from './utils';
 
 type Props = SelectProps<any, any> & {
   objectValue?: boolean;
@@ -19,7 +19,7 @@ type Props = SelectProps<any, any> & {
 const isEmptyObject = (val: any) => !isValid(val) || (typeof val === 'object' && Object.keys(val).length === 0);
 
 const ObjectSelect = (props: Props) => {
-  const { value, options, onChange, fieldNames, mode, loading, rawOptions, ...others } = props;
+  const { value, options, onChange, fieldNames, mode, loading, rawOptions, defaultValue, ...others } = props;
   const toValue = (v: any) => {
     if (isEmptyObject(v)) {
       return;
@@ -40,9 +40,11 @@ const ObjectSelect = (props: Props) => {
     }
     return currentOptions.shift();
   };
+
   return (
     <AntdSelect
       value={toValue(value)}
+      defaultValue={toValue(defaultValue)}
       allowClear
       labelInValue
       notFoundContent={loading ? <Spin /> : <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />}
@@ -78,13 +80,22 @@ const filterOption = (input, option) => (option?.label ?? '').toLowerCase().incl
 
 const InternalSelect = connect(
   (props: Props) => {
-    const { objectValue, loading, value, rawOptions, ...others } = props;
+    const { objectValue, loading, value, rawOptions, defaultValue, ...others } = props;
     let mode: any = props.multiple ? 'multiple' : props.mode;
     if (mode && !['multiple', 'tags'].includes(mode)) {
       mode = undefined;
     }
     if (objectValue) {
-      return <ObjectSelect rawOptions={rawOptions} {...others} value={value} mode={mode} loading={loading} />;
+      return (
+        <ObjectSelect
+          rawOptions={rawOptions}
+          {...others}
+          defaultValue={defaultValue}
+          value={value}
+          mode={mode}
+          loading={loading}
+        />
+      );
     }
     const toValue = (v) => {
       if (['tags', 'multiple'].includes(props.mode) || props.multiple) {
@@ -103,6 +114,7 @@ const InternalSelect = connect(
         popupMatchSelectWidth={false}
         notFoundContent={loading ? <Spin /> : <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />}
         value={toValue(value)}
+        defaultValue={toValue(defaultValue)}
         {...others}
         onChange={(changed) => {
           props.onChange?.(changed === undefined ? null : changed);