Decoupling tabs in the experiment page and display them after validating

app/src/main/javascript/bundles/experiment-page/src/ExperimentPageRouter.js

@@ -24,18 +24,50 @@ const TabCommonPropTypes = {
 }
 
 // What component each tab type should render, coupled to ExperimentController.java
-const tabTypeComponent = {
-  'results' : TSnePlotViewRoute,
-  'experiment-design' : ExperimentDesignRoute,
-  'supplementary-information' : SupplementaryInformationRoute,
-  'downloads' : DownloadsRoute
+let tabTypeComponent = []
+
+function validateCommonRequiredProps({speciesName},{atlasUrl},{experimentAccession}) {
+  if ( (typeof speciesName == 'string' && speciesName instanceof String) &&
+      (typeof atlasUrl == 'string' && atlasUrl instanceof String) &&
+      (typeof experimentAccession == 'string' && experimentAccession instanceof String)) {
+        return true;
+  }
+  else return false;
+}
+
+function validateTab({tabType}) {
+  if (tabType === 'results') {
+    if ( validateCommonRequiredProps({speciesName},atlasUrl,experimentAccession) && Array.isArray(tab.props.ks)) {
+      console.log("result **************",tabTypeComponent.push({'results' : TSnePlotViewRoute}))
+    }
+  }
+  else if (tabType === 'experiment-design') {
+    if (Array.isArray(tab.props.table.data) && validateCommonRequiredProps({speciesName},{atlasUrl},{experimentAccession})) {
+      console.log("experiment-design **************",tabTypeComponent.push({'experiment-design' : ExperimentDesignRoute}));
+    }
+  }
+  else if(tabType === 'supplementary-information') {
+     if (Array.isArray(tab.props.sections) && validateCommonRequiredProps({speciesName},{atlasUrl},{experimentAccession})) {
+       console.log("supplementary-information **************", tabTypeComponent.push({'supplementary-information' : SupplementaryInformationRoute}))
+     }
+  }
+  else {
+    if (Array.isArray(tab.props.data) &&  validateCommonRequiredProps({speciesName},{atlasUrl},{experimentAccession})) {
+      console.log('download********', tabTypeComponent.push({'resources' : DownloadsRoute}))
+    }
+  }
 }
 
+
+
 const TopRibbon = ({tabs, routeProps}) =>
   <ul className={`tabs`}>
     {
       tabs.map((tab) =>
         <li title={tab.name} key={tab.type} className={`tabs-title`}>
+          {
+              validateTab(tab.type)
+          }
           <NavLink to={{pathname:`/${tab.type}`, search: routeProps.location.search, hash: routeProps.location.hash}}
                    activeClassName={`active`}>
             {tab.name}