[explore-v2] handle field overrides (#1535)

* pass all props to *Field components

* s/fieldSetOverrides/fieldOverrides

* handle field overrides

caravel/assets/javascripts/explorev2/components/ControlPanelsContainer.jsx

@@ -18,12 +18,6 @@ const defaultProps = {
   vizType: null,
 };
 
-function getSectionsToRender(vizSections) {
-  const { datasourceAndVizType, sqlClause } = commonControlPanelSections;
-  const sectionsToRender = [datasourceAndVizType].concat(vizSections, sqlClause);
-  return sectionsToRender;
-}
-
 class ControlPanelsContainer extends React.Component {
   componentWillMount() {
     const { datasourceId, datasourceType } = this.props;
@@ -32,22 +26,36 @@ class ControlPanelsContainer extends React.Component {
     }
   }
 
-  render() {
+  sectionsToRender() {
     const viz = visTypes[this.props.vizType];
-    const sectionsToRender = getSectionsToRender(viz.controlPanelSections);
+    const { datasourceAndVizType, sqlClause } = commonControlPanelSections;
+    const sectionsToRender = [datasourceAndVizType].concat(viz.controlPanelSections, sqlClause);
 
+    return sectionsToRender;
+  }
+
+  fieldOverrides() {
+    const viz = visTypes[this.props.vizType];
+    return viz.fieldOverrides;
+  }
+
+  render() {
     return (
       <Panel>
         <div className="scrollbar-container">
           <div className="scrollbar-content">
-            {sectionsToRender.map((section) => (
+            {this.sectionsToRender().map((section) => (
               <ControlPanelSection
                 key={section.label}
                 label={section.label}
                 tooltip={section.description}
               >
                 {section.fieldSetRows.map((fieldSets, i) => (
-                  <FieldSetRow key={`${section.label}-fieldSetRow-${i}`} fieldSets={fieldSets} />
+                  <FieldSetRow
+                    key={`${section.label}-fieldSetRow-${i}`}
+                    fieldSets={fieldSets}
+                    fieldOverrides={this.fieldOverrides()}
+                  />
                 ))}
               </ControlPanelSection>
             ))}

caravel/assets/javascripts/explorev2/components/FieldSet.jsx

@@ -23,19 +23,19 @@ const defaultProps = {
 
 export default class FieldSet extends React.Component {
   renderCheckBoxField() {
-    return <CheckboxField label={this.props.label} description={this.props.description} />;
+    return <CheckboxField {...this.props} />;
   }
 
   renderTextAreaField() {
-    return <TextAreaField label={this.props.label} description={this.props.description} />;
+    return <TextAreaField {...this.props} />;
   }
 
   renderSelectField() {
-    return <SelectField label={this.props.label} description={this.props.description} />;
+    return <SelectField {...this.props} />;
   }
 
   renderTextField() {
-    return <TextField label={this.props.label} description={this.props.description} />;
+    return <TextField {...this.props} />;
   }
 
   render() {

caravel/assets/javascripts/explorev2/components/FieldSetRow.jsx

@@ -4,14 +4,32 @@ import { fields } from '../stores/store';
 
 const propTypes = {
   fieldSets: PropTypes.array.isRequired,
+  fieldOverrides: PropTypes.object,
 };
 
-export default function FieldSetRow({ fieldSets }) {
+const defaultProps = {
+  fieldOverrides: {},
+};
+
+function getFieldData(fs, fieldOverrides) {
+  let fieldData = fields[fs];
+  if (fieldOverrides.hasOwnProperty(fs)) {
+    const overrideData = fieldOverrides[fs];
+    fieldData = Object.assign({}, fieldData, overrideData);
+  }
+  return fieldData;
+}
+
+export default function FieldSetRow({ fieldSets, fieldOverrides }) {
   return (
     <ul className="list-unstyled">
-      {fieldSets.map((fs) => <li key={fs}><FieldSet {...fields[fs]} /></li>)}
+      {fieldSets.map((fs) => {
+        const fieldData = getFieldData(fs, fieldOverrides);
+        return <li key={fs}><FieldSet name={fs} {...fieldData} /></li>;
+      })}
     </ul>
   );
 }
 
 FieldSetRow.propTypes = propTypes;
+FieldSetRow.defaultProps = defaultProps;

caravel/assets/javascripts/explorev2/stores/store.js

@@ -179,7 +179,7 @@ export const visTypes = {
         ],
       },
     ],
-    fieldSetOverrides: {
+    fieldOverrides: {
       groupby: {
         label: 'Series',
       },