From 2b6a84c1f517ee73e210d32b40e781cebeffcca8 Mon Sep 17 00:00:00 2001
From: Berkeley Martinez <Berkeley@robotie.com>
Date: Fri, 16 Oct 2015 20:05:22 -0700
Subject: [PATCH] Fix lint errors. Add more copy

---
 client/less/jobs.less                        |  8 +++++
 common/app/routes/Jobs/components/Jobs.jsx   | 33 ++++++++++++--------
 common/app/routes/Jobs/components/List.jsx   | 16 +++++++---
 common/app/routes/Jobs/components/NewJob.jsx | 18 ++++++-----
 4 files changed, 51 insertions(+), 24 deletions(-)

diff --git a/client/less/jobs.less b/client/less/jobs.less
index cb1175f536..7ab32f7a93 100644
--- a/client/less/jobs.less
+++ b/client/less/jobs.less
@@ -10,3 +10,11 @@ a.jobs-list-highlight:hover {
   cursor: pointer;
   cursor: hand;
 }
+
+.jobs-checkbox-spacer input[type="checkbox"] {
+  margin-left: -23px
+}
+
+.jobs-checkbox-spacer label {
+  padding-left: 130px
+}
diff --git a/common/app/routes/Jobs/components/Jobs.jsx b/common/app/routes/Jobs/components/Jobs.jsx
index 31327b9ef1..d9c7eccdf4 100644
--- a/common/app/routes/Jobs/components/Jobs.jsx
+++ b/common/app/routes/Jobs/components/Jobs.jsx
@@ -1,36 +1,36 @@
 import React, { cloneElement, PropTypes } from 'react';
 import { contain } from 'thundercats-react';
-import { History } from 'react-router';
 import { Button, Panel, Row, Col } from 'react-bootstrap';
 
-import CreateJobModal from './CreateJobModal.jsx';
 import ListJobs from './List.jsx';
 
 export default contain(
   {
     store: 'jobsStore',
     fetchAction: 'jobActions.getJobs',
-    actions: 'jobActions'
+    actions: [
+      'appActions',
+      'jobActions'
+    ]
   },
   React.createClass({
     displayName: 'Jobs',
 
-    mixins: [History],
-
     propTypes: {
       children: PropTypes.element,
+      appActions: PropTypes.object,
       jobActions: PropTypes.object,
       jobs: PropTypes.array,
       showModal: PropTypes.bool
     },
 
     handleJobClick(id) {
-      const { jobActions } = this.props;
+      const { appActions, jobActions } = this.props;
       if (!id) {
         return null;
       }
       jobActions.findJob(id);
-      this.history.pushState(null, `/jobs/${id}`);
+      appActions.goTo(`/jobs/${id}`);
     },
 
     renderList(handleJobClick, jobs) {
@@ -55,8 +55,7 @@ export default contain(
       const {
         children,
         jobs,
-        showModal,
-        jobActions
+        appActions
       } = this.props;
 
       return (
@@ -77,17 +76,25 @@ export default contain(
                   </p>
                 </Col>
                 <Col
-                  xs={ 12 }
                   sm={ 8 }
-                  smOffset={ 2 }>
+                  smOffset={ 2 }
+                  xs={ 12 }>
                   <Button
                     bsSize='large'
                     className='signup-btn btn-block'
-                    onClick={ ()=> {this.history.pushState(null, "/jobs/new")} }>
+                    onClick={ ()=> {
+                      appActions.goTo('/jobs/new');
+                    }}>
                     Post a job: $200 for 30 days + weekly tweets
                   </Button>
                   <div className='button-spacer' />
-                  <a href="https://twitter.com/CamperJobs" className="twitter-follow-button" data-show-count="false" data-size="large">Follow @CamperJobs</a>
+                  <a
+                    className='twitter-follow-button'
+                    data-show-count='false'
+                    data-size='large'
+                    href='https://twitter.com/CamperJobs'>
+                    Follow @CamperJobs
+                  </a>
                   <div className='spacer' />
                 </Col>
               </Row>
diff --git a/common/app/routes/Jobs/components/List.jsx b/common/app/routes/Jobs/components/List.jsx
index 5bfb32c360..49d471f097 100644
--- a/common/app/routes/Jobs/components/List.jsx
+++ b/common/app/routes/Jobs/components/List.jsx
@@ -11,6 +11,17 @@ export default React.createClass({
     jobs: PropTypes.array
   },
 
+  addLocation(locale) {
+    if (!locale) {
+      return null;
+    }
+    return (
+      <span className='hidden-xs hidden-sm'>
+        { locale } - {' '}
+      </span>
+    );
+  },
+
   renderJobs(handleClick, jobs = []) {
     return jobs
       .filter(({ isPaid, isApproved, isFilled }) => {
@@ -42,14 +53,11 @@ export default React.createClass({
                 <span className='hidden-xs hidden-sm'>
                   - { position }
                 </span>
-                {' '}
-                <span className='hidden-xs hidden-sm'>
-                  ({ locale })
-                </span>
               </h4>
               <h4
                 className='pull-right'
                 style={{ display: 'inline-block' }}>
+                { this.addLocation(locale) }
                 { moment(new Date(postedOn)).format('MMM Do') }
               </h4>
             </div>
diff --git a/common/app/routes/Jobs/components/NewJob.jsx b/common/app/routes/Jobs/components/NewJob.jsx
index 8aa6e05b21..a211c07aed 100644
--- a/common/app/routes/Jobs/components/NewJob.jsx
+++ b/common/app/routes/Jobs/components/NewJob.jsx
@@ -37,6 +37,9 @@ const checkValidity = [
   'company',
   'highlight'
 ];
+const hightlightCopy = `
+Highlight my post to make it stand out. (+$50)
+`;
 
 function formatValue(value, validator, type = 'string') {
   const formated = getDefaults(type);
@@ -214,7 +217,9 @@ export default contain({
                     label='Job Title'
                     labelClassName={ labelClass }
                     onChange={ (e) => handleChange('position', e) }
-                    placeholder='e.g. Full Stack Developer, Front End Developer, etc.'
+                    placeholder={
+                      'e.g. Full Stack Developer, Front End Developer, etc.'
+                    }
                     required={ true }
                     type='text'
                     value={ position.value }
@@ -289,19 +294,18 @@ export default contain({
                     value={ logo.value }
                     wrapperClassName={ inputClass } />
 
-                  <div className='divider'>
-                    <h2>Highlight your listing to make it stand out</h2>
-                  </div>
+                  <div className='divider' />
                   <Input
                     checked={ highlight.value }
-                    label="&thinsp;&thinsp;&thinsp;Sure - I'll pay $50 more for that."
-                    labelClassName={ 'col-sm-offset-1 col-sm-6'}
+                    label={ hightlightCopy }
+                    labelClassName={ 'col-sm-offset-1 col-sm-6' }
                     onChange={
                       ({ target: { checked } }) => handleForm({
                         highlight: !!checked
                       })
                     }
-                    type='checkbox' />
+                    type='checkbox'
+                    wrapperClassName='jobs-checkbox-spacer' />
                   <div className='spacer' />
                   <Row>
                     <Col