From b37db48c5e0d7fc04e0b198be9573f7d330e3abb Mon Sep 17 00:00:00 2001
From: Nicolas Perriault <nicolas@perriault.net>
Date: Wed, 5 Apr 2017 17:57:43 +0200
Subject: [PATCH] Fix #536: Pass uiSchema to custom array templates.

---
 README.md                           |  1 +
 src/components/fields/ArrayField.js |  6 ++++--
 test/ArrayFieldTemplate_test.js     | 13 ++++++++++++-
 3 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/README.md b/README.md
index 2ad800b250..0d8665cfbf 100644
--- a/README.md
+++ b/README.md
@@ -793,6 +793,7 @@ The following props are passed to each `ArrayFieldTemplate`:
 - `readonly`: A boolean value stating if the array is readonly.
 - `required`: A boolean value stating if the array is required.
 - `schema`: The schema object for this array.
+- `uiSchema`: The uiSchema object for this array field.
 - `title`: A string value containing the title for the array.
 - `formContext`: The `formContext` object that you passed to Form.
 
diff --git a/src/components/fields/ArrayField.js b/src/components/fields/ArrayField.js
index 0f9e1d37fb..6c59dc5ed9 100644
--- a/src/components/fields/ArrayField.js
+++ b/src/components/fields/ArrayField.js
@@ -323,6 +323,7 @@ class ArrayField extends Component {
       DescriptionField,
       disabled,
       idSchema,
+      uiSchema,
       onAddClick: this.onAddClick,
       readonly,
       required,
@@ -475,13 +476,14 @@ class ArrayField extends Component {
       readonly,
       required,
       schema,
+      uiSchema,
       title,
       TitleField,
     };
 
     // Check if a custom template template was passed in
-    const renderFunction = ArrayFieldTemplate || DefaultFixedArrayFieldTemplate;
-    return renderFunction(arrayProps);
+    const Template = ArrayFieldTemplate || DefaultFixedArrayFieldTemplate;
+    return <Template {...arrayProps} />;
   }
 
   renderArrayFieldItem(props) {
diff --git a/test/ArrayFieldTemplate_test.js b/test/ArrayFieldTemplate_test.js
index 128d1ec1a3..b36a35c1eb 100644
--- a/test/ArrayFieldTemplate_test.js
+++ b/test/ArrayFieldTemplate_test.js
@@ -19,7 +19,7 @@ describe("ArrayFieldTemplate", () => {
   describe("Custom ArrayFieldTemplate of string array", () => {
     function ArrayFieldTemplate(props) {
       return (
-        <div className="custom-array">
+        <div className={props.uiSchema.classNames}>
           {props.canAdd && <button className="custom-array-add" />}
           {props.items.map(element => {
             return (
@@ -63,6 +63,10 @@ describe("ArrayFieldTemplate", () => {
         items: { type: "string" },
       };
 
+      const uiSchema = {
+        classNames: "custom-array",
+      };
+
       let node;
 
       beforeEach(() => {
@@ -70,6 +74,7 @@ describe("ArrayFieldTemplate", () => {
           ArrayFieldTemplate,
           formData,
           schema,
+          uiSchema,
         }).node;
       });
 
@@ -114,12 +119,18 @@ describe("ArrayFieldTemplate", () => {
         items: [{ type: "string" }, { type: "string" }, { type: "string" }],
       };
 
+      const uiSchema = {
+        classNames: "custom-array",
+      };
+
       let node;
+
       beforeEach(() => {
         node = createFormComponent({
           ArrayFieldTemplate,
           formData,
           schema,
+          uiSchema,
         }).node;
       });