fix: unable to add new options to single/multi-select fields when appending rows

Author: Sky-FE

packages/sdk/src/components/cell-value-editor/CellEditorMain.tsx

@@ -15,8 +15,8 @@ import type {
   IUserCellValue,
   IUserFieldOptions,
 } from '@teable/core';
-import { FieldKeyType, FieldType } from '@teable/core';
-import { updateRecord } from '@teable/openapi';
+import { FieldType } from '@teable/core';
+import { temporaryPaste } from '@teable/openapi';
 import { useCallback, useEffect, useRef } from 'react';
 import { useTableId } from '../../hooks';
 import { transformSelectOptions } from '../cell-value';
@@ -46,27 +46,19 @@ export const CellEditorMain = (props: Omit<ICellValueEditor, 'wrapClassName' | '
   }, [cellValue]);
 
   const onOptionAdd = useCallback(
-    async (curValue: string | string[] | undefined, name: string) => {
-      if (!tableId || !recordId) return;
-      if (type !== FieldType.SingleSelect && type !== FieldType.MultipleSelect) return;
-      const appendValue =
-        type === FieldType.SingleSelect
-          ? name
-          : curValue
-            ? [...(curValue as string[]), name]
-            : [name];
+    async (name: string) => {
+      if (!tableId) return;
 
-      await updateRecord(tableId, recordId, {
-        fieldKeyType: FieldKeyType.Id,
-        typecast: true,
-        record: {
-          fields: {
-            [fieldId]: appendValue,
-          },
-        },
+      await temporaryPaste(tableId, {
+        content: name,
+        projection: [fieldId],
+        ranges: [
+          [0, 0],
+          [0, 0],
+        ],
       });
     },
-    [tableId, recordId, type, fieldId]
+    [tableId, fieldId]
   );
 
   switch (type) {

packages/sdk/src/components/editor/select/Editor.tsx

@@ -10,9 +10,7 @@ import { SelectEditorMain } from './EditorMain';
 
 const SelectEditorBase: ForwardRefRenderFunction<
   IEditorRef<string | string[] | undefined>,
-  ISelectEditorMain<boolean> & {
-    onOptionAdd?: (curValue: string | string[] | undefined, name: string) => Promise<void>;
-  }
+  ISelectEditorMain<boolean>
 > = (props, ref) => {
   const { value, options = [], isMultiple, onChange, className, style, readonly } = props;
   const [open, setOpen] = useState(false);

packages/sdk/src/components/editor/select/EditorMain.tsx

@@ -15,7 +15,7 @@ export interface ISelectEditorMain<T extends boolean> extends ICellEditor<ISelec
   isMultiple?: T;
   style?: React.CSSProperties;
   className?: string;
-  onOptionAdd?: (curValue: string | string[] | undefined, name: string) => Promise<void>;
+  onOptionAdd?: (optionName: string) => Promise<void>;
 }
 
 const getValue = (value?: string | string[]) => {
@@ -82,7 +82,7 @@ const SelectEditorMainBase: ForwardRefRenderFunction<
   const onOptionAddInner = async () => {
     if (!searchValue || preventAutoNewOptions) return;
     setSearchValue('');
-    await onOptionAdd?.(originValue, searchValue);
+    await onOptionAdd?.(searchValue);
     if (isMultiple) {
       const newValue = value.concat(searchValue);
       setValue(newValue);

packages/sdk/src/components/grid-enhancements/editor/GridSelectEditor.tsx

@@ -3,8 +3,8 @@ import type {
   ISingleSelectCellValue,
   IMultipleSelectCellValue,
 } from '@teable/core';
-import { FieldType, ColorUtils, FieldKeyType } from '@teable/core';
-import { updateRecord } from '@teable/openapi';
+import { FieldType, ColorUtils } from '@teable/core';
+import { temporaryPaste } from '@teable/openapi';
 import type { ForwardRefRenderFunction } from 'react';
 import { forwardRef, useCallback, useEffect, useImperativeHandle, useMemo, useRef } from 'react';
 import colors from 'tailwindcss/colors';
@@ -70,28 +70,19 @@ const GridSelectEditorBase: ForwardRefRenderFunction<
   };
 
   const onOptionAdd = useCallback(
-    async (curValue: string | string[] | undefined, name: string) => {
-      const recordId = record.id;
-      if (!tableId || !recordId) return;
-      if (fieldType !== FieldType.SingleSelect && fieldType !== FieldType.MultipleSelect) return;
-      const appendValue =
-        fieldType === FieldType.SingleSelect
-          ? name
-          : curValue
-            ? [...(curValue as string[]), name]
-            : [name];
+    async (name: string) => {
+      if (!tableId) return;
 
-      await updateRecord(tableId, recordId, {
-        fieldKeyType: FieldKeyType.Id,
-        typecast: true,
-        record: {
-          fields: {
-            [fieldId]: appendValue,
-          },
-        },
+      await temporaryPaste(tableId, {
+        content: name,
+        projection: [fieldId],
+        ranges: [
+          [0, 0],
+          [0, 0],
+        ],
       });
     },
-    [record.id, tableId, fieldType, fieldId]
+    [tableId, fieldId]
   );
 
   return (