From bf30fd986af085a8e57e5a75b950e0beaa97f9b6 Mon Sep 17 00:00:00 2001
From: zombiej <smith3816@gmail.com>
Date: Thu, 10 Sep 2020 10:11:56 +0800
Subject: [PATCH 1/3] init list rule define

---
 src/List.tsx     | 11 +++++++----
 src/interface.ts | 12 +++++++++---
 2 files changed, 16 insertions(+), 7 deletions(-)

diff --git a/src/List.tsx b/src/List.tsx
index 743c012a..ff07bd61 100644
--- a/src/List.tsx
+++ b/src/List.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import warning from 'rc-util/lib/warning';
-import { InternalNamePath, NamePath, StoreValue } from './interface';
+import { InternalNamePath, NamePath, StoreValue, ValidatorRule } from './interface';
 import FieldContext from './FieldContext';
 import Field from './Field';
 import { move, getNamePath } from './utils/valueUtil';
@@ -19,10 +19,11 @@ interface ListOperations {
 
 interface ListProps {
   name: NamePath;
+  rules?: ValidatorRule[];
   children?: (fields: ListField[], operations: ListOperations) => JSX.Element | React.ReactNode;
 }
 
-const List: React.FunctionComponent<ListProps> = ({ name, children }) => {
+const List: React.FunctionComponent<ListProps> = ({ name, children, rules }) => {
   const context = React.useContext(FieldContext);
   const keyRef = React.useRef({
     keys: [],
@@ -48,8 +49,10 @@ const List: React.FunctionComponent<ListProps> = ({ name, children }) => {
 
   return (
     <FieldContext.Provider value={{ ...context, prefixName }}>
-      <Field name={[]} shouldUpdate={shouldUpdate}>
-        {({ value = [], onChange }) => {
+      <Field name={[]} shouldUpdate={shouldUpdate} rules={rules}>
+        {({ value = [], onChange, meta }) => {
+          console.log('>>>>>>', meta);
+
           const { getFieldValue } = context;
           const getNewValue = () => {
             const values = getFieldValue(prefixName || []) as StoreValue[];
diff --git a/src/interface.ts b/src/interface.ts
index 9a86cd6f..6f2a426d 100644
--- a/src/interface.ts
+++ b/src/interface.ts
@@ -50,6 +50,11 @@ type Validator = (
 
 export type RuleRender = (form: FormInstance) => RuleObject;
 
+export interface ValidatorRule {
+  message?: string | ReactElement;
+  validator: Validator;
+}
+
 interface BaseRule {
   enum?: StoreValue[];
   len?: number;
@@ -60,19 +65,20 @@ interface BaseRule {
   required?: boolean;
   transform?: (value: StoreValue) => StoreValue;
   type?: RuleType;
-  validator?: Validator;
   whitespace?: boolean;
 
   /** Customize rule level `validateTrigger`. Must be subset of Field `validateTrigger` */
   validateTrigger?: string | string[];
 }
 
-interface ArrayRule extends Omit<BaseRule, 'type'> {
+type AggregationRule = BaseRule & Partial<ValidatorRule>;
+
+interface ArrayRule extends Omit<AggregationRule, 'type'> {
   type: 'array';
   defaultField?: RuleObject;
 }
 
-export type RuleObject = BaseRule | ArrayRule;
+export type RuleObject = AggregationRule | ArrayRule;
 
 export type Rule = RuleObject | RuleRender;
 

From 9f7813705c659e1e21396614e025d7d010f81110 Mon Sep 17 00:00:00 2001
From: zombiej <smith3816@gmail.com>
Date: Thu, 10 Sep 2020 10:29:39 +0800
Subject: [PATCH 2/3] support error of List

---
 examples/list.tsx         | 22 ++++++++++++++++++++--
 src/List.tsx              | 18 +++++++++++-------
 src/utils/validateUtil.ts |  2 +-
 3 files changed, 32 insertions(+), 10 deletions(-)

diff --git a/examples/list.tsx b/examples/list.tsx
index 76a08a78..16e5aed9 100644
--- a/examples/list.tsx
+++ b/examples/list.tsx
@@ -25,8 +25,20 @@ const Demo = () => {
       >
         <Form.Field shouldUpdate>{() => JSON.stringify(form.getFieldsValue(), null, 2)}</Form.Field>
 
-        <List name="users">
-          {(fields, { add, remove }) => {
+        <List
+          name="users"
+          rules={[
+            {
+              message: 'Must have at least 2 user!',
+              validator: async (_, value) => {
+                if (value.length < 2) {
+                  throw new Error();
+                }
+              },
+            },
+          ]}
+        >
+          {(fields, { add, remove }, { errors }) => {
             console.log('Demo Fields:', fields);
             return (
               <div>
@@ -49,6 +61,12 @@ const Demo = () => {
                   </LabelField>
                 ))}
 
+                <ul>
+                  {errors.map(err => (
+                    <li key={err}>{err}</li>
+                  ))}
+                </ul>
+
                 <button
                   type="button"
                   onClick={() => {
diff --git a/src/List.tsx b/src/List.tsx
index ff07bd61..615f742d 100644
--- a/src/List.tsx
+++ b/src/List.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import warning from 'rc-util/lib/warning';
-import { InternalNamePath, NamePath, StoreValue, ValidatorRule } from './interface';
+import { InternalNamePath, NamePath, StoreValue, ValidatorRule, Meta } from './interface';
 import FieldContext from './FieldContext';
 import Field from './Field';
 import { move, getNamePath } from './utils/valueUtil';
@@ -20,10 +20,15 @@ interface ListOperations {
 interface ListProps {
   name: NamePath;
   rules?: ValidatorRule[];
-  children?: (fields: ListField[], operations: ListOperations) => JSX.Element | React.ReactNode;
+  validateTrigger?: string | string[] | false;
+  children?: (
+    fields: ListField[],
+    operations: ListOperations,
+    meta: Meta,
+  ) => JSX.Element | React.ReactNode;
 }
 
-const List: React.FunctionComponent<ListProps> = ({ name, children, rules }) => {
+const List: React.FunctionComponent<ListProps> = ({ name, children, rules, validateTrigger }) => {
   const context = React.useContext(FieldContext);
   const keyRef = React.useRef({
     keys: [],
@@ -49,10 +54,8 @@ const List: React.FunctionComponent<ListProps> = ({ name, children, rules }) =>
 
   return (
     <FieldContext.Provider value={{ ...context, prefixName }}>
-      <Field name={[]} shouldUpdate={shouldUpdate} rules={rules}>
-        {({ value = [], onChange, meta }) => {
-          console.log('>>>>>>', meta);
-
+      <Field name={[]} shouldUpdate={shouldUpdate} rules={rules} validateTrigger={validateTrigger}>
+        {({ value = [], onChange }, meta) => {
           const { getFieldValue } = context;
           const getNewValue = () => {
             const values = getFieldValue(prefixName || []) as StoreValue[];
@@ -145,6 +148,7 @@ const List: React.FunctionComponent<ListProps> = ({ name, children, rules }) =>
               },
             ),
             operations,
+            meta,
           );
         }}
       </Field>
diff --git a/src/utils/validateUtil.ts b/src/utils/validateUtil.ts
index eb69e93d..8f9051bf 100644
--- a/src/utils/validateUtil.ts
+++ b/src/utils/validateUtil.ts
@@ -181,7 +181,7 @@ export function validateRules(
               callback();
             })
             .catch(err => {
-              callback(err);
+              callback(err || ' ');
             });
         }
       },

From 63ebc6cc984e53989045443396f92c1e0053bc57 Mon Sep 17 00:00:00 2001
From: zombiej <smith3816@gmail.com>
Date: Thu, 10 Sep 2020 10:58:42 +0800
Subject: [PATCH 3/3] add test case

---
 tests/list.test.js | 42 ++++++++++++++++++++++++++++++++++++++++--
 1 file changed, 40 insertions(+), 2 deletions(-)

diff --git a/tests/list.test.js b/tests/list.test.js
index e5798acb..d9c9e2d5 100644
--- a/tests/list.test.js
+++ b/tests/list.test.js
@@ -5,11 +5,12 @@ import { resetWarned } from 'rc-util/lib/warning';
 import Form, { Field, List } from '../src';
 import { Input } from './common/InfoField';
 import { changeValue, getField } from './common';
+import timeout from './common/timeout';
 
 describe('Form.List', () => {
   let form;
 
-  function generateForm(renderList, formProps) {
+  function generateForm(renderList, formProps, listProps) {
     const wrapper = mount(
       <div>
         <Form
@@ -18,7 +19,9 @@ describe('Form.List', () => {
           }}
           {...formProps}
         >
-          <List name="list">{renderList}</List>
+          <List name="list" {...listProps}>
+            {renderList}
+          </List>
         </Form>
       </div>,
     );
@@ -567,4 +570,39 @@ describe('Form.List', () => {
     wrapper.update();
     expect(wrapper.find(Input)).toHaveLength(1);
   });
+
+  it('list support validator', async () => {
+    let operation;
+    let currentMeta;
+    let currentValue;
+
+    const [wrapper] = generateForm(
+      (_, opt, meta) => {
+        operation = opt;
+        currentMeta = meta;
+        return null;
+      },
+      null,
+      {
+        rules: [
+          {
+            validator(_, value) {
+              currentValue = value;
+              return Promise.reject();
+            },
+            message: 'Bamboo Light',
+          },
+        ],
+      },
+    );
+
+    await act(async () => {
+      operation.add();
+      await timeout();
+      wrapper.update();
+    });
+
+    expect(currentValue).toEqual([undefined]);
+    expect(currentMeta.errors).toEqual(['Bamboo Light']);
+  });
 });