Show message for sequence greater than 7000 and less than 10 nucleotides

Author: caduribas

src/actions/actionTypes.js

@@ -16,7 +16,7 @@ export const SET_STATUS_TIMEOUT = 'SET_STATUS_TIMEOUT';
 // submission form
 export const SUBMIT_JOB = 'SUBMIT_JOB';
 export const SUBMIT_MULTIPLE_JOB = 'SUBMIT_MULTIPLE_JOB';
-export const LONG_SEQUENCE = 'LONG_SEQUENCE';
+export const INVALID_SEQUENCE = 'INVALID_SEQUENCE';
 export const UPDATE_JOB_ID = 'UPDATE_JOB_ID';
 export const CLEAR_JOB_ID = 'CLEAR_JOB_ID';
 export const CLEAR_RESULT = 'CLEAR_RESULT';

src/actions/actions.js

@@ -113,8 +113,8 @@ export function onClearResult() {
   return {type: types.CLEAR_RESULT}
 }
 
-export function longSequence() {
-  return {type: types.LONG_SEQUENCE}
+export function invalidSequence() {
+  return {type: types.INVALID_SEQUENCE}
 }
 
 export function fetchStatus(jobId) {

src/containers/SequenceSearch/components/SearchForm/index.jsx

@@ -44,10 +44,10 @@ class SearchForm extends React.Component {
       store.dispatch(actions.onMultipleSubmit(getSequence, this.props.databases));
     } else if (state.sequence && state.sequence.match("^([0-9a-fA-F]{8})-(([0-9a-fA-F]{4}\\-){3})([0-9a-fA-F]{12})$")) {
       store.dispatch(actions.updateJobId(state.sequence));
-    } else if (state.sequence && state.sequence.length <= 7000) {
+    } else if (state.sequence && (state.sequence.length < 10 || state.sequence.length > 7000)) {
+      store.dispatch(actions.invalidSequence());
+    } else if (state.sequence) {
       store.dispatch(actions.onSubmit(state.sequence, this.props.databases));
-    } else if (state.sequence && state.sequence.length > 7000) {
-      store.dispatch(actions.longSequence());
     }
 
     state.sequence = "";
@@ -97,10 +97,10 @@ class SearchForm extends React.Component {
               )
             }
             {
-              this.props.status === "longSequence" && (
+              this.props.status === "invalidSequence" && (
                 <div className="small-12 columns">
-                  <div className="callout alert">
-                    <h4>The sequence cannot be longer than 7000 nucleotides</h4>
+                  <div className="callout warning">
+                    {this.props.sequence.length < 10 ? <p>The sequence cannot be shorter than 10 nucleotides</p> : <p>The sequence cannot be longer than 7000 nucleotides</p>}
                   </div>
                 </div>
               )

src/reducers/rootReducer.js

@@ -174,8 +174,8 @@ const rootReducer = function (state = initialState, action) {
         exactMatch: null,
       });
 
-    case actions.LONG_SEQUENCE:
-      return Object.assign({}, state, {status: "longSequence"});
+    case actions.INVALID_SEQUENCE:
+      return Object.assign({}, state, {status: "invalidSequence"});
 
     case actions.FETCH_STATUS:
       if (action.status === 'error') {