fixed channel select to display logged in channel by default

client/build/components/ChannelSelectDropdown/index.js

@@ -21,8 +21,7 @@ var ChannelSelectDropdown = function ChannelSelectDropdown(_ref) {
     value: selectedChannel,
     onChange: handleSelection
   }, loggedInChannelName && _react.default.createElement("option", {
-    value: loggedInChannelName,
+    value: loggedInChannelName
-    id: "publish-channel-select-channel-option"
   }, loggedInChannelName), _react.default.createElement("option", {
     value: _publish_channel_select_states.LOGIN
   }, "Existing"), _react.default.createElement("option", {

client/build/containers/ChannelSelect/view.js

@@ -60,6 +60,15 @@ function (_React$Component) {
   }
 
   _createClass(ChannelSelect, [{
+    key: "componentWillMount",
+    value: function componentWillMount() {
+      var loggedInChannelName = this.props.loggedInChannelName;
+
+      if (loggedInChannelName) {
+        this.props.onChannelSelect(loggedInChannelName);
+      }
+    }
+  }, {
     key: "toggleAnonymousPublish",
     value: function toggleAnonymousPublish(event) {
       var value = event.target.value;
@@ -79,27 +88,33 @@ function (_React$Component) {
   }, {
     key: "render",
     value: function render() {
+      var _this$props = this.props,
+          publishInChannel = _this$props.publishInChannel,
+          channelError = _this$props.channelError,
+          selectedChannel = _this$props.selectedChannel,
+          loggedInChannelName = _this$props.loggedInChannelName;
       return _react.default.createElement("div", null, _react.default.createElement(_PublishDetailsRow.default, {
         label: _react.default.createElement(_ChooseAnonymousPublishRadio.default, {
-          publishInChannel: this.props.publishInChannel,
+          publishInChannel: publishInChannel,
           toggleAnonymousPublish: this.toggleAnonymousPublish
         }),
         content: _react.default.createElement(_ChooseChannelPublishRadio.default, {
-          publishInChannel: this.props.publishInChannel,
+          publishInChannel: publishInChannel,
           toggleAnonymousPublish: this.toggleAnonymousPublish
         })
       }), _react.default.createElement(_ErrorDisplay.default, {
-        errorMessage: this.props.channelError,
+        errorMessage: channelError,
         defaultMessage: 'Publish anonymously or in a channel'
       }), this.props.publishInChannel && _react.default.createElement("div", null, _react.default.createElement(_PublishDetailsRow.default, {
         label: _react.default.createElement(_Label.default, {
           value: 'Channel:'
         }),
         content: _react.default.createElement(_ChannelSelectDropdown.default, {
-          selectedChannel: this.props.selectedChannel,
+          selectedChannel: selectedChannel,
-          handleSelection: this.handleSelection
+          handleSelection: this.handleSelection,
-        }, "loggedInChannelName=", this.props.loggedInChannelName)
+          loggedInChannelName: loggedInChannelName
-      }), this.props.selectedChannel === _publish_channel_select_states.LOGIN && _react.default.createElement(_ChannelLoginForm.default, null), this.props.selectedChannel === _publish_channel_select_states.CREATE && _react.default.createElement(_ChannelCreateForm.default, null)));
+        })
+      }), selectedChannel === _publish_channel_select_states.LOGIN && _react.default.createElement(_ChannelLoginForm.default, null), selectedChannel === _publish_channel_select_states.CREATE && _react.default.createElement(_ChannelCreateForm.default, null)));
     }
   }]);
 

client/build/reducers/publish.js

@@ -63,9 +63,16 @@ var customizedPublishReducer = function customizedPublishReducer(siteConfig) {
 
     switch (action.type) {
       case actions.FILE_SELECTED:
-        return Object.assign({}, initialState, {
+        return Object.assign({}, state, {
-          // note: clears to initial state
+          file: action.data,
-          file: action.data
+          claim: '',
+          metadata: {
+            title: '',
+            description: '',
+            license: '',
+            nsfw: false
+          },
+          thumbnail: null
         });
 
       case actions.FILE_CLEAR:

client/scss/_variables.scss

@@ -0,0 +1,11 @@
+$base-color: white;
+$primary-color: black;
+$secondary-color: #9b9b9b;
+$tertiary-color: #ccccc0;
+$interactive-color : blue;
+
+$primary-padding: 3em;
+$secondary-padding: 2em;
+
+$background-color: $base-color;
+$font-color: $primary-color;

client/scss/all.scss

@@ -1,3 +1,4 @@
+@import '_variables';
 @import '_reset';
 @import '_font';
 @import '_html';

client/scss/components/_column.scss

@@ -1,4 +1,4 @@
 .column {
-  padding-left: 2em;
+  padding-left: $primary-padding;
-  padding-right: 2em;
+  padding-right: $primary-padding;
 }

client/scss/components/_horizontal-split.scss

@@ -5,6 +5,5 @@
   align-items    : flex-start;
   .column {
     width: 50%;
-    padding: 0 2em 0 2em;
   }
 };

client/scss/components/_nav-bar.scss

@@ -1,7 +1,7 @@
 .nav-bar {
-  padding-left: 2em;
+  padding-left: $primary-padding;
-  padding-right: 2em;
+  padding-right: $primary-padding;
-  border-bottom: 0.5px solid #cacaca;
+  border-bottom: 0.5px solid $tertiary-color;
 }
 
 // old
@@ -15,7 +15,7 @@
 }
 
 .nav-bar-link {
-  padding: 1.5rem;
+  padding: $secondary-padding;
   display: inline-block;
 }
 

client/scss/components/_page-content.scss

@@ -1,5 +1,5 @@
 .page-content {
-  margin: 2em;
+  margin: $primary-padding;
   // fill the parent flex container
   flex: 1 0 auto;
   // be a flex container for children

client/src/components/ChannelSelectDropdown/index.jsx

@@ -9,12 +9,7 @@ const ChannelSelectDropdown = ({ selectedChannel, handleSelection, loggedInChann
       value={selectedChannel}
       onChange={handleSelection}>
       { loggedInChannelName && (
-        <option
+        <option value={loggedInChannelName} >{loggedInChannelName}</option>
-          value={loggedInChannelName}
-          id='publish-channel-select-channel-option'
-        >
-          {loggedInChannelName}
-        </option>
       )}
       <option value={LOGIN}>Existing</option>
       <option value={CREATE}>New</option>

client/src/containers/ChannelSelect/view.jsx

@@ -15,6 +15,12 @@ class ChannelSelect extends React.Component {
     this.toggleAnonymousPublish = this.toggleAnonymousPublish.bind(this);
     this.handleSelection = this.handleSelection.bind(this);
   }
+  componentWillMount () {
+    const { loggedInChannelName } = this.props;
+    if (loggedInChannelName) {
+      this.props.onChannelSelect(loggedInChannelName);
+    }
+  }
   toggleAnonymousPublish (event) {
     const value = event.target.value;
     if (value === 'anonymous') {
@@ -28,24 +34,25 @@ class ChannelSelect extends React.Component {
     this.props.onChannelSelect(selectedOption);
   }
   render () {
+    const { publishInChannel, channelError, selectedChannel, loggedInChannelName } = this.props;
     return (
       <div>
         <PublishDetailsRow
           label={
             <ChooseAnonymousPublishRadio
-              publishInChannel={this.props.publishInChannel}
+              publishInChannel={publishInChannel}
               toggleAnonymousPublish={this.toggleAnonymousPublish}
             />
           }
           content={
             <ChooseChannelPublishRadio
-              publishInChannel={this.props.publishInChannel}
+              publishInChannel={publishInChannel}
               toggleAnonymousPublish={this.toggleAnonymousPublish}
             />
           }
         />
         <ErrorDisplay
-          errorMessage={this.props.channelError}
+          errorMessage={channelError}
           defaultMessage={'Publish anonymously or in a channel'}
         />
 
@@ -57,14 +64,14 @@ class ChannelSelect extends React.Component {
               }
               content={
                 <ChannelSelectDropdown
-                  selectedChannel={this.props.selectedChannel}
+                  selectedChannel={selectedChannel}
-                  handleSelection={this.handleSelection}>
+                  handleSelection={this.handleSelection}
-                  loggedInChannelName={this.props.loggedInChannelName}
+                  loggedInChannelName={loggedInChannelName}
-                </ChannelSelectDropdown>
+                />
               }
             />
-            { (this.props.selectedChannel === LOGIN) && <ChannelLoginForm /> }
+            { (selectedChannel === LOGIN) && <ChannelLoginForm /> }
-            { (this.props.selectedChannel === CREATE) && <ChannelCreateForm /> }
+            { (selectedChannel === CREATE) && <ChannelCreateForm /> }
           </div>
         )}
       </div>

client/src/reducers/publish.js

@@ -46,8 +46,16 @@ const customizedPublishReducer = (siteConfig) => {
   return (state = initialState, action) => {
     switch (action.type) {
       case actions.FILE_SELECTED:
-        return Object.assign({}, initialState, {  // note: clears to initial state
+        return Object.assign({}, state, {
           file    : action.data,
+          claim   : '',
+          metadata: {
+            title      : '',
+            description: '',
+            license    : '',
+            nsfw       : false,
+          },
+          thumbnail: null,
         });
       case actions.FILE_CLEAR:
         return initialState;