Merge pull request #845 from rvsia/managerWarnings

feat(manager): introduce warnings feature

Author: Hyperkid123

packages/form-state-manager/src/files/compose-validators.ts

@@ -10,15 +10,15 @@ import ComposeValidators from '../types/compose-validators';
  * @returns {Function} New validation function
  */
 const composeValidators: ComposeValidators = (validators = []) => (value, allValues) => {
-  const promises: Promise<string | undefined>[] = [];
+  const promises: Promise<any>[] = [];
   let index = 0;
-  let error: string | undefined;
+  let error: any;
   while (validators.length > 0 && !error && index < validators.length) {
     const result = validators[index](value, allValues);
     if (isPromise(result)) {
-      promises.push(result as Promise<string | undefined>);
+      promises.push(result as Promise<any>);
     } else {
-      error = result as string | undefined;
+      error = result as any;
     }
 
     index = index + 1;

packages/form-state-manager/src/tests/utils/manager-api.test.js

@@ -1876,4 +1876,32 @@ describe('managerApi', () => {
       expect(managerApi().hasSubmitErrors).toEqual(true);
     });
   });
+
+  describe('warning validation', () => {
+    const someError = 'some error message';
+    const render = jest.fn();
+
+    it('should save type: warning as warning - sync', () => {
+      const managerApi = createManagerApi({});
+      managerApi().registerField({ name: 'field', validate: () => ({ type: 'warning', error: someError }), render, internalId: 1 });
+
+      expect(managerApi().getFieldState('field').meta.warning).toEqual(someError);
+      expect(managerApi().getFieldState('field').meta.error).toEqual(undefined);
+    });
+
+    it('should save type: warning as warning - async', (done) => {
+      expect.assertions(2);
+
+      const asyncValidate = jest.fn().mockImplementation(() => Promise.reject({ type: 'warning', error: someError }));
+
+      const managerApi = createManagerApi({});
+      managerApi().registerField({ name: 'field', validate: asyncValidate, render, internalId: 1 });
+
+      setImmediate(() => {
+        expect(managerApi().getFieldState('field').meta.warning).toEqual(someError);
+        expect(managerApi().getFieldState('field').meta.error).toEqual(undefined);
+        done();
+      });
+    });
+  });
 });

packages/form-state-manager/src/types/compose-validators.d.ts

@@ -1,6 +1,13 @@
 import { Validator } from './validate';
 import AnyObject from './any-object';
 
-export type ComposeValidators = (validators: Validator[]) => (value: any, allValues: AnyObject) => Promise<string | undefined> | string | undefined;
+export interface WarningObject<T = string | undefined> {
+  type: 'warning';
+  error: T;
+}
+
+export type ComposeValidators<T = WarningObject | string | undefined> = (
+  validators: Validator[]
+) => (value: any, allValues: AnyObject) => Promise<T> | T;
 
 export default ComposeValidators;

packages/form-state-manager/src/types/use-field.d.ts

@@ -38,6 +38,7 @@ export interface Meta {
   valid: boolean;
   validating: boolean;
   visited: boolean;
+  warning: any;
 }
 
 export type OnChange = (value: any) => void;

packages/form-state-manager/src/utils/manager-api.ts

@@ -24,6 +24,7 @@ import CreateManagerApi, {
 import AnyObject from '../types/any-object';
 import FieldConfig, { IsEqual } from '../types/field-config';
 import { Meta } from '../types/use-field';
+import { WarningObject } from '../types/compose-validators';
 import { formLevelValidator, isPromise } from './validate';
 import { FormValidator, FormLevelError, Validator } from '../types/validate';
 import findDifference from './find-difference';
@@ -142,7 +143,8 @@ export const initialMeta = (initial: any): Meta => ({
   touched: false,
   valid: true,
   validating: false,
-  visited: false
+  visited: false,
+  warning: undefined
 });
 
 export const createField = (name: string, value: any): FieldState => ({
@@ -307,10 +309,32 @@ const createManagerApi: CreateManagerApi = ({
         if (isPromise(result)) {
           (result as Promise<string | undefined>)
             .then(() => handleFieldError(name, true))
-            .catch((response) => handleFieldError(name, false, response as string | undefined));
+            .catch((response) => {
+              if (response?.type === 'warning') {
+                setFieldState(name, (prev: FieldState) => ({
+                  ...prev,
+                  meta: {
+                    ...prev.meta,
+                    warning: response.error
+                  }
+                }));
+              } else {
+                handleFieldError(name, false, response as string | undefined);
+              }
+            });
           listener.registerValidator(result as Promise<string | undefined>);
         } else {
-          handleFieldError(name, !result, result as string | undefined);
+          if ((result as WarningObject)?.type === 'warning') {
+            setFieldState(name, (prev: FieldState) => ({
+              ...prev,
+              meta: {
+                ...prev.meta,
+                warning: (result as WarningObject)?.error
+              }
+            }));
+          } else {
+            handleFieldError(name, !result, result as string | undefined);
+          }
         }
       }
     }