Merge pull request #27 from Currency-One/changeFormValues

add changeFormValues to change many props at once

DOCS.md

@@ -21,6 +21,8 @@
 <dd><p>Toggles noValidate on Form</p></dd>
 <dt><a href="#changeFormValue">changeFormValue(formToChange, fieldName, value)</a> ⇒ <code>Object</code></dt>
 <dd><p>Changes FormField value.</p></dd>
+<dt><a href="#changeFormValues">changeFormValues(formToChange)</a> ⇒ <code>Object</code></dt>
+<dd><p>Changes few FormField values at once.</p></dd>
 <dt><a href="#formHasChanged">formHasChanged(formToCheck)</a> ⇒ <code>boolean</code></dt>
 <dd><p>Indicated if any value in form is different than initial value.</p></dd>
 <dt><a href="#formFieldHasChanged">formFieldHasChanged(formField)</a> ⇒ <code>boolean</code></dt>
@@ -156,6 +158,18 @@
 | fieldName | <code>string</code> | <p>Key of FormField in form.</p> |
 | value | <code>GenericTypeOfFormField.&lt;U&gt;</code> | <p>Value to change</p> |
 
+<a name="changeFormValues"></a>
+
+## changeFormValues(formToChange) ⇒ <code>Object</code>
+<p>Changes few FormField values at once.</p>
+
+**Kind**: global function  
+
+| Param | Type | Description |
+| --- | --- | --- |
+| formToChange | <code>string</code> | <p>Form.</p> |
+| fieldsToChange. | <code>Object</code> |  |
+
 <a name="formHasChanged"></a>
 
 ## formHasChanged(formToCheck) ⇒ <code>boolean</code>

lib/form-utils.ts

@@ -174,6 +174,29 @@ export function changeFormValue<T, A extends keyof T, U extends T[A]>(
   }, formToChange)
 }
 
+/**
+ * Changes few FormField values at once.
+ * @param {string} formToChange - Form.
+ * @param {Object} fieldsToChange.
+ * @returns {Object}
+ */
+export function changeFormValues<T, U extends { [key in keyof T]?: any }>(
+  formToChange: T,
+  fieldsToChange: U,
+): T {
+  return Object.keys(fieldsToChange).reduce((prev: T, key) => {
+    const field = formToChange[key]
+    if (typeof field !== 'object') {
+      return prev
+    }
+
+    return isFormField(field)
+      ? changeFormValue(prev, key, fieldsToChange[key])
+      : // tslint:disable-next-line prefer-object-spread
+      Object.assign({}, prev, { [key]: changeFormValues(field, fieldsToChange[key]) })
+  }, formToChange)
+}
+
 /**
  * Indicated if any value in form is different than initial value.
  * @param {Object} formToCheck - Form.

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@currency-one/form-utils",
-  "version": "1.0.13",
+  "version": "1.0.14",
   "description": "Form utils",
   "keywords": [
     "form-utils",

test/form-utils.spec.ts

@@ -1,6 +1,6 @@
 import {
   changeFormFieldsValidation,
-  changeFormValue,
+  changeFormValue, changeFormValues,
   createFormField,
   createPasswordFormField,
   formFieldsToValues, isForm,
@@ -119,6 +119,35 @@ describe('form-utils', () => {
     expect(formUpdated.field5.touched).toBeTruthy()
   })
 
+  it('should changeFormValues() change many values in form', () => {
+    const form = {
+      field1: createFormField('PLN', []),
+      field2: createFormField('', []),
+      field3: 'string',
+      field4: {
+        subfield1: createFormField('', []),
+        subfield2: createFormField('text', []),
+      },
+      field5: createFormField<boolean | undefined>(undefined, []),
+    }
+
+    expect(form.field1.touched).toBeFalsy()
+
+    const formUpdated = changeFormValues(form, {
+      field1: 'EUR',
+      field4: {
+        subfield1: 'changedText',
+      },
+      field5: true,
+    })
+    expect(formUpdated.field1.val).toEqual('EUR')
+    expect(formUpdated.field1.touched).toBeTruthy()
+    expect(formUpdated.field4.subfield1.val).toEqual('changedText')
+    expect(formUpdated.field4.subfield1.touched).toBeTruthy()
+    expect(formUpdated.field5.val).toBeTruthy()
+    expect(formUpdated.field5.touched).toBeTruthy()
+  })
+
   it('should isFormFieldValueUpdated() return correct value', () => {
     const formField1 = createFormField('')
     const formField2 = createFormField('test')