Fix SingleSelect styling, added add to campaign documentation

admin/client/src/components/AddToCampaignModal/AddToCampaignModal.js

@@ -2,6 +2,7 @@ import React from 'react';
 import { Modal } from 'react-bootstrap-4';
 import SilverStripeComponent from 'lib/SilverStripeComponent';
 import FormBuilder from 'components/FormBuilder/FormBuilder';
+import i18n from 'i18n';
 
 class AddToCampaignModal extends SilverStripeComponent {
   constructor(props) {
@@ -46,9 +47,17 @@ class AddToCampaignModal extends SilverStripeComponent {
   }
 
   getBody() {
-    const schemaUrl = `${this.props.schemaUrl}/${this.props.fileId}`;
-
-    return <FormBuilder schemaUrl={schemaUrl} handleSubmit={this.handleSubmit} />;
+    // if no schema defined, then lets use existing children instead
+    if (!this.props.schemaUrl) {
+      return this.props.children;
+    }
+    return (
+      <FormBuilder
+        schemaUrl={this.props.schemaUrl}
+        handleSubmit={this.handleSubmit}
+        handleAction={this.props.handleAction}
+      />
+    );
   }
 
   getResponse() {
@@ -86,7 +95,6 @@ class AddToCampaignModal extends SilverStripeComponent {
       <Modal
         show={this.props.show}
         onHide={this.props.handleHide}
-        container={document.getElementsByClassName('cms-container')[0]}
       >
         <Modal.Header closeButton>
           <Modal.Title>{this.props.title}</Modal.Title>
@@ -101,11 +109,16 @@ class AddToCampaignModal extends SilverStripeComponent {
 }
 
 AddToCampaignModal.propTypes = {
-  show: React.PropTypes.bool.isRequired,
+  show: React.PropTypes.bool,
   title: React.PropTypes.string,
   handleHide: React.PropTypes.func,
   schemaUrl: React.PropTypes.string,
   handleSubmit: React.PropTypes.func,
 };
 
+AddToCampaignModal.defaultProps = {
+  show: false,
+  title: i18n._t('Campaigns.AddToCampaign', 'Add to campaign'),
+};
+
 export default AddToCampaignModal;

admin/client/src/components/AddToCampaignModal/README.md

@@ -0,0 +1,29 @@
+# AddToCampaignModal
+
+This is a Modal component to help Add a target object to Campaigns (ChangeSets)
+
+## Props
+
+### title (string)
+
+The title that will appear for the Modal, defaults to "Add to campaign".
+
+### show (bool)
+
+Tells the modal when to show and hide from the interface.
+
+### handleHide (func)
+
+Event handler when the modal is sending a hide request, this assumes the value of `show` that is passed will be changed when conditions are met.
+
+### schemaUrl (string)
+
+The url to call which is passed to the `FormBuilder` Component as a prop.
+
+### handleSubmit (func)
+
+Event handler when the form in the Modal is submitted.
+
+### handleAction (func)
+
+Event handler passed to the `FormBuilder` Component as a prop.

admin/client/src/components/FieldHolder/FieldHolder.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import SilverStripeComponent from 'lib/SilverStripeComponent';
 
-function fieldHolderWrapper(Field) {
+function fieldHolder(Field) {
   class FieldHolder extends SilverStripeComponent {
 
     render() {
@@ -39,4 +39,4 @@ function fieldHolderWrapper(Field) {
   return FieldHolder;
 }
 
-export default fieldHolderWrapper;
+export default fieldHolder;

admin/client/src/components/FormBuilder/README.md

@@ -6,14 +6,6 @@ This component will be moved to Framweork or CMS when dependency injection is im
 
 ## PropTypes
 
-### actions
-
-Actions the component can dispatch. This should include but is not limited to:
-
-#### setSchema
-
-An action to call when the response from fetching schema data is returned. This would normally be a simple action to set the store's `schema` key to the returned data.
-
 ### createFn (func)
 
 Gives container components a chance to access a form component before it's constructed. Use this as an opportunity to pass a custom click handler to to a field for example.
@@ -22,10 +14,10 @@ Gives container components a chance to access a form component before it's const
 
 The schema URL where the form will be scaffolded from e.g. '/admin/pages/schema/1'.
 
-### schema
-
-JSON schema representing the form. Used as the blueprint for generating the form.
-
-### onSubmit (func)
+### handleSubmit (func)
 
 Event handler passed to the Form Component as a prop.
+
+### handleAction (func)
+
+Event handler when a form action is clicked on, allows preventing submit and know which action was clicked on.

admin/client/src/components/SingleSelectField/SingleSelectField.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import SilverStripeComponent from 'lib/SilverStripeComponent';
-//import fieldHolder from 'components/FieldHolder/FieldHolder';
+import fieldHolder from 'components/FieldHolder/FieldHolder';
 import i18n from 'i18n';
 
 class SingleSelectField extends SilverStripeComponent {
@@ -45,10 +45,10 @@ class SingleSelectField extends SilverStripeComponent {
   getSelectField() {
     const options = this.props.source || [];
 
-    if (this.props.hasEmptyDefault) {
+    if (this.props.data.hasEmptyDefault) {
       options.unshift({
         value: '',
-        title: this.props.emptyString,
+        title: this.props.data.emptyString,
         disabled: false,
       });
     }
@@ -109,13 +109,20 @@ SingleSelectField.propTypes = {
     title: React.PropTypes.string,
     disabled: React.PropTypes.bool,
   })),
-  hasEmptyDefault: React.PropTypes.bool,
-  emptyString: React.PropTypes.string,
+  data: React.PropTypes.oneOfType([
+    React.PropTypes.array,
+    React.PropTypes.shape({
+      hasEmptyDefault: React.PropTypes.bool,
+      emptyString: React.PropTypes.string,
+    }),
+  ]),
 };
 
 SingleSelectField.defaultProps = {
   source: [],
-  emptyString: i18n._t('Boolean.ANY', 'Any'),
+  data: {
+    emptyString: i18n._t('Boolean.ANY', 'Any'),
+  },
 };
 
-export default SingleSelectField;
+export default fieldHolder(SingleSelectField);

admin/client/src/styles/bundle.scss

@@ -34,10 +34,10 @@
 @import "../components/PopoverField/PopoverField";
 @import "../components/GridField/GridField";
 @import "../components/HiddenField/HiddenField";
+@import "../components/SingleSelectField/SingleSelectField";
 @import "../components/Label/Label";
 @import "../components/Preview/Preview";
 @import "../components/Toolbar/Toolbar";
-@import "../components/Form/Form";
 @import "../components/Tabs/Tabs";
 @import "../components/Form/Form";
 

admin/code/AddToCampaignHandler.php

@@ -176,7 +176,7 @@ class AddToCampaignHandler {
 		$inChangeSets = array_unique(ChangeSetItem::get_for_object($object)->column('ChangeSetID'));
 		$changeSets = $this->getAvailableChangeSets()->map();
 
-		$campaignDropdown = DropdownField::create('Campaign', '', $changeSets);
+		$campaignDropdown = DropdownField::create('Campaign', _t('Campaigns.CampaignTitle', 'Campaigns'), $changeSets);
 		$campaignDropdown->setEmptyString(_t('Campaigns.AddToCampaign', 'Select a Campaign'));
 		$campaignDropdown->addExtraClass('noborder');
 		$campaignDropdown->setDisabledItems($inChangeSets);

lang/en.yml

@@ -106,6 +106,7 @@ en:
     MENUTITLE: Campaigns
   Campaigns:
     AddToCampaign: 'Add To Campaign'
+    CampaignTitle: 'Campaign'
   ChangePasswordEmail_ss:
     CHANGEPASSWORDFOREMAIL: 'The password for account with email address {email} has been changed. If you didn\''t change your password please change your password using the link below'
     CHANGEPASSWORDTEXT1: 'You changed your password for'