model.tsx 21 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804
  1. import isEqual from 'lodash/isEqual';
  2. import {action, computed, makeObservable, observable, ObservableMap} from 'mobx';
  3. import {addErrorMessage, saveOnBlurUndoMessage} from 'sentry/actionCreators/indicator';
  4. import {APIRequestMethod, Client} from 'sentry/api';
  5. import FormState from 'sentry/components/forms/state';
  6. import {t} from 'sentry/locale';
  7. import type {Choice} from 'sentry/types';
  8. import {defined} from 'sentry/utils';
  9. type Snapshot = Map<string, FieldValue>;
  10. type SaveSnapshot = (() => number) | null;
  11. export type FieldValue = string | number | boolean | Choice | undefined; // is undefined valid here?
  12. export type FormOptions = {
  13. /**
  14. * Does the form support undo?
  15. */
  16. allowUndo?: boolean;
  17. /**
  18. * API endpoint use when saving the form model
  19. */
  20. apiEndpoint?: string;
  21. /**
  22. * API method used to save the form model
  23. */
  24. apiMethod?: APIRequestMethod;
  25. /**
  26. * Options passed to the API Client
  27. */
  28. apiOptions?: ConstructorParameters<typeof Client>[0];
  29. /**
  30. * Initial form data
  31. */
  32. initialData?: Record<string, FieldValue>;
  33. /**
  34. * Callback triggered when a field changes value
  35. */
  36. onFieldChange?: (id: string, finalValue: FieldValue) => void;
  37. /**
  38. * Callback triggered when form submission fails
  39. */
  40. onSubmitError?: (error: any, instance: FormModel, id?: string) => void;
  41. /**
  42. * Callback triggered when the form is successfully submitted
  43. */
  44. onSubmitSuccess?: (
  45. response: any,
  46. instance: FormModel,
  47. id?: string,
  48. change?: {new: FieldValue; old: FieldValue}
  49. ) => void;
  50. /**
  51. * Should the form reset when an error occurs?
  52. */
  53. resetOnError?: boolean;
  54. /**
  55. * Should the form save on blur?
  56. */
  57. saveOnBlur?: boolean;
  58. /**
  59. * Custom transformer function used before the API request
  60. */
  61. transformData?: (data: Record<string, any>, instance: FormModel) => Record<string, any>;
  62. };
  63. class FormModel {
  64. /**
  65. * Map of field name -> value
  66. */
  67. fields: ObservableMap<string, FieldValue> = observable.map();
  68. /**
  69. * Errors for individual fields
  70. * Note we don't keep error in `this.fieldState` so that we can easily
  71. * See if the form is in an "error" state with the `isError` getter
  72. */
  73. errors = new Map();
  74. /**
  75. * State of individual fields
  76. *
  77. * Map of field name -> object
  78. */
  79. fieldState = new Map();
  80. /**
  81. * State of the form as a whole
  82. */
  83. formState: FormState | undefined;
  84. /**
  85. * Holds field properties as declared in <Form>
  86. * Does not need to be observable since these props should never change
  87. */
  88. fieldDescriptor = new Map();
  89. /**
  90. * Holds a list of `fields` states
  91. */
  92. snapshots: Array<Snapshot> = [];
  93. /**
  94. * POJO of field name -> value
  95. * It holds field values "since last save"
  96. */
  97. initialData: Record<string, FieldValue> = {};
  98. api: Client;
  99. // TODO(epurkhiser): it looks like this can goa away, along with mapFormErrors,
  100. // unclear why this is part of the form model
  101. formErrors: any;
  102. options: FormOptions;
  103. constructor({initialData, apiOptions, ...options}: FormOptions = {}) {
  104. makeObservable(this, {
  105. fields: observable,
  106. errors: observable,
  107. fieldState: observable,
  108. formState: observable,
  109. isError: computed,
  110. isSaving: computed,
  111. formData: computed,
  112. formChanged: computed,
  113. resetForm: action,
  114. setFieldDescriptor: action,
  115. removeField: action,
  116. setValue: action,
  117. validateField: action,
  118. updateShowSaveState: action,
  119. undo: action,
  120. saveForm: action,
  121. saveField: action,
  122. saveFieldRequest: action,
  123. handleBlurField: action,
  124. setFormSaving: action,
  125. handleSaveField: action,
  126. handleCancelSaveField: action,
  127. setFieldState: action,
  128. setSaving: action,
  129. setError: action,
  130. validateForm: action,
  131. handleErrorResponse: action,
  132. submitSuccess: action,
  133. submitError: action,
  134. });
  135. this.options = options ?? {};
  136. if (initialData) {
  137. this.setInitialData(initialData);
  138. }
  139. this.api = new Client(apiOptions);
  140. }
  141. /**
  142. * Reset state of model
  143. */
  144. reset() {
  145. this.api.clear();
  146. this.fieldDescriptor.clear();
  147. this.resetForm();
  148. }
  149. resetForm() {
  150. this.fields.clear();
  151. this.errors.clear();
  152. this.fieldState.clear();
  153. this.snapshots = [];
  154. this.initialData = {};
  155. }
  156. /**
  157. * Deep equality comparison between last saved state and current fields state
  158. */
  159. get formChanged() {
  160. return !isEqual(this.initialData, Object.fromEntries(this.fields.toJSON()));
  161. }
  162. get formData() {
  163. return this.fields;
  164. }
  165. /**
  166. * Is form saving
  167. */
  168. get isSaving() {
  169. return this.formState === FormState.SAVING;
  170. }
  171. /**
  172. * Does form have any errors
  173. */
  174. get isError() {
  175. return !!this.errors.size;
  176. }
  177. /**
  178. * Sets initial form data
  179. *
  180. * Also resets snapshots
  181. */
  182. setInitialData(initialData?: Record<string, FieldValue>) {
  183. this.fields.replace(initialData || {});
  184. this.initialData = Object.fromEntries(this.fields.toJSON()) || {};
  185. this.snapshots = [new Map(this.fields.entries())];
  186. }
  187. /**
  188. * Set form options
  189. */
  190. setFormOptions(options: FormOptions) {
  191. this.options = {...this.options, ...options} || {};
  192. }
  193. /**
  194. * Set field properties
  195. */
  196. setFieldDescriptor(id: string, props) {
  197. // TODO(TS): add type to props
  198. this.fieldDescriptor.set(id, props);
  199. // Set default value iff initialData for field is undefined
  200. // This must take place before checking for `props.setValue` so that it can
  201. // be applied to `defaultValue`
  202. if (
  203. typeof props.defaultValue !== 'undefined' &&
  204. typeof this.initialData[id] === 'undefined'
  205. ) {
  206. this.initialData[id] =
  207. typeof props.defaultValue === 'function'
  208. ? props.defaultValue()
  209. : props.defaultValue;
  210. this.fields.set(id, this.initialData[id]);
  211. }
  212. if (typeof props.setValue === 'function') {
  213. this.initialData[id] = props.setValue(this.initialData[id], props);
  214. this.fields.set(id, this.initialData[id]);
  215. }
  216. }
  217. /**
  218. * Remove a field from the descriptor map and errors.
  219. */
  220. removeField(id: string) {
  221. this.fieldDescriptor.delete(id);
  222. this.errors.delete(id);
  223. }
  224. /**
  225. * Creates a cloned Map of `this.fields` and returns a closure that when called
  226. * will save Map to `snapshots
  227. */
  228. createSnapshot() {
  229. const snapshot = new Map(this.fields.entries());
  230. return () => this.snapshots.unshift(snapshot);
  231. }
  232. getDescriptor(id: string, key: string) {
  233. // Needs to call `has` or else component will not be reactive if `id` doesn't exist in observable map
  234. const descriptor = this.fieldDescriptor.has(id) && this.fieldDescriptor.get(id);
  235. if (!descriptor) {
  236. return null;
  237. }
  238. return descriptor[key];
  239. }
  240. getFieldState(id: string, key: string) {
  241. // Needs to call `has` or else component will not be reactive if `id` doesn't exist in observable map
  242. const fieldState = this.fieldState.has(id) && this.fieldState.get(id);
  243. if (!fieldState) {
  244. return null;
  245. }
  246. return fieldState[key];
  247. }
  248. getValue(id: string) {
  249. return this.fields.has(id) ? this.fields.get(id) : '';
  250. }
  251. getTransformedValue(id: string) {
  252. const fieldDescriptor = this.fieldDescriptor.get(id);
  253. const transformer =
  254. fieldDescriptor && typeof fieldDescriptor.getValue === 'function'
  255. ? fieldDescriptor.getValue
  256. : null;
  257. const value = this.getValue(id);
  258. return transformer ? transformer(value) : value;
  259. }
  260. /**
  261. * Data represented in UI
  262. */
  263. getData() {
  264. return Object.fromEntries(this.fields.toJSON());
  265. }
  266. /**
  267. * Form data that will be sent to API endpoint (i.e. after transforms)
  268. */
  269. getTransformedData() {
  270. const form = this.getData();
  271. const data = Object.keys(form)
  272. .map(id => [id, this.getTransformedValue(id)])
  273. .reduce<Record<string, any>>((acc, [id, value]) => {
  274. acc[id] = value;
  275. return acc;
  276. }, {});
  277. return this.options.transformData ? this.options.transformData(data, this) : data;
  278. }
  279. getError(id: string) {
  280. return this.errors.has(id) && this.errors.get(id);
  281. }
  282. /**
  283. * Returns true if not required or is required and is not empty
  284. */
  285. isValidRequiredField(id: string) {
  286. // Check field descriptor to see if field is required
  287. const isRequired = this.getDescriptor(id, 'required');
  288. const value = this.getValue(id);
  289. return !isRequired || (value !== '' && defined(value));
  290. }
  291. isValidField(id: string) {
  292. return (this.getError(id) || []).length === 0;
  293. }
  294. doApiRequest({
  295. apiEndpoint,
  296. apiMethod,
  297. data,
  298. }: {
  299. data: object;
  300. apiEndpoint?: string;
  301. apiMethod?: APIRequestMethod;
  302. }) {
  303. const endpoint = apiEndpoint || this.options.apiEndpoint || '';
  304. const method = apiMethod || this.options.apiMethod;
  305. return new Promise((resolve, reject) =>
  306. this.api.request(endpoint, {
  307. method,
  308. data,
  309. success: response => resolve(response),
  310. error: error => reject(error),
  311. })
  312. );
  313. }
  314. /**
  315. * Set the value of the form field
  316. * if quiet is true, we skip callbacks, validations
  317. */
  318. setValue(id: string, value: FieldValue, {quiet}: {quiet?: boolean} = {}) {
  319. const fieldDescriptor = this.fieldDescriptor.get(id);
  320. let finalValue = value;
  321. if (fieldDescriptor && typeof fieldDescriptor.transformInput === 'function') {
  322. finalValue = fieldDescriptor.transformInput(value);
  323. }
  324. this.fields.set(id, finalValue);
  325. if (quiet) {
  326. return;
  327. }
  328. if (this.options.onFieldChange) {
  329. this.options.onFieldChange(id, finalValue);
  330. }
  331. this.validateField(id);
  332. this.updateShowSaveState(id, finalValue);
  333. }
  334. validateField(id: string) {
  335. const validate = this.getDescriptor(id, 'validate');
  336. let errors: any[] = [];
  337. if (typeof validate === 'function') {
  338. // Returns "tuples" of [id, error string]
  339. errors = validate({model: this, id, form: this.getData()}) || [];
  340. }
  341. const fieldIsRequiredMessage = t('Field is required');
  342. if (!this.isValidRequiredField(id)) {
  343. errors.push([id, fieldIsRequiredMessage]);
  344. }
  345. // If we have no errors, ensure we clear the field
  346. errors = errors.length === 0 ? [[id, null]] : errors;
  347. errors.forEach(([field, errorMessage]) => this.setError(field, errorMessage));
  348. return undefined;
  349. }
  350. updateShowSaveState(id: string, value: FieldValue) {
  351. const isValueChanged = value !== this.initialData[id];
  352. // Update field state to "show save" if save on blur is disabled for this field
  353. // (only if contents of field differs from initial value)
  354. const saveOnBlurFieldOverride = this.getDescriptor(id, 'saveOnBlur');
  355. if (typeof saveOnBlurFieldOverride === 'undefined' || saveOnBlurFieldOverride) {
  356. return;
  357. }
  358. if (this.getFieldState(id, 'showSave') === isValueChanged) {
  359. return;
  360. }
  361. this.setFieldState(id, 'showSave', isValueChanged);
  362. }
  363. /**
  364. * Changes form values to previous saved state
  365. */
  366. undo() {
  367. // Always have initial data snapshot
  368. if (this.snapshots.length < 2) {
  369. return null;
  370. }
  371. this.snapshots.shift();
  372. this.fields.replace(this.snapshots[0]);
  373. return true;
  374. }
  375. /**
  376. * Attempts to save entire form to server and saves a snapshot for undos
  377. */
  378. saveForm() {
  379. if (!this.validateForm()) {
  380. return null;
  381. }
  382. let saveSnapshot: SaveSnapshot = this.createSnapshot();
  383. const request = this.doApiRequest({
  384. data: this.getTransformedData(),
  385. });
  386. this.setFormSaving();
  387. request
  388. .then(resp => {
  389. // save snapshot
  390. if (saveSnapshot) {
  391. saveSnapshot();
  392. saveSnapshot = null;
  393. }
  394. if (this.options.onSubmitSuccess) {
  395. this.options.onSubmitSuccess(resp, this);
  396. }
  397. })
  398. .catch(resp => {
  399. // should we revert field value to last known state?
  400. saveSnapshot = null;
  401. if (this.options.resetOnError) {
  402. this.setInitialData({});
  403. }
  404. this.submitError(resp);
  405. if (this.options.onSubmitError) {
  406. this.options.onSubmitError(resp, this);
  407. }
  408. });
  409. return request;
  410. }
  411. /**
  412. * Attempts to save field and show undo message if necessary.
  413. * Calls submit handlers.
  414. * TODO(billy): This should return a promise that resolves (instead of null)
  415. */
  416. saveField(id: string, currentValue: FieldValue) {
  417. const oldValue = this.initialData[id];
  418. const savePromise = this.saveFieldRequest(id, currentValue);
  419. if (!savePromise) {
  420. return null;
  421. }
  422. return savePromise
  423. .then(resp => {
  424. const newValue = this.getValue(id);
  425. const change = {old: oldValue, new: newValue};
  426. // Only use `allowUndo` option if explicitly defined
  427. if (typeof this.options.allowUndo === 'undefined' || this.options.allowUndo) {
  428. saveOnBlurUndoMessage(change, this, id);
  429. }
  430. if (this.options.onSubmitSuccess) {
  431. this.options.onSubmitSuccess(resp, this, id, change);
  432. }
  433. return resp;
  434. })
  435. .catch(error => {
  436. if (this.options.onSubmitError) {
  437. this.options.onSubmitError(error, this, id);
  438. }
  439. return {};
  440. });
  441. }
  442. /**
  443. * Saves a field with new value
  444. *
  445. * If field has changes, field does not have errors, then it will:
  446. * Save a snapshot, apply any data transforms, perform api request.
  447. *
  448. * If successful then: 1) reset save state, 2) update `initialData`, 3) save snapshot
  449. * If failed then: 1) reset save state, 2) add error state
  450. */
  451. saveFieldRequest(id: string, currentValue: FieldValue) {
  452. const initialValue = this.initialData[id];
  453. // Don't save if field hasn't changed
  454. // Don't need to check for error state since initialData wouldn't have updated since last error
  455. if (
  456. currentValue === initialValue ||
  457. (currentValue === '' && !defined(initialValue))
  458. ) {
  459. return null;
  460. }
  461. // Check for error first
  462. this.validateField(id);
  463. if (!this.isValidField(id)) {
  464. return null;
  465. }
  466. // shallow clone fields
  467. let saveSnapshot: SaveSnapshot = this.createSnapshot();
  468. // Save field + value
  469. this.setSaving(id, true);
  470. const fieldDescriptor = this.fieldDescriptor.get(id);
  471. // Check if field needs to handle transforming request object
  472. const getData =
  473. typeof fieldDescriptor.getData === 'function' ? fieldDescriptor.getData : a => a;
  474. const request = this.doApiRequest({
  475. data: getData(
  476. {[id]: this.getTransformedValue(id)},
  477. {model: this, id, form: this.getData()}
  478. ),
  479. });
  480. request
  481. .then(data => {
  482. this.setSaving(id, false);
  483. // save snapshot
  484. if (saveSnapshot) {
  485. saveSnapshot();
  486. saveSnapshot = null;
  487. }
  488. // Update initialData after successfully saving a field as it will now be the baseline value
  489. this.initialData[id] = this.getValue(id);
  490. return data;
  491. })
  492. .catch(resp => {
  493. // should we revert field value to last known state?
  494. saveSnapshot = null;
  495. // Field can be configured to reset on error
  496. // e.g. BooleanFields
  497. const shouldReset = this.getDescriptor(id, 'resetOnError');
  498. if (shouldReset) {
  499. this.setValue(id, initialValue);
  500. }
  501. // API can return a JSON object with either:
  502. // 1) map of {[fieldName] => Array<ErrorMessages>}
  503. // 2) {'non_field_errors' => Array<ErrorMessages>}
  504. if (resp && resp.responseJSON) {
  505. // non-field errors can be camelcase or snake case
  506. const nonFieldErrors =
  507. resp.responseJSON.non_field_errors || resp.responseJSON.nonFieldErrors;
  508. // find the first entry with an error
  509. const firstError = Object.entries(resp.responseJSON).find(
  510. ([_, v]) => Array.isArray(v) && v.length
  511. )?.[1] as string | boolean | undefined;
  512. // Show resp msg from API endpoint if possible
  513. if (Array.isArray(resp.responseJSON[id]) && resp.responseJSON[id].length) {
  514. // Just take first resp for now
  515. this.setError(id, resp.responseJSON[id][0]);
  516. } else if (Array.isArray(nonFieldErrors) && nonFieldErrors.length) {
  517. addErrorMessage(nonFieldErrors[0], {duration: 10000});
  518. // Reset saving state
  519. this.setError(id, '');
  520. } else if (firstError) {
  521. this.setError(id, firstError);
  522. } else {
  523. this.setError(id, 'Failed to save');
  524. }
  525. } else {
  526. // Default error behavior
  527. this.setError(id, 'Failed to save');
  528. }
  529. // eslint-disable-next-line no-console
  530. console.error('Error saving form field', resp && resp.responseJSON);
  531. });
  532. return request;
  533. }
  534. /**
  535. * This is called when a field is blurred
  536. *
  537. * If `saveOnBlur` is set then call `saveField` and handle form callbacks accordingly
  538. */
  539. handleBlurField(id: string, currentValue: FieldValue) {
  540. // Nothing to do if `saveOnBlur` is not on
  541. if (!this.options.saveOnBlur) {
  542. return null;
  543. }
  544. // Fields can individually set `saveOnBlur` to `false` (note this is ignored when `undefined`)
  545. const saveOnBlurFieldOverride = this.getDescriptor(id, 'saveOnBlur');
  546. if (typeof saveOnBlurFieldOverride !== 'undefined' && !saveOnBlurFieldOverride) {
  547. return null;
  548. }
  549. return this.saveField(id, currentValue);
  550. }
  551. setFormSaving() {
  552. this.formState = FormState.SAVING;
  553. }
  554. /**
  555. * This is called when a field does not saveOnBlur and has an individual "Save" button
  556. */
  557. handleSaveField(id: string, currentValue: FieldValue) {
  558. const savePromise = this.saveField(id, currentValue);
  559. if (!savePromise) {
  560. return null;
  561. }
  562. return savePromise.then(() => {
  563. this.setFieldState(id, 'showSave', false);
  564. });
  565. }
  566. /**
  567. * Cancel "Save Field" state and revert form value back to initial value
  568. */
  569. handleCancelSaveField(id: string) {
  570. this.setValue(id, this.initialData[id]);
  571. this.setFieldState(id, 'showSave', false);
  572. }
  573. setFieldState(id: string, key: string, value: FieldValue) {
  574. const state = {
  575. ...(this.fieldState.get(id) || {}),
  576. [key]: value,
  577. };
  578. this.fieldState.set(id, state);
  579. }
  580. /**
  581. * Set "saving" state for field
  582. */
  583. setSaving(id: string, value: FieldValue) {
  584. // When saving, reset error state
  585. this.setError(id, false);
  586. this.setFieldState(id, FormState.SAVING, value);
  587. this.setFieldState(id, FormState.READY, !value);
  588. }
  589. /**
  590. * Set "error" state for field
  591. */
  592. setError(id: string, error: boolean | string) {
  593. // Note we don't keep error in `this.fieldState` so that we can easily
  594. // See if the form is in an "error" state with the `isError` getter
  595. if (error) {
  596. this.formState = FormState.ERROR;
  597. this.errors.set(id, error);
  598. } else {
  599. this.formState = FormState.READY;
  600. this.errors.delete(id);
  601. }
  602. // Field should no longer to "saving", but is not necessarily "ready"
  603. this.setFieldState(id, FormState.SAVING, false);
  604. }
  605. /**
  606. * Returns true if there are no errors
  607. */
  608. validateForm(): boolean {
  609. Array.from(this.fieldDescriptor.keys()).forEach(id => !this.validateField(id));
  610. return !this.isError;
  611. }
  612. handleErrorResponse({responseJSON: resp}: {responseJSON?: any} = {}) {
  613. if (!resp) {
  614. return;
  615. }
  616. // Show resp msg from API endpoint if possible
  617. Object.keys(resp).forEach(id => {
  618. // non-field errors can be camelcase or snake case
  619. const nonFieldErrors = resp.non_field_errors || resp.nonFieldErrors;
  620. if (
  621. (id === 'non_field_errors' || id === 'nonFieldErrors') &&
  622. Array.isArray(nonFieldErrors) &&
  623. nonFieldErrors.length
  624. ) {
  625. addErrorMessage(nonFieldErrors[0], {duration: 10000});
  626. } else if (Array.isArray(resp[id]) && resp[id].length) {
  627. // Just take first resp for now
  628. this.setError(id, resp[id][0]);
  629. }
  630. });
  631. }
  632. submitSuccess(data: Record<string, FieldValue>) {
  633. // update initial data
  634. this.formState = FormState.READY;
  635. this.initialData = data;
  636. }
  637. submitError(err: {responseJSON?: any}) {
  638. this.formState = FormState.ERROR;
  639. this.formErrors = this.mapFormErrors(err.responseJSON);
  640. this.handleErrorResponse({responseJSON: this.formErrors});
  641. }
  642. mapFormErrors(responseJSON?: any) {
  643. return responseJSON;
  644. }
  645. }
  646. /**
  647. * The mock model mocks the model interface to simply return values from the props
  648. *
  649. * This is valuable for using form fields outside of a Form context. Disables a
  650. * lot of functionality however.
  651. */
  652. export class MockModel {
  653. // TODO(TS)
  654. props: any;
  655. initialData: Record<string, FieldValue>;
  656. constructor(props) {
  657. this.props = props;
  658. this.initialData = {
  659. [props.name]: props.value,
  660. };
  661. }
  662. setValue() {}
  663. setFieldDescriptor() {}
  664. removeField() {}
  665. handleBlurField() {}
  666. getValue() {
  667. return this.props.value;
  668. }
  669. getError() {
  670. return this.props.error;
  671. }
  672. getFieldState() {
  673. return false;
  674. }
  675. }
  676. export default FormModel;