Rename fields - prepare booleans

Author: Emmanouil Konstantinidis

rest_framework_docs/static/rest_framework_docs/js/components/fields/input.js renamed to rest_framework_docs/static/rest_framework_docs/js/components/fields/text.js

@@ -33,20 +33,17 @@ var Request = React.createClass({
 
   addField: function (fieldName) {
     var endpoint = this.state.endpoint;
-    var fields = endpoint.fields;
 
     // Check if field already exists
-    if (_.findWhere(fields, {'name': fieldName})) return;
+    if (_.findWhere(endpoint.fields, {'name': fieldName})) return;
 
-    fields.push({
+    endpoint.fields.push({
       name: fieldName,
       required: false,
       type: 'text',
       isCustom: true
     });
 
-    endpoint.fields = fields;
-
     this.setState({
       endpoint: endpoint
     });

rest_framework_docs/static/rest_framework_docs/js/components/request.js

@@ -51,7 +51,7 @@ var AddFieldsForm = React.createClass({
           <div className="col-sm-2">
             <button
               type="button"
-              className='btn btn-sm btn-block btn-primary'
+              className='btn btn-sm btn-block btn-info'
               onClick={this.addField}>
               Add
             </button>

rest_framework_docs/static/rest_framework_docs/js/components/request/add-fields.js

@@ -1,8 +1,19 @@
 var React = require('react');
 
-var FieldInput = require('../fields/input');
+var FieldText = require('../fields/text');
 
 var Data = React.createClass({
+  getInitialState: function() {
+    return {
+      fields: this.props.fields
+    };
+  },
+
+  componentWillReceiveProps: function(nextProps) {
+    this.setState({
+      fields: nextProps.fields
+    });
+  },
 
   removeCustomField: function (fieldName) {
     this.props.removeCustomField(fieldName);
@@ -12,23 +23,29 @@ var Data = React.createClass({
     this.props.onChange(event.target.value, fieldName);
   },
 
+  _renderTextInput: function (field, key) {
+    var value = this.props.data[field.name];
+    var type = field.name == 'password' ? 'password' : 'text';
+    return (
+      <FieldText
+        key={key}
+        type={type}
+        name={field.name}
+        value={value}
+        placeholder={field.type}
+        required={field.required ? 'required' : false}
+        removeField={this.removeCustomField}
+        isCustom={field.isCustom ? 'isCustom' : false}
+        onChange={this.handleChange.bind(this, field.name)} />
+    );
+  },
+
   _renderFields: function () {
-    return this.props.fields.map(function (field, key) {
-      var value = this.props.data[field.name];
-      var type = field.name == 'password' ? 'password' : 'text';
-
-      return (
-        <FieldInput
-          key={key}
-          type={type}
-          name={field.name}
-          value={value}
-          placeholder={field.type}
-          required={field.required ? 'required' : false}
-          removeField={this.removeCustomField}
-          isCustom={field.isCustom ? 'isCustom' : false}
-          onChange={this.handleChange.bind(this, field.name)} />
-      );
+    return this.state.fields.map(function (field, key) {
+      switch (field.type) {
+      case ('CharField'):
+        return this._renderTextInput(field, key);
+      }
     }, this);
   },
 

rest_framework_docs/static/rest_framework_docs/js/components/request/data.js

@@ -1,7 +1,7 @@
 var React = require('react');
 
 var Header = require('../helpers/header');
-var Input = require('../helpers/input');
+var FieldText = require('../fields/text');
 
 var FieldUrl = React.createClass({
 
@@ -25,7 +25,7 @@ var FieldUrl = React.createClass({
     return (
       <div>
         <Header title='API Endpoint' />
-        <Input
+        <FieldText
           type='text'
           name='Url Endpoint'
           value={this.state.url}

rest_framework_docs/static/rest_framework_docs/js/components/request/field-url.js

@@ -1,7 +1,7 @@
 var React = require('react');
 
 var Header = require('../helpers/header');
-var FieldInput = require('../fields/input');
+var FieldText = require('../fields/text');
 var RequestUtils = require('../../utils/request');
 
 var Headers = React.createClass({
@@ -30,7 +30,7 @@ var Headers = React.createClass({
     return (
       <div>
         <Header title='Headers' />
-        <FieldInput
+        <FieldText
           name='authorization'
           value={this.state.authorization}
           placeholder='Token 1234567890'

rest_framework_docs/static/rest_framework_docs/js/components/request/headers.js

@@ -46,8 +46,7 @@ var Response = React.createClass({
         {hasToken ? (
           <div className='well well-default text-center'>
             <button className='btn btn-sm btn-info' onClick={this.saveToken}>
-              <i className='fa fa-key' />
-              Save Token
+              <i className='fa fa-key' /> Save Token
           </button>
             <h6>Your token will be lost when you refresh the page.</h6>
           </div>