diff --git a/packages/scxa-faceted-search-results/html/fetch-loader/ExperimentCard.js b/packages/scxa-faceted-search-results/html/fetch-loader/ExperimentCard.js
index 301033c4..6545c0c5 100644
--- a/packages/scxa-faceted-search-results/html/fetch-loader/ExperimentCard.js
+++ b/packages/scxa-faceted-search-results/html/fetch-loader/ExperimentCard.js
@@ -21,6 +21,12 @@ const CardContainerDiv = styled.div`
}
`
+const SmallIconDiv = styled.div`
+ width: 5%;
+ text-align: center;
+ font-size: 3rem;
+`
+
const IconDiv = styled.div`
width: 15%;
text-align: center;
@@ -48,6 +54,8 @@ const CountDiv = styled.div`
text-align: center;
`
+const ANNDATA = `E-ANND`
+
class ExperimentCard extends React.Component {
constructor(props) {
super(props)
@@ -58,7 +66,7 @@ class ExperimentCard extends React.Component {
}
render() {
- const {url, species, experimentDescription, markerGenes, numberOfAssays, factors} = this.props
+ const {url, species, experimentDescription, markerGenes, numberOfAssays, experimentAccession, type, factors} = this.props
const markerGeneLinks = markerGenes ? markerGenes.map((markerGene) =>
@@ -68,6 +76,16 @@ class ExperimentCard extends React.Component {
return (
+
+
+ {
+ experimentAccession.substring(0,6) === ANNDATA ?
+ //tbc
+
:
+
+ }
+
+
{species}
@@ -110,7 +128,9 @@ ExperimentCard.propTypes = {
url: PropTypes.string.isRequired
})),
numberOfAssays: PropTypes.number.isRequired,
- factors: PropTypes.array.isRequired
+ factors: PropTypes.array.isRequired,
+ experimentAccession: PropTypes.string.isRequired
+ type: PropTypes.string.isRequired
}
export default ExperimentCard
diff --git a/packages/scxa-faceted-search-results/html/fetch-loader/ExperimentsHeader.js b/packages/scxa-faceted-search-results/html/fetch-loader/ExperimentsHeader.js
index 6209e9f2..aef96e86 100644
--- a/packages/scxa-faceted-search-results/html/fetch-loader/ExperimentsHeader.js
+++ b/packages/scxa-faceted-search-results/html/fetch-loader/ExperimentsHeader.js
@@ -13,6 +13,15 @@ const CardContainerDiv = styled.div`
font-size: 0.9rem;
`
+const SmallIconDiv = styled.div`
+ width: 5%;
+ text-align: center;
+ cursor: pointer;
+ opacity: 0.6;
+ transition: 0.3s;
+ :hover {opacity: 1};
+`
+
const IconDiv = styled.div`
width: 15%;
text-align: center;
@@ -57,9 +66,9 @@ const CountDiv = styled.div`
const ExperimentTableHeaderBasic = () =>
({
- 'titles': [`Species`, `Marker genes`, `Title`, `Experimental variables`, `Number of assays`],
- 'styles': [IconDiv, MarkerDiv, TitleDiv, VariableDiv, CountDiv],
- 'attributes': [`species`, `markerGenes`, `experimentDescription`, null, `numberOfAssays`]
+ 'titles': [`Experiment type`, `Species`, `Marker genes`, `Title`, `Experimental variables`, `Number of assays`],
+ 'styles': [SmallIconDiv, IconDiv, MarkerDiv, TitleDiv, VariableDiv, CountDiv],
+ 'attributes': [`experimentAccession`, `species`, `markerGenes`, `experimentDescription`, null, `numberOfAssays`]
})