Commit 7a5b61ef authored by Viacheslav Pavlov's avatar Viacheslav Pavlov

Merge branch '326-subset-dataset-display-page-update' into 'master'

Subset Dataset display page update

Closes #326

See merge request genesys-pgr/genesys-ui!340
parents 03b17316 7c86828f
......@@ -1175,6 +1175,7 @@
},
"datasetDisplay": {
"accessionsEvaluated": "Accessions evaluated",
"accessions": "Accessions",
"rematch": "Rematch accessions",
"contact": "Data provider contact information",
"creators": "Dataset creators",
......@@ -1182,6 +1183,7 @@
"datasetFile": "Dataset file",
"datasetMetadata": "Dataset metadata",
"otherMetadata": "Other Metadata",
"listOfAccessions": "List of accessions included in the dataset",
"locations": "Locations",
"traitsObserved": "Traits observed",
"useAndLicensing": "Dataset use and licensing",
......@@ -2165,7 +2167,12 @@
},
"subsetDisplay": {
"subsetCreators": "Subset creators",
"rematch": "Rematch accessions"
"rematch": "Rematch accessions",
"subsetMetadata": "Subset metadata",
"dataAndResources": "Data and resources",
"mcpdPasportData": "MCPD passport data",
"listOfAccessions": "List of accessions included in the subset",
"accessions": "Accessions"
}
},
"f": {
......
......@@ -160,6 +160,7 @@
},
"datasetDisplay": {
"accessionsEvaluated": "Accessions evaluated",
"accessions": "Accessions",
"rematch": "Rematch accessions",
"contact": "Data provider contact information",
"creators": "Dataset creators",
......@@ -167,6 +168,7 @@
"datasetFile": "Dataset file",
"datasetMetadata": "Dataset metadata",
"otherMetadata": "Other Metadata",
"listOfAccessions": "List of accessions included in the dataset",
"locations": "Locations",
"traitsObserved": "Traits observed",
"useAndLicensing": "Dataset use and licensing",
......
......@@ -41,6 +41,7 @@ import AccessionRefCard from 'accessions/ui/c/AccessionRefCard';
import Number from 'ui/common/Number';
import DownloadDialog from 'ui/common/download-dialog';
import {DatasetLink} from 'ui/genesys/Links';
import SectionHeader from 'ui/common/heading/SectionHeader';
import BlurbText from 'cms/ui/c/BlurbText';
const styles = (theme) => ({
......@@ -256,7 +257,7 @@ class DetailInfo extends React.Component<IDetailInfoProps, any> {
}
const renderAccession = (accessionRef: AccessionRef, index: number) => (
<Grid key={ `aref-${index}` } item xs={ 12 } className="pt-5 pb-5 pr-10 pl-10">
<Grid key={ `aref-${index}` } item xs={ 12 } className="pt-5 pb-5">
<AccessionRefCard index={ index } accessionRef={ accessionRef }/>
</Grid>
);
......@@ -516,12 +517,18 @@ class DetailInfo extends React.Component<IDetailInfoProps, any> {
) }
{ accessionRefs && accessionRefs.content && accessionRefs.content.length > 0 && (
<PagedLoader
paged={ accessionRefs }
loadMore={ this.props.loadAccessions }
roughItemHeight={ 80 }
itemRenderer={ renderAccession }
/>
<Grid item xs={ 12 } className="p-10">
<SectionHeader
title={ t('datasets.public.c.datasetDisplay.accessions') }
subTitle={ t('datasets.public.c.datasetDisplay.listOfAccessions') }
/>
<PagedLoader
paged={ accessionRefs }
loadMore={ this.props.loadAccessions }
roughItemHeight={ 80 }
itemRenderer={ renderAccession }
/>
</Grid>
) }
</Grid>
</div>
......
......@@ -14,7 +14,12 @@
},
"subsetDisplay": {
"subsetCreators": "Subset creators",
"rematch": "Rematch accessions"
"rematch": "Rematch accessions",
"subsetMetadata": "Subset metadata",
"dataAndResources": "Data and resources",
"mcpdPasportData": "MCPD passport data",
"listOfAccessions": "List of accessions included in the subset",
"accessions": "Accessions"
}
},
"f": {
......
......@@ -85,9 +85,9 @@ class DisplayPage extends React.Component<IDisplayPageProps, any> {
return (
<PageLayout>
<PageTitle title={ !loading && subset ? subset.title : t('common:label.loading', { what: t('subsets.public.p.display.title') }) }/>
<PageTitle title={ !loading ? subset && subset.title : t('common:label.loading', { what: t('subsets.public.p.display.title') }) }/>
<ContentHeaderWithButton
title={ !loading && subset ? subset.title : t('common:label.loading', { what: t('subsets.public.p.display.title') }) }
title={ !loading ? t('subsets.public.p.display.title') : t('common:label.loading', { what: t('subsets.public.p.display.title') }) }
buttons={ isActionsActive ? <ActionButton action={ this.onUnpublish } title={ t('common:action.reject') }/> : '' }
/>
......
......@@ -98,7 +98,7 @@ const SubsetCard = (
className={ subset.currentVersion && classes.hasNewVersion }
title={
<span>
{ !complete ? <SubsetLink to={ subset }/> : t('subsets.public.p.display.title') }
{ !complete ? <SubsetLink to={ subset }/> : subset.title }
</span>
}/>
<CardContent>
......
......@@ -13,7 +13,6 @@ import Page from 'model/Page';
import {AccessionRef} from 'model/accession/AccessionRef';
// ui
import SubsetCard from 'subsets/ui/c/SubsetCard';
import PropertiesCard from 'ui/common/PropertiesCard';
import Grid from '@material-ui/core/Grid';
import Loading from 'ui/common/Loading';
import PagedLoader from 'ui/common/PagedLoader';
......@@ -22,14 +21,19 @@ import DownloadDialog from 'ui/common/download-dialog';
import ButtonBar from 'ui/common/buttons/ButtonBar';
import {Button} from '@material-ui/core';
import Authorize from 'ui/common/authorized/Authorize';
import SectionHeader from 'ui/common/heading/SectionHeader';
import Section from 'ui/common/layout/Section';
import { Properties, PropertiesItem } from 'ui/common/Properties';
import Divider from '@material-ui/core/Divider/Divider';
const styles = (theme) => ({
accessionSection: {
section: {
marginTop: '16px',
},
accessionCard: {
// marginBottom: '8px',
},
buttonGreen: theme.buttons.green,
});
interface IDetailInfoProps extends React.ClassAttributes<any> {
......@@ -66,7 +70,7 @@ class DetailInfo extends React.Component<IDetailInfoProps, any> {
}
public render() {
const {classes, subset, t, accessions, loadAccessions, apiUrl} = this.props;
const {classes, subset, t, accessions, loadAccessions, apiUrl, userRoles} = this.props;
if (!subset) {
log('Waiting for subset.');
......@@ -74,7 +78,7 @@ class DetailInfo extends React.Component<IDetailInfoProps, any> {
}
const renderAccession = (accessionRef: AccessionRef, index: number) => (
<Grid key={ `aref-${index}` } item xs={ 12 } className={ classes.accessionCard }>
<Grid key={ `aref-${index}` } item xs={ 12 } className="pt-5 pb-5">
<AccessionRefCard index={ index } accessionRef={ accessionRef }/>
</Grid>
);
......@@ -86,39 +90,90 @@ class DetailInfo extends React.Component<IDetailInfoProps, any> {
actions={
this.state.authenticated &&
<ButtonBar>
<DownloadDialog
downloadUrl={ `${apiUrl}/api/v1/subset/${subset.uuid}/download` }
slug="download-authenticated"
postParams={ {mcpd: 'mcpd'} }
buttonTitle={ `${t('common:action.download')} ${t('subsets.public.p.display.MCPD')}` }
/>
<Authorize role="ROLE_ADMINISTRATOR">
<Button onClick={ this.onRematch } type="button">
{ t('subsets.public.c.subsetDisplay.rematch') }
</Button>
</Authorize>
<Authorize role="ROLE_ADMINISTRATOR">
<Button onClick={ this.onRematch } type="button">
{ t('subsets.public.c.subsetDisplay.rematch') }
</Button>
</Authorize>
</ButtonBar>
}
/>
<Grid container spacing={ 16 } className={ classes.accessionSection } justify={ 'space-between' }>
{ subset.creators &&
<PropertiesCard
propertyItemProps={ {numeric: false} }
title={ t('subsets.public.c.subsetDisplay.subsetCreators') }
propertiesList={
subset.creators.map((creator) => ({
title: t(`subsets.common.creators.role.${creator.role}`),
value: (<span><b>{ creator.fullName }</b>{ creator.institutionalAffiliation && <span> { creator.institutionalAffiliation }</span> }</span>),
}))
}
/>
}
{ userRoles.some((role) => role === 'ROLE_USER' || (subset.creators && subset.creators.length > 0)) &&
<Grid container spacing={ 0 } className={ classes.section }>
<Grid item xs={ 12 }>
<Section title={ t('subsets.public.c.subsetDisplay.subsetMetadata') }>
{ subset.creators && subset.creators.length > 0 &&
<div>
<div className="pt-15 pb-15 pl-20 pr-20">
<h4 className="font-bold m-0">{ t('subsets.public.c.subsetDisplay.subsetCreators') }</h4>
</div>
<Divider/>
<Grid container spacing={ 0 } className="p-20">
<Grid item xs={ 12 }>
<Properties>
{ subset.creators && subset.creators.map((creator) => (
<PropertiesItem title={ t(`subsets.common.creators.role.${creator.role}`) } key={ creator.id }>
<span>
<b>{ creator.fullName }</b>
{ creator.institutionalAffiliation && <span> { creator.institutionalAffiliation }</span> }
</span>
</PropertiesItem>
)) }
</Properties>
</Grid>
</Grid>
<Divider/>
</div>
}
<Authorize role="ROLE_USER">
<div>
<div className="pt-15 pb-15 pl-20 pr-20">
<h4 className="font-bold m-0">
{ t('subsets.public.c.subsetDisplay.dataAndResources') }
</h4>
</div>
<Divider/>
<Grid container spacing={ 0 } className="p-20">
<Grid item xs={ 12 }>
<Properties>
<PropertiesItem key={ subset.uuid } title={
<DownloadDialog
downloadUrl={ `${apiUrl}/api/v1/subset/${subset.uuid}/download` }
slug="download-authenticated"
postParams={ {mcpd: 'mcpd'} }
buttonTitle={ `${t('common:action.download')} ${t('subsets.public.p.display.MCPD')}` }
variant="contained"
btnClasses={ classes.buttonGreen }
/>
}>
<p>{ t(`subsets.public.c.subsetDisplay.mcpdPasportData`) }</p>
<p>{ `MCPD - ${subset.uuid}.xlsx` }</p>
</PropertiesItem>
</Properties>
</Grid>
</Grid>
</div>
</Authorize>
</Section>
</Grid>
</Grid>
}
<Grid container spacing={ 16 } className="mt-5" justify={ 'space-between' }>
{ ! accessions ? <Loading /> :
<PagedLoader
paged={ accessions }
loadMore={ loadAccessions }
roughItemHeight={ 80 }
itemRenderer={ renderAccession } />
<Grid item xs={ 12 } className="p-10">
{ accessions && accessions.content && accessions.content.length !== 0 &&
<SectionHeader
title={ t('subsets.public.c.subsetDisplay.accessions') }
subTitle={ t('subsets.public.c.subsetDisplay.listOfAccessions') }
/>
}
<PagedLoader
paged={ accessions }
loadMore={ loadAccessions }
roughItemHeight={ 80 }
itemRenderer={ renderAccession }
/>
</Grid>
}
</Grid>
</div>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment