@nocobase/client-v2 2.1.6 → 2.1.7

package/src/flow/models/fields/AssociationFieldModel/PopupSubTableFieldModel/PopupSubTableFieldModel.tsx

@@ -203,6 +203,8 @@ const DisplayTable = (props) => {
     onSelectExitRecordClick,
     resetPage,
     allowCreate,
+    formValuesChangeEmitter,
+    onResetFieldValue,
   } = props;
   const [currentPage, setCurrentPage] = useState(1);
   const [currentPageSize, setCurrentPageSize] = useState(pageSize);
@@ -223,6 +225,18 @@ const DisplayTable = (props) => {
     resetPage && setCurrentPage(1);
   }, [resetPage]);
 
+  useEffect(() => {
+    if (!formValuesChangeEmitter?.on || !formValuesChangeEmitter?.off || !onResetFieldValue) return;
+    const listener = () => {
+      onResetFieldValue();
+      setTableData([]);
+    };
+    formValuesChangeEmitter.on('onFieldReset', listener);
+    return () => {
+      formValuesChangeEmitter.off('onFieldReset', listener);
+    };
+  }, [formValuesChangeEmitter, onResetFieldValue]);
+
   const pagination = useMemo(() => {
     return {
       current: currentPage, // 当前页码
@@ -237,7 +251,7 @@ const DisplayTable = (props) => {
         return t('Total {{count}} items', { count: total });
       },
     } as any;
-  }, [currentPage, currentPageSize, tableData]);
+  }, [currentPage, currentPageSize, tableData, t]);
 
   const columns = useMemo(() => {
     const cols = adjustColumnOrder(
@@ -421,10 +435,6 @@ export class PopupSubTableFieldModel extends AssociationFieldModel {
           currentPageSize,
         });
       };
-      // 监听表单reset
-      this.context.blockModel.emitter.on('onFieldReset', () => {
-        this.props?.onChange([]);
-      });
     }
   }
 
@@ -457,8 +467,21 @@ export class PopupSubTableFieldModel extends AssociationFieldModel {
   }
 
   public render() {
+    const fieldPathArray = this.context.fieldPathArray ?? this.parent?.context?.fieldPathArray;
+    const onResetFieldValue = () => {
+      const value = [];
+      this.setProps({ value });
+      this.context.blockModel?.setFieldValue?.(fieldPathArray, value);
+    };
     return (
-      <DisplayTable {...this.props} collection={this.collection} baseColumns={this.getBaseColumns(this)} model={this} />
+      <DisplayTable
+        {...this.props}
+        collection={this.collection}
+        baseColumns={this.getBaseColumns(this)}
+        model={this}
+        formValuesChangeEmitter={this.context.blockModel?.emitter}
+        onResetFieldValue={onResetFieldValue}
+      />
     );
   }
 }

package/src/flow/models/fields/AssociationFieldModel/RecordSelectFieldModel.tsx

@@ -99,6 +99,18 @@ export function collectAssociationHydrationCandidates(options: {
   return candidates;
 }
 
+export function getAssociationHydrationNamePath(model: any) {
+  return model?.context?.fieldPathArray ?? model?.context?.fieldPath ?? model?.props?.name;
+}
+
+export function getAssociationHydrationSetterContext(model: any) {
+  if (typeof model?.context?.setFormValue === 'function') {
+    return model.context;
+  }
+
+  return model?.context?.blockModel?.context;
+}
+
 function markAssociationHydrationDone(statusMap: Map<string, HydrateStatus>, tkKey: string | null | undefined) {
   if (!tkKey) return;
   statusMap.set(tkKey, 'done');
@@ -245,8 +257,8 @@ const LazySelect = (props: Readonly<LazySelectProps>) => {
     });
     if (!candidates.length) return;
 
-    const namePath = model?.props?.name ?? model?.context?.fieldPathArray;
-    const blockCtx: any = model?.context?.blockModel?.context;
+    const namePath = getAssociationHydrationNamePath(model);
+    const setterCtx: any = getAssociationHydrationSetterContext(model);
 
     candidates.forEach(({ item, tk, tkKey }) => {
       void (async () => {
@@ -268,8 +280,8 @@ const LazySelect = (props: Readonly<LazySelectProps>) => {
               })
             : merge;
 
-          if (blockCtx && typeof blockCtx.setFormValue === 'function' && namePath != null) {
-            await blockCtx.setFormValue(namePath, nextValue, {
+          if (setterCtx && typeof setterCtx.setFormValue === 'function' && namePath != null) {
+            await setterCtx.setFormValue(namePath, nextValue, {
               source: 'default',
               markExplicit: false,
               triggerEvent: false,

package/src/flow/models/fields/AssociationFieldModel/SubTableFieldModel/SubTableColumnModel.tsx

@@ -231,6 +231,20 @@ export function getLatestSubTableRowRecord(form: any, fieldIndex: unknown, fallb
   return typeof latestRecord === 'undefined' ? fallbackRecord : latestRecord;
 }
 
+export function buildSubTableColumnNamePath(
+  fieldPath: Array<string | number>,
+  rowIdx: number,
+  namePath: string | number,
+  rowFieldIndex: unknown,
+): Array<string | number> {
+  const currentRowPath = buildRowPathFromFieldIndex(rowFieldIndex);
+  if (currentRowPath?.length) {
+    return [...currentRowPath, namePath];
+  }
+
+  return [...fieldPath, rowIdx, namePath];
+}
+
 function shouldCommitImmediately(value: any) {
   if (Array.isArray(value)) {
     return true;
@@ -372,9 +386,18 @@ const MemoCell: React.FC<CellProps> = React.memo(
         {parent.mapSubModels('field', (action: FieldModel) => {
           const fieldPath = action.context.fieldPath.split('.');
           const namePath = fieldPath.pop();
+          if (typeof namePath === 'undefined') {
+            return null;
+          }
+          const fieldNamePath = buildSubTableColumnNamePath(fieldPath, rowIdx, namePath, rowFork?.context?.fieldIndex);
+          const formItemName = buildDynamicNamePath([...fieldPath, rowIdx, namePath], parentFieldIndex);
 
           const fork: any = action.createFork({}, `${id}`);
           fork.context.defineProperty('currentObject', { get: () => record });
+          fork.context.defineProperty('fieldPathArray', {
+            get: () => fieldNamePath,
+            cache: false,
+          });
           if (rowFork) {
             const itemOptions = rowFork.context.getPropertyOptions?.('item');
             const { value: _value, ...itemOptionsWithoutValue } = (itemOptions || {}) as any;
@@ -415,7 +438,7 @@ const MemoCell: React.FC<CellProps> = React.memo(
             <FormItem
               {...parent.props}
               key={id}
-              name={buildDynamicNamePath([...fieldPath, rowIdx, namePath], parentFieldIndex)}
+              name={formItemName}
               style={{ marginBottom: 0 }}
               showLabel={false}
               disabled={

package/src/flow/models/fields/AssociationFieldModel/SubTableFieldModel/SubTableField.tsx

@@ -70,6 +70,7 @@ export function SubTableField(props) {
     getCurrentValue,
     fieldPathArray,
     formValuesChangeEmitter,
+    onResetFieldValue,
   } = props;
   const [currentPage, setCurrentPage] = useState(1);
   const [currentPageSize, setCurrentPageSize] = useState(pageSize);
@@ -97,6 +98,17 @@ export function SubTableField(props) {
       formValuesChangeEmitter.off('formValuesChange', listener);
     };
   }, [fieldPathArray, formValuesChangeEmitter]);
+  useEffect(() => {
+    if (!formValuesChangeEmitter?.on || !formValuesChangeEmitter?.off || !onResetFieldValue) return;
+    const listener = () => {
+      onResetFieldValue();
+      forceRefresh((v) => v + 1);
+    };
+    formValuesChangeEmitter.on('onFieldReset', listener);
+    return () => {
+      formValuesChangeEmitter.off('onFieldReset', listener);
+    };
+  }, [formValuesChangeEmitter, onResetFieldValue]);
   const applyValue = React.useCallback((nextValue: any) => onChange?.(normalizeSubTableRows(nextValue)), [onChange]);
   const getLatestValue = React.useCallback(() => normalizeSubTableRows(getCurrentValue()), [getCurrentValue]);
   useEffect(() => {
@@ -125,7 +137,7 @@ export function SubTableField(props) {
         return t('Total {{count}} items', { count: total });
       },
     } as any;
-  }, [currentPage, currentPageSize, currentValue.length]);
+  }, [currentPage, currentPageSize, currentValue.length, t]);
 
   // 新增一行
   const handleAdd = () => {

package/src/flow/models/fields/AssociationFieldModel/SubTableFieldModel/__tests__/SubTableColumnModel.rowRecord.test.ts

@@ -15,6 +15,7 @@ import {
   SubTableColumnModel,
   getLatestSubTableRowRecord,
   buildRowPathFromFieldIndex,
+  buildSubTableColumnNamePath,
   isSubTableColumnConfiguredReadPretty,
   getSubTableColumnTitleField,
   getSubTableColumnReadPrettyFieldProps,
@@ -47,6 +48,17 @@ describe('SubTableColumnModel row record helpers', () => {
     expect(buildRowPathFromFieldIndex(['users:1', 'roles:2'])).toEqual(['users', 1, 'roles', 2]);
   });
 
+  it('builds absolute form item paths for nested sub-table columns', () => {
+    expect(buildSubTableColumnNamePath(['roles'], 0, 'name', ['roles:0'])).toEqual(['roles', 0, 'name']);
+    expect(buildSubTableColumnNamePath(['orders', 'lines'], 1, 'product', ['orders:0', 'lines:1'])).toEqual([
+      'orders',
+      0,
+      'lines',
+      1,
+      'product',
+    ]);
+  });
+
   it('prefers the latest row value from form over the fallback record', () => {
     const form = {
       getFieldValue: vi.fn((path: any) => {

package/src/flow/models/fields/AssociationFieldModel/SubTableFieldModel/__tests__/SubTableFieldModel.reset.test.ts

@@ -0,0 +1,180 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import React from 'react';
+import { act, render } from '@nocobase/test/client';
+import { FlowEngine, type FlowModel } from '@nocobase/flow-engine';
+import { describe, expect, it, vi } from 'vitest';
+import { PopupSubTableFieldModel } from '../../PopupSubTableFieldModel';
+import { SubTableFieldModel } from '..';
+
+vi.mock('react-i18next', async (importOriginal) => ({
+  ...(await importOriginal<any>()),
+  useTranslation: () => ({
+    t: (value: string) => value,
+  }),
+}));
+
+vi.mock('antd', async () => {
+  const actual = await vi.importActual<any>('antd');
+  return {
+    ...actual,
+    Table: ({ dataSource = [], columns = [] }: any) =>
+      React.createElement(
+        'div',
+        { 'data-testid': 'subtable' },
+        dataSource.map((record: any, rowIdx: number) =>
+          React.createElement(
+            'div',
+            { 'data-testid': `row-${rowIdx}`, key: record.__index__ || rowIdx },
+            columns.map((column: any) =>
+              React.createElement(
+                'div',
+                { 'data-testid': `cell-${rowIdx}-${String(column.dataIndex || column.key)}`, key: column.key },
+                column.render?.(record[column.dataIndex], record, rowIdx),
+              ),
+            ),
+          ),
+        ),
+      ),
+  };
+});
+
+function createSubTableFieldModel(props: Record<string, unknown> = {}) {
+  const engine = new FlowEngine();
+  engine.registerModels({ SubTableFieldModel });
+  const setFieldValue = vi.fn();
+
+  const blockModel = engine.createModel<FlowModel>({
+    use: 'FlowModel',
+    uid: 'form-block',
+  });
+  (blockModel as FlowModel & { setFieldValue: typeof setFieldValue }).setFieldValue = setFieldValue;
+  const parent = engine.createModel<FlowModel>({
+    use: 'FlowModel',
+    uid: 'form-item',
+  });
+
+  parent.context.defineProperty('blockModel', { value: blockModel });
+  parent.context.defineProperty('collectionField', {
+    value: {
+      target: 'roles',
+      targetCollection: {
+        filterTargetKey: 'id',
+      },
+    },
+  });
+  parent.context.defineProperty('fieldPathArray', { value: ['roles'] });
+
+  const model = engine.createModel<SubTableFieldModel>({
+    use: 'SubTableFieldModel',
+    uid: 'roles-subtable',
+    parentId: parent.uid,
+    props,
+  });
+
+  return { blockModel, model, setFieldValue };
+}
+
+async function createPopupSubTableFieldModel(props: Record<string, unknown> = {}) {
+  const engine = new FlowEngine();
+  engine.registerModels({ PopupSubTableFieldModel });
+  const setFieldValue = vi.fn();
+
+  const blockModel = engine.createModel<FlowModel>({
+    use: 'FlowModel',
+    uid: 'popup-form-block',
+  });
+  (blockModel as FlowModel & { setFieldValue: typeof setFieldValue }).setFieldValue = setFieldValue;
+  const parent = engine.createModel<FlowModel>({
+    use: 'FlowModel',
+    uid: 'popup-form-item',
+  });
+
+  parent.context.defineProperty('blockModel', { value: blockModel });
+  parent.context.defineProperty('collectionField', {
+    value: {
+      target: 'roles',
+      targetCollection: {
+        filterTargetKey: 'id',
+      },
+    },
+  });
+  parent.context.defineProperty('fieldPathArray', { value: ['roles'] });
+
+  const model = engine.createModel<PopupSubTableFieldModel>({
+    use: 'PopupSubTableFieldModel',
+    uid: 'roles-popup-subtable',
+    parentId: parent.uid,
+    props,
+  });
+  (model.subModels as Record<string, unknown>).subTableColumns = [];
+  await model.onDispatchEventStart('beforeRender');
+
+  return { blockModel, model, setFieldValue };
+}
+
+describe('SubTable field reset', () => {
+  it('resets the rendered fork through its own form field path', () => {
+    const onChange = vi.fn();
+    const { blockModel, model, setFieldValue } = createSubTableFieldModel({
+      onChange,
+      value: [{ id: 1 }],
+    });
+    const fork = model.createFork({ value: [{ id: 1 }] }, 'orders.0.lines');
+    fork.context.defineProperty('fieldPathArray', { value: ['orders', 0, 'lines'] });
+
+    render(React.createElement(React.Fragment, null, fork.render()));
+
+    act(() => {
+      blockModel.emitter.emit('onFieldReset');
+    });
+
+    expect(fork.props.value).toEqual([]);
+    expect(setFieldValue).toHaveBeenCalledWith(['orders', 0, 'lines'], []);
+    expect(onChange).not.toHaveBeenCalled();
+  });
+
+  it('resets the non-forked model through the parent form field path', () => {
+    const onChange = vi.fn();
+    const { blockModel, model, setFieldValue } = createSubTableFieldModel({
+      onChange,
+      value: [{ id: 1 }],
+    });
+
+    render(React.createElement(React.Fragment, null, model.render()));
+
+    act(() => {
+      blockModel.emitter.emit('onFieldReset');
+    });
+
+    expect(model.props.value).toEqual([]);
+    expect(setFieldValue).toHaveBeenCalledWith(['roles'], []);
+    expect(onChange).not.toHaveBeenCalled();
+  });
+
+  it('resets popup sub-table form values without relying on onChange', async () => {
+    const onChange = vi.fn();
+    const { blockModel, model, setFieldValue } = await createPopupSubTableFieldModel({
+      onChange,
+      pageSize: 10,
+      value: [{ id: 1 }],
+    });
+
+    render(React.createElement(React.Fragment, null, model.render()));
+
+    act(() => {
+      blockModel.emitter.emit('onFieldReset');
+    });
+
+    expect(model.props.value).toEqual([]);
+    expect(setFieldValue).toHaveBeenCalledWith(['roles'], []);
+    expect(onChange).not.toHaveBeenCalled();
+  });
+});

package/src/flow/models/fields/AssociationFieldModel/SubTableFieldModel/index.tsx

@@ -112,6 +112,11 @@ export class SubTableFieldModel extends AssociationFieldModel {
     };
     const isConfigMode = !!this.context.flowSettingsEnabled;
     const fieldPathArray = this.context.fieldPathArray ?? this.parent?.context?.fieldPathArray;
+    const onResetFieldValue = () => {
+      const value = [];
+      this.setProps({ value });
+      this.context.blockModel?.setFieldValue?.(fieldPathArray, value);
+    };
     return (
       <SubTableField
         {...this.props}
@@ -124,6 +129,7 @@ export class SubTableFieldModel extends AssociationFieldModel {
         formValuesChangeEmitter={this.context.blockModel?.emitter}
         fieldPathArray={fieldPathArray}
         getCurrentValue={() => this.getCurrentValue()}
+        onResetFieldValue={onResetFieldValue}
       />
     );
   }
@@ -136,10 +142,6 @@ export class SubTableFieldModel extends AssociationFieldModel {
     this.context.defineProperty('collection', {
       get: () => this.context.collectionField.targetCollection,
     });
-    // 监听表单reset
-    this.context.blockModel.emitter.on('onFieldReset', () => {
-      this.props.onChange([]);
-    });
     this.onSelectExitRecordClick = (setCurrentPage, currentPageSize) => {
       this.setCurrentPage = setCurrentPage;
       this.currentPageSize = currentPageSize;

package/src/flow/models/fields/AssociationFieldModel/__tests__/AssociationFieldModel.updateAssociation.test.ts

@@ -0,0 +1,72 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import { FlowEngine, FlowModel } from '@nocobase/flow-engine';
+import { describe, expect, it, vi } from 'vitest';
+import { AssociationFieldModel } from '../AssociationFieldModel';
+
+class DefaultAssociationFieldModel extends AssociationFieldModel {}
+
+class UpdateAssociationFieldModel extends AssociationFieldModel {
+  updateAssociation = true;
+}
+
+async function runAssociationFieldInit(FieldModelClass: typeof AssociationFieldModel) {
+  const engine = new FlowEngine();
+  engine.registerModels({
+    DefaultAssociationFieldModel,
+    UpdateAssociationFieldModel,
+  });
+
+  const addUpdateAssociationValues = vi.fn();
+  const blockModel = engine.createModel<FlowModel>({
+    use: 'FlowModel',
+    uid: 'form-block',
+  });
+  blockModel.context.defineProperty('resource', {
+    value: { addUpdateAssociationValues },
+  });
+
+  const formItem = engine.createModel<FlowModel>({
+    use: 'FlowModel',
+    uid: 'form-item',
+  });
+  (formItem as FlowModel & { fieldPath: string }).fieldPath = 'author';
+  formItem.context.defineProperty('blockModel', { value: blockModel });
+
+  const field = engine.createModel<AssociationFieldModel>({
+    use: FieldModelClass,
+    uid: 'association-field',
+    parentId: formItem.uid,
+  });
+  field.context.defineProperty('collectionField', {
+    value: {
+      dataSourceKey: 'main',
+      target: 'users',
+    },
+  });
+
+  await field.applyFlow('AssociationFieldInit');
+
+  return addUpdateAssociationValues;
+}
+
+describe('AssociationFieldModel updateAssociation', () => {
+  it('does not add updateAssociationValues by default', async () => {
+    const addUpdateAssociationValues = await runAssociationFieldInit(DefaultAssociationFieldModel);
+
+    expect(addUpdateAssociationValues).not.toHaveBeenCalled();
+  });
+
+  it('adds updateAssociationValues for opt-in association fields', async () => {
+    const addUpdateAssociationValues = await runAssociationFieldInit(UpdateAssociationFieldModel);
+
+    expect(addUpdateAssociationValues).toHaveBeenCalledWith('author');
+  });
+});

package/src/flow/models/fields/AssociationFieldModel/__tests__/RecordPickerFieldModel.itemContext.test.ts

@@ -28,6 +28,7 @@ import {
   normalizeRecordPickerValue,
   shouldClearRecordPickerValueOnMultipleChange,
 } from '../RecordPickerFieldModel';
+import { getAssociationHydrationNamePath, getAssociationHydrationSetterContext } from '../RecordSelectFieldModel';
 
 function createMockCollection() {
   return {
@@ -93,6 +94,28 @@ describe('RecordPickerFieldModel item context', () => {
     expect(shouldClearRecordPickerValueOnMultipleChange({ type: 'belongsTo' }, true, false)).toBe(false);
   });
 
+  it('uses the current field context for association hydration writes', () => {
+    const setFormValue = vi.fn();
+    const blockSetFormValue = vi.fn();
+    const model = {
+      props: {
+        name: 'orders',
+      },
+      context: {
+        fieldPathArray: ['orders', 0, 'lines', 1, 'product'],
+        setFormValue,
+        blockModel: {
+          context: {
+            setFormValue: blockSetFormValue,
+          },
+        },
+      },
+    };
+
+    expect(getAssociationHydrationNamePath(model)).toEqual(['orders', 0, 'lines', 1, 'product']);
+    expect(getAssociationHydrationSetterContext(model)).toBe(model.context);
+  });
+
   it('itemChain helpers: createParentItemAccessorsFromInputArgs works', () => {
     const inputArgs = {
       parentItem: { value: { id: 1 } },

package/src/flow/models/fields/ClickableFieldModel.tsx

@@ -197,6 +197,11 @@ export class ClickableFieldModel extends FieldModel {
       titleField,
       overflowMode,
       disabled,
+      dateOnly,
+      dateFormat,
+      format,
+      picker,
+      showTime,
       timeFormat,
       ...restProps
     } = this.props;

package/src/flow/models/fields/DisplayDateTimeFieldModel.tsx

@@ -8,14 +8,42 @@
  */
 
 import { DisplayItemModel, tExpr } from '@nocobase/flow-engine';
+import { getDateTimeFormat, getPickerFormat } from '@nocobase/utils/client';
 import dayjs from 'dayjs';
 import React from 'react';
 import { ClickableFieldModel } from './ClickableFieldModel';
 
+const stripTimeFromFormat = (format?: string) =>
+  format ? format.replace(/\s*[Hh]{1,2}:mm(?::ss)?(?:\.SSS)?(?:\s*[aA])?/g, '').trim() : format;
+
+interface DisplayDateTimeFormatProps {
+  dateOnly?: boolean;
+  picker?: string;
+  format?: string;
+  dateFormat?: string;
+  showTime?: boolean;
+  timeFormat?: string;
+}
+
+const resolveDisplayDateTimeFormat = (props: DisplayDateTimeFormatProps) => {
+  const { dateOnly, picker = 'date', format, dateFormat, showTime, timeFormat } = props;
+  const normalizedFormat = stripTimeFromFormat(format);
+  if (picker !== 'date') {
+    return dateFormat || normalizedFormat || getPickerFormat(picker);
+  }
+
+  if (!dateOnly && !dateFormat && typeof showTime === 'undefined' && !timeFormat && normalizedFormat) {
+    return format;
+  }
+
+  const normalizedDateFormat = dateFormat || normalizedFormat || getPickerFormat(picker);
+  return getDateTimeFormat(picker, normalizedDateFormat, showTime, timeFormat);
+};
+
 export class DisplayDateTimeFieldModel extends ClickableFieldModel {
   public renderComponent(value) {
     const { className, style } = this.props;
-    const finalFormat = this.props.format;
+    const finalFormat = resolveDisplayDateTimeFormat(this.props);
     let formattedValue = '';
     if (value) {
       const day = dayjs(value);

package/src/flow/models/fields/SelectFieldModel.tsx

@@ -15,17 +15,20 @@ import { MobileSelect } from './mobile-components/MobileSelect';
 import { enumToOptions, getSelectedEnumLabels, translateOptionLabel } from '../../internal/utils/enumOptionsUtils';
 
 const getOriginalEnumOptions = (model: SelectFieldModel) => {
-  const fromEnum = enumToOptions(model.context.collectionField?.uiSchema?.enum, (text) => text) || [];
+  const fromEnum = enumToOptions(model.context.collectionField?.uiSchema?.enum, model.translate) || [];
   if (fromEnum.length > 0) {
     return fromEnum.map((option) => ({ ...option }));
   }
   const current = Array.isArray(model.props.options) ? model.props.options : [];
-  return current.map((option) => ({ ...option }));
+  return current.map((option) => ({
+    ...option,
+    label: translateOptionLabel(option.label, model.translate),
+  }));
 };
-
 export class SelectFieldModel extends FieldModel {
   render() {
     const fallbackOptions = getOriginalEnumOptions(this);
+
     const options = this.props.options?.map((v) => {
       return {
         ...v,
@@ -46,7 +49,6 @@ export class SelectFieldModel extends FieldModel {
     if (this.context.isMobileLayout) {
       return <MobileSelect {...this.props} options={options} displayValue={value} />;
     }
-
     return (
       <Select
         {...this.props}