moved some components to container folder

react/components/ChannelSelector.jsx

@@ -1,6 +1,6 @@
 import React from 'react';
-import ChannelLoginForm from './ChannelLoginForm.jsx';
+import ChannelLoginForm from '../containers/ChannelLoginForm.jsx';
-import ChannelCreateForm from './ChannelCreateForm.jsx';
+import ChannelCreateForm from '../containers/ChannelCreateForm.jsx';
 import { connect } from 'react-redux';
 
 const LOGIN = 'login';
@@ -16,7 +16,7 @@ class ChannelSelector extends React.Component {
     this.selectOption = this.selectOption.bind(this);
   }
   componentWillMount () {
-    console.log('ChannelSelector will mount.');
+    console.log('ChannelSelector will mount');
     if (this.props.loggedInChannelName) {
       this.selectOption(this.props.loggedInChannelName);
     }

react/components/Preview.jsx

@@ -11,9 +11,7 @@ class Preview extends React.Component {
   }
   componentWillMount () {
     console.log('Preview will mount');
-    if (this.props.file) {
+    this.previewFile(this.props.file);
-      this.previewFile(this.props.file);
-    }
   }
   componentWillReceiveProps (newProps) {
     console.log('Preview will receive props', newProps);
@@ -44,11 +42,4 @@ class Preview extends React.Component {
   }
 };
 
-const mapStateToProps = state => {
+export default Preview;
-  return {
-    file     : state.file,
-    thumbnail: state.metadata.thumbnail,
-  };
-};
-
-export default connect(mapStateToProps, null)(Preview);

react/containers/AnonymousOrChannelSelect.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { setPublishInChannel } from '../actions';
+import { setPublishInChannel } from '../actions/index';
 import { connect } from 'react-redux';
 
 class AnonymousOrChannelSelect extends React.Component {

react/containers/ChannelCreateForm.jsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import {connect} from 'react-redux';
-import {updateLoggedInChannel} from '../actions';
+import {updateLoggedInChannel} from '../actions/index';
 import { makeGetRequest, makePostRequest } from '../utils/xhr.js';
 import { setUserCookies } from '../utils/cookies.js';
 import { replaceChannelSelectionInNavBar } from '../utils/pageUpdate.js';
@@ -10,8 +10,8 @@ class ChannelCreateForm extends React.Component {
     super(props);
     this.state = {
       error   : null,
-      channel : null,
+      channel : '',
-      password: null,
+      password: '',
       status  : null,
     };
     this.cleanseChannelInput = this.cleanseChannelInput.bind(this);

react/containers/ChannelLoginForm.jsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { makePostRequest } from '../utils/xhr.js';
 import { connect } from 'react-redux';
-import { updateLoggedInChannel } from '../actions';
+import { updateLoggedInChannel } from '../actions/index';
 import { setUserCookies } from '../utils/cookies.js';
 import { replaceChannelSelectionInNavBar } from '../utils/pageUpdate.js';
 
@@ -10,8 +10,8 @@ class ChannelLoginForm extends React.Component {
     super(props);
     this.state = {
       error   : null,
-      name    : null,
+      name    : '',
-      password: null,
+      password: '',
     };
     this.handleInput = this.handleInput.bind(this);
     this.loginToChannel = this.loginToChannel.bind(this);

react/containers/Dropzone.jsx

@@ -1,12 +1,12 @@
 import React from 'react';
 // import PropTypes from 'prop-types';
-import { selectFile } from '../actions';
+import { selectFile } from '../actions/index';
 import { connect } from 'react-redux';
-import Preview from './Preview.jsx';
+import Preview from '../components/Preview.jsx';
 
 import { validateFile } from '../utils/file.js';
 
-class PreviewDropzone extends React.Component {
+class Dropzone extends React.Component {
   constructor (props) {
     super(props);
     this.state = {
@@ -95,7 +95,11 @@ class PreviewDropzone extends React.Component {
         <div id="preview-dropzone" className={'row row--padded row--tall dropzone' + (this.state.dragOver ? ' dropzone--drag-over' : '')} onDrop={this.handleDrop} onDragOver={this.handleDragOver} onDragEnd={this.handleDragEnd} onDragEnter={this.handleDragEnter} onDragLeave={this.handleDragLeave} onMouseEnter={this.handleMouseEnter} onMouseLeave={this.handleMouseLeave} onClick={this.handleClick}>
           {this.props.file ? (
             <div>
-              <Preview dimPreview={this.state.dimPreview}/>
+              <Preview
+                dimPreview={this.state.dimPreview}
+                file={this.props.file}
+                thumbnail={this.props.thumbnail}
+              />
               <div id="dropzone-text-holder" className={'flex-container--column flex-container--center-center'}>
               { this.state.dragOver ? (
                 <div id="dropzone-dragover">
@@ -140,7 +144,8 @@ class PreviewDropzone extends React.Component {
 
 const mapStateToProps = state => {
   return {
-    file: state.file,
+    file     : state.file,
+    thumbnail: state.metadata.thumbnail,
   };
 };
 
@@ -152,4 +157,4 @@ const mapDispatchToProps = dispatch => {
   };
 }
 
-export default connect(mapStateToProps, mapDispatchToProps)(PreviewDropzone);
+export default connect(mapStateToProps, mapDispatchToProps)(Dropzone);

react/containers/PublishForm.jsx

@@ -1,13 +1,13 @@
 import React from 'react';
-import PreviewDropzone from './PreviewDropzone.jsx';
+import PreviewDropzone from './Dropzone.jsx';
 import PublishTitleInput from './PublishTitleInput.jsx';
-import ChannelSelector from './ChannelSelector.jsx';
+import ChannelSelector from '../components/ChannelSelector.jsx';
 import PublishUrlInput from './PublishUrlInput.jsx';
 import PublishThumbnailInput from './PublishThumbnailInput.jsx';
 import PublishMetadataInputs from './PublishMetadataInputs.jsx';
 import AnonymousOrChannelSelect from './AnonymousOrChannelSelect.jsx';
 
-import { selectFile, clearFile, updateLoggedInChannel } from '../actions';
+import { selectFile, clearFile, updateLoggedInChannel } from '../actions/index';
 import { connect } from 'react-redux';
 import { getCookie } from '../utils/cookies.js';
 
@@ -16,8 +16,7 @@ class PublishForm extends React.Component {
     super(props);
     // set defaults
     this.state = {
-      error             : null,
+      error: null,
-      showMetadataInputs: false,
     };
     this.publish = this.publish.bind(this);
   }

react/containers/PublishMetadataInputs.jsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { connect } from 'react-redux';
-import { updateMetadata } from '../actions';
+import { updateMetadata } from '../actions/index';
 
 /*
   const textarea = document.getElementById('publish-description');

react/containers/PublishThumbnailInput.jsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { connect } from 'react-redux';
-import { updateMetadata } from '../actions';
+import { updateMetadata } from '../actions/index';
 
 class ThumbnailInput extends React.Component {
   constructor (props) {

react/containers/PublishTitleInput.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import {updateMetadata} from '../actions';
+import {updateMetadata} from '../actions/index';
 import {connect} from 'react-redux';
 
 class TitleInput extends React.Component {

react/containers/PublishTool.jsx

@@ -1,7 +1,7 @@
 import React from 'react';
-import PreviewDropzone from './PreviewDropzone.jsx';
+import PreviewDropzone from './Dropzone.jsx';
 import PublishForm from './PublishForm.jsx';
-import PublishStatus from './PublishStatus.jsx';
+import PublishStatus from '../components/PublishStatus.jsx';
 import {connect} from 'react-redux';
 
 class PublishTool extends React.Component {

react/containers/PublishUrlInput.jsx

@@ -1,8 +1,8 @@
 import React from 'react';
-import { updateClaim } from '../actions';
+import { updateClaim } from '../actions/index';
 import { connect } from 'react-redux';
 import { makeGetRequest } from '../utils/xhr.js';
-import UrlMiddle from './UrlMiddle.jsx';
+import UrlMiddle from '../components/PublishUrlMiddle.jsx';
 
 class UrlChooser extends React.Component {
   constructor (props) {

react/index.js

@@ -3,7 +3,7 @@ import ReactDOM from 'react-dom';
 import { Provider } from 'react-redux';
 import { createStore } from 'redux';
 import Reducers from './reducers/index.js';
-import PublishTool from './components/PublishTool.jsx';
+import PublishTool from './containers/PublishTool.jsx';
 
 let store = createStore(
   Reducers,

react/reducers/index.js

@@ -36,7 +36,6 @@ export default function (state = initialState, action) {
     case FILE_CLEAR:
       return initialState;
     case METADATA_UPDATE:
-      console.log(`reducer for ${action.name} ${action.value}`);
       return Object.assign({}, state, {
         metadata: Object.assign({}, state.metadata, {
           [action.name]: action.value,