Commit 3d8edb37 authored by Viacheslav Pavlov's avatar Viacheslav Pavlov Committed by Viacheslav Pavlov
Browse files

Page titles not set

Added missing titles
fixed stepper pages
now titles are set by specific entity title not by generic "page type"
contentHeaderWithButton now sets it's background color depending on it's type
fixed vocabulary public routes
PageTitle introduced, setPageTitle now used only by PageTitle component
parent deee86d3
......@@ -11,6 +11,7 @@ import ContentHeaderWithButton from 'ui/common/heading/ContentHeaderWithButton';
import ActionButton from 'ui/common/buttons/ActionButton';
import navigateTo from 'actions/navigation';
import {clearMyList} from 'list/actions/public';
import PageTitle from 'ui/common/PageTitle';
interface IMyListPageProps extends React.ClassAttributes<any> {
myList: any[];
......@@ -64,6 +65,7 @@ class MyListPage extends React.Component<IMyListPageProps> {
const {t} = this.props;
return (
<PageLayout>
<PageTitle title={ t('list.public.p.browse.title') }/>
<ContentHeader
title={ t('list.public.p.browse.title') }
subTitle={ t('list.public.p.browse.subTitle') }
......@@ -72,6 +74,7 @@ class MyListPage extends React.Component<IMyListPageProps> {
? (
<div>
<ContentHeaderWithButton
isSecondary
title={ `${accessions.length} ${ t('accessions.common.modelName', {count: accessions.length})}` }
buttons={
<div>
......@@ -87,7 +90,7 @@ class MyListPage extends React.Component<IMyListPageProps> {
</PageContents>
</div>
) : (
<ContentHeaderWithButton title={ t('list.public.p.browse.noAccessions') }/>
<ContentHeaderWithButton title={ t('list.public.p.browse.noAccessions') } isSecondary/>
)
}
</PageLayout>
......
......@@ -58,7 +58,8 @@
"display": {
"email": "Contact email",
"metadata": "Record metadata",
"urls": "Websites"
"urls": "Websites",
"title": "Data provider details"
}
}
}
......
......@@ -22,6 +22,7 @@ import ContentHeader from 'ui/common/heading/ContentHeader';
import BrowsePageTemplate from 'ui/pages/_base/BrowsePage';
import ActionButton from 'ui/common/buttons/ActionButton';
import ButtonBar from 'ui/common/buttons/ButtonBar';
import PageTitle from 'ui/common/PageTitle';
class PartnerListPage extends BrowsePageTemplate<Partner> {
......@@ -39,6 +40,7 @@ class PartnerListPage extends BrowsePageTemplate<Partner> {
<PartnerFilters initialValues={ paged && paged.filter || {} } onSubmit={ this.myApplyFilters } t={ t }/>
}>
<ScrollToTopOnMount/>
<PageTitle title={ t('partners.public.p.browse.title') }/>
<ContentHeader title={ t('partners.public.p.browse.title') } subtitle={ t('partners.public.p.browse.subtitle') }/>
<PaginationComponent
pageObj={ paged }
......
......@@ -23,6 +23,8 @@ import Button from '@material-ui/core/Button';
import Permissions from 'ui/common/permission/Permissions';
import PageLayout from 'ui/layout/PageLayout';
import { InstituteLink, CountryLink } from 'ui/genesys/Links';
import ContentHeader from 'ui/common/heading/ContentHeader';
import PageTitle from 'ui/common/PageTitle';
interface IPartnerPageProps extends React.ClassAttributes<any> {
classes: any;
......@@ -100,69 +102,68 @@ class PartnerPage extends React.Component<IPartnerPageProps, any> {
return (
<PageLayout>
{ stillLoading ? <Loading/> :
<Grid container spacing={ 0 } className="back-gray p-20">
<Grid item xs={ 12 }>
<Card square>
<CardHeader title={ (
<span>
{ partner.name }
{ partner.shortName && <small> #{ partner.shortName } </small> }
</span>
) }/>
<CardContent>
{ partner.description && <Markdown className="mb-20" source={ partner.description }/> }
<Properties>
{ partner.urls.length > 0 && (
<PropertiesItem title={ t('partners.public.p.display.urls') }>
{ partner.urls.map((url) => (
<div key={ url }><ExternalLink link={ url }>{ url }</ExternalLink></div>
)) }
</PropertiesItem>
) }
{ partnerInstitutes && partnerInstitutes.content && partnerInstitutes.content.length > 0 && (
<PropertiesItem title={ t('partners.common.wiewsCodes') }>
{ partnerInstitutes.content.sort((a, b) => a.code.localeCompare(b.code)).map((institute) => (
<div key={ institute.code }>
<InstituteLink to={ institute }><b>{ institute.code }</b> { institute.fullName }</InstituteLink>
{ ` ` }
<small><FaoWiewsLink wiewsCode={ institute.code }>({ t('View on FAO WIEWS website') })</FaoWiewsLink></small>
</div>
)) }
</PropertiesItem>
) }
{ partner.countryCodes.length > 0 && (
<PropertiesItem title={ t('partners.common.countries') }>
{ partner.countryCodes.sort().map((countryCode) => (
<div key={ countryCode }><CountryLink country={ countryCode } /></div>
)) }
</PropertiesItem>
) }
{ partner.email && (
<PropertiesItem title={ t('user.common.email') }>
<div><a href={ `mailto:${partner.email}` }>{ partner.email }</a></div>
</PropertiesItem>
) }
{ partner.phone && (
<PropertiesItem title={ t('user.common.phone') }>{ partner.phone }</PropertiesItem>
) }
{ partner.address && (
<PropertiesItem title={ t('geo.common.address') }>{ partner.address }</PropertiesItem>
) }
<PropertiesItem title={ t('partners.public.p.display.metadata') }><code>{ partner.uuid }, v{ partner.version }</code></PropertiesItem>
</Properties>
</CardContent>
{ (partner._permissions.write || partner._permissions.delete) && (
<CardActions>
{ partner._permissions.write && <Button onClick={ this.onEditPartner } type="button">{ t('common:action.edit') }</Button> }
{ partner._permissions.delete && <Button onClick={ this.onDelete } type="button">{ t('common:action.delete') }</Button> }
{ partner._permissions.manage && <Permissions clazz={ Partner.clazz } id={ partner.id }/> }
</CardActions>
) }
</Card>
<div>
<PageTitle title={ !stillLoading ? `${partner.name}#${partner.shortName}` : t('common:label.loading', { what: t(`'partners.public.p.display.title'`) }) }/>
<ContentHeader title={ !stillLoading ? `${partner.name}#${partner.shortName}` : t('common:label.loading', { what: t(`'partners.public.p.display.title'`) }) }/>
<Grid container spacing={ 0 } className="back-gray p-20">
<Grid item xs={ 12 }>
<Card square>
<CardHeader title={ t('partners.public.p.display.title') }/>
<CardContent>
{ partner.description && <Markdown className="mb-20" source={ partner.description }/> }
<Properties>
{ partner.urls.length > 0 && (
<PropertiesItem title={ t('partners.public.p.display.urls') }>
{ partner.urls.map((url) => (
<div key={ url }><ExternalLink link={ url }>{ url }</ExternalLink></div>
)) }
</PropertiesItem>
) }
{ partnerInstitutes && partnerInstitutes.content && partnerInstitutes.content.length > 0 && (
<PropertiesItem title={ t('partners.common.wiewsCodes') }>
{ partnerInstitutes.content.sort((a, b) => a.code.localeCompare(b.code)).map((institute) => (
<div key={ institute.code }>
<InstituteLink to={ institute }><b>{ institute.code }</b> { institute.fullName }</InstituteLink>
{ ` ` }
<small><FaoWiewsLink wiewsCode={ institute.code }>({ t('View on FAO WIEWS website') })</FaoWiewsLink></small>
</div>
)) }
</PropertiesItem>
) }
{ partner.countryCodes.length > 0 && (
<PropertiesItem title={ t('partners.common.countries') }>
{ partner.countryCodes.sort().map((countryCode) => (
<div key={ countryCode }><CountryLink country={ countryCode } /></div>
)) }
</PropertiesItem>
) }
{ partner.email && (
<PropertiesItem title={ t('user.common.email') }>
<div><a href={ `mailto:${partner.email}` }>{ partner.email }</a></div>
</PropertiesItem>
) }
{ partner.phone && (
<PropertiesItem title={ t('user.common.phone') }>{ partner.phone }</PropertiesItem>
) }
{ partner.address && (
<PropertiesItem title={ t('geo.common.address') }>{ partner.address }</PropertiesItem>
) }
<PropertiesItem title={ t('partners.public.p.display.metadata') }><code>{ partner.uuid }, v{ partner.version }</code></PropertiesItem>
</Properties>
</CardContent>
{ (partner._permissions.write || partner._permissions.delete) && (
<CardActions>
{ partner._permissions.write && <Button onClick={ this.onEditPartner } type="button">{ t('common:action.edit') }</Button> }
{ partner._permissions.delete && <Button onClick={ this.onDelete } type="button">{ t('common:action.delete') }</Button> }
{ partner._permissions.manage && <Permissions clazz={ Partner.clazz } id={ partner.id }/> }
</CardActions>
) }
</Card>
</Grid>
</Grid>
</Grid>
</div>
}
</PageLayout>
);
......
......@@ -14,6 +14,7 @@ import PartnerForm from './c/PartnerForm';
import Grid from '@material-ui/core/Grid';
import Paper from '@material-ui/core/Paper';
import Loading from 'ui/common/Loading';
import PageTitle from 'ui/common/PageTitle';
interface IPartnerEditPageProps extends React.ClassAttributes<any> {
classes: any;
......@@ -84,6 +85,7 @@ class PartnerEditPage extends React.Component<IPartnerEditPageProps, any> {
const institutes = partnerInstitutes && partnerInstitutes.content || [];
return (
<Grid item xs={ 12 }>
<PageTitle title={ !partner.uuid ? `${partner.name}#${partner.shortName}` : t('common:action.create', { what: t(`partners.public.p.display.title`) }) }/>
<Paper className="p-20">
{ partner ?
<PartnerForm
......
import * as React from 'react';
import { PARTNER_FORM } from 'partners/constants';
import { connect } from 'react-redux';
import { setPageTitle } from 'actions/pageTitle';
import { bindActionCreators } from 'redux';
import { log } from 'utilities/debug';
import Validators from 'utilities/Validators';
......@@ -30,8 +27,6 @@ class PartnerForm extends React.Component<any, void> {
public constructor(props: any) {
super(props);
const { setPageTitle, initialValues, t } = this.props;
setPageTitle(initialValues.name || t('partners.admin.c.form.new'));
}
private onInstituteDelete = (item) => {
......@@ -126,9 +121,7 @@ class PartnerForm extends React.Component<any, void> {
}
}
export default connect(null, (dispatch) => bindActionCreators({
setPageTitle,
}, dispatch))(reduxForm({
export default reduxForm({
form: PARTNER_FORM,
enableReinitialize: true,
})(PartnerForm));
})(PartnerForm);
......@@ -7,14 +7,16 @@
"imageGallery": {
"toFolder": "To folder",
"deleteGallery": "Delete gallery",
"deleteGalleryAlert": "Gallery at {{folderPath, string}} could not be deleted."
"deleteGalleryAlert": "Gallery at {{folderPath, string}} could not be deleted.",
"title": "Image gallery details"
},
"repositoryBrowser": {
"viewGallery": "View gallery",
"createGallery": "Create gallery",
"createGalleryAlert": "Image gallery at {{folderPath, string}} could not be created.",
"deleteFolder": "Delete folder",
"deleteFolderAlert": "Folder {{folderPath, string}} could not be deleted."
"deleteFolderAlert": "Folder {{folderPath, string}} could not be deleted.",
"title": "File repository"
}
},
"dialog": {
......
......@@ -14,6 +14,7 @@ import {PageContents} from 'ui/layout/PageLayout';
import FileForm from './c/FileForm';
import {getFile, updateFile} from 'repository/actions/admin';
import RepositoryFile from 'model/repository/RepositoryFile';
import PageTitle from 'ui/common/PageTitle';
interface IEditPageProps extends React.ClassAttributes<any> {
t: any;
......@@ -58,6 +59,7 @@ class EditFilePage extends React.Component<IEditPageProps, any> {
return file === null ? (<Loading/>) : (
<div>
<PageTitle title={ t(`repository.admin.p.editFile.formTitle`) }/>
<ContentHeaderWithButton title={ t(`repository.admin.p.editFile.formTitle`) } />
<PageContents className="pt-1rem">
<Card>
......
......@@ -14,6 +14,7 @@ import Loading from 'ui/common/Loading';
import { PageContents } from 'ui/layout/PageLayout';
import ContentHeaderWithButton from 'ui/common/heading/ContentHeaderWithButton';
import Permissions from 'ui/common/permission/Permissions';
import PageTitle from 'ui/common/PageTitle';
import Button from '@material-ui/core/Button';
import { navigateTo } from 'actions/navigation';
......@@ -47,6 +48,10 @@ class ImageGalleryPage extends React.Component<IRepositoryBrowserProps, any> {
({ root, path }) => getGallery(normalize(root + path).replace(/^(.+)\/$/, '$1')),
];
public constructor(props: any) {
super(props);
}
public componentWillMount() {
const { folderPath, gallery, getGallery } = this.props;
// console.log(`RepositoryBrowser.componentWillMount...`, folderPath);
......@@ -106,7 +111,8 @@ class ImageGalleryPage extends React.Component<IRepositoryBrowserProps, any> {
return (
stillLoading ? <Loading /> : (
<div>
<ContentHeaderWithButton title={ <FolderCrumbs disabled root={ root } path={ path } /> } buttons={
<PageTitle title={ t('repository.admin.p.imageGallery.title') }/>
<ContentHeaderWithButton isSecondary title={ <FolderCrumbs disabled root={ root } path={ path } /> } buttons={
<span>
<Button key="viewf" variant="contained" onClick={ this.goToFolder }>{ t('repository.admin.p.imageGallery.toFolder') }</Button>
{ gallery && gallery._permissions.delete && <Button onClick={ this.deleteGallery } key="deletef">{ t('repository.admin.p.imageGallery.deleteGallery') }</Button> }
......
......@@ -27,6 +27,7 @@ import FileUploader from 'ui/common/file-uploader';
import CreateFolderDialog from './CreateFolderDialog';
import UpdateFolderDialog from './UpdateFolderDialog';
import PagedLoader from 'ui/common/PagedLoader';
import PageTitle from 'ui/common/PageTitle';
import RepositoryFile from 'model/repository/RepositoryFile';
import Page from 'model/Page';
......@@ -150,7 +151,8 @@ class RepositoryBrowser extends React.Component<IRepositoryBrowserProps, any> {
return (
stillLoading ? <Loading /> : (
<div>
<ContentHeaderWithButton title={ <FolderCrumbs root={ root } path={ path } /> } buttons={
<PageTitle title={ t('repository.admin.p.repositoryBrowser.title') }/>
<ContentHeaderWithButton isSecondary title={ <FolderCrumbs root={ root } path={ path } /> } buttons={
<span>
{ ! folder.folder ? null :
folder.gallery ? <Button key="viewg" variant="contained" onClick={ this.goToGallery }>{ t('repository.admin.p.repositoryBrowser.viewGallery') }</Button> :
......
......@@ -30,7 +30,7 @@
},
"p": {
"browse": {
"title": "{{totalElements, number}} requests for PGR material"
"title": "Requests for PGR material"
},
"display": {
"title": "Request from {{email, string}}",
......
import * as React from 'react';
import {translate} from 'react-i18next';
import {connect} from 'react-redux';
import {bindActionCreators} from 'redux';
// actions
import {navigateTo} from 'actions/navigation';
import {setPageTitle} from 'actions/pageTitle';
import {clearMyList} from 'list/actions/public';
import {initiateRequest} from 'requests/actions/public';
......@@ -85,8 +85,7 @@ const mapDispatchToProps = (dispatch) => bindActionCreators({
initiateRequest,
clearMyList,
navigateTo,
setPageTitle,
}, dispatch);
export default connect(mapStateToProps, mapDispatchToProps)(StepperPage);
export default translate()(connect(mapStateToProps, mapDispatchToProps)(StepperPage));
......@@ -20,6 +20,7 @@ import ContentLayout from 'ui/layout/ContentLayout';
import MaterialRequestFilter from 'requests/ui/admin/c/MaterialRequestFilter';
import Grid from '@material-ui/core/Grid';
import PaginationComponent from 'ui/common/pagination';
import PageTitle from 'ui/common/PageTitle';
class BrowsePage extends BrowsePageTemplate<any> {
......@@ -31,7 +32,7 @@ class BrowsePage extends BrowsePageTemplate<any> {
}
public render() {
const { paged, loadMoreData} = this.props;
const { paged, loadMoreData, t} = this.props;
const renderRequest = (r: MaterialRequest, index: number) => {
return <RequestCard key={ r.uuid } index={ index } request={ r } />;
......@@ -41,6 +42,7 @@ class BrowsePage extends BrowsePageTemplate<any> {
<ContentLayout left={
<MaterialRequestFilter initialValues={ paged && paged.filter || {} } onSubmit={ this.myApplyFilters }/>
} customHeaderHeight>
<PageTitle title={ t('requests.admin.p.browse.title') }/>
<Grid container spacing={ 0 }>
<Grid item xs={ 12 }>
<PaginationComponent
......
......@@ -18,6 +18,7 @@ import PrettyDate from 'ui/common/time/PrettyDate';
import ActionButton from 'ui/common/buttons/ActionButton';
import BackButton from 'ui/common/buttons/BackButton';
import Markdown from 'ui/common/markdown';
import PageTitle from 'ui/common/PageTitle';
interface IDisplayPageProps extends React.ClassAttributes<any> {
t: any;
......@@ -54,6 +55,7 @@ class DisplayPage extends React.Component<IDisplayPageProps, any> {
return request === null ? (<Loading/>) : (
<div>
<PageTitle title={ t('requests.admin.p.display.title', {email: request.email}) }/>
<ContentHeaderWithButton
title={ t('requests.admin.p.display.title', {email: request.email}) }
buttons={
......
......@@ -22,6 +22,7 @@ const countAvailable = (accessions: Accession[]) => {
const AccessionsList = ({accessions, classes, t}) => (
<div>
<ContentHeaderWithButton
isSecondary
title={ t('requests.public.p.stepper.accessionsList.title', {count: accessions.length, available: countAvailable(accessions)}) }
/>
{ accessions.map((accession, index) => (
......
......@@ -57,7 +57,7 @@ const dashboardRoutes = [
auth: [ROLE_USER, ROLE_ADMINISTRATOR],
exact: true,
extraProps: {
title: 'Subsets',
title: 'subsets.dashboard.p.stepper.publisher',
},
},
{
......@@ -67,7 +67,7 @@ const dashboardRoutes = [
}),
auth: [ROLE_USER, ROLE_ADMINISTRATOR],
extraProps: {
title: 'Subset create',
title: 'subsets.dashboard.p.stepper.publisher',
},
routes: [
...steps,
......
......@@ -63,8 +63,12 @@
"createSubsets": "Create subset"
},
"p": {
"browse": {
"title": "Subsets dashboard"
},
"stepper": {
"stepperTitle": "Steps for subset data publication completion",
"publisher": "Subset data publisher",
"accessionList": {
"stepName": "List of accessions",
"instructions": "INSTRUCTIONS FOR USE",
......
......@@ -19,6 +19,7 @@ import PrettyFilters from 'ui/common/filter/PrettyFilters';
import PaginationComponent from 'ui/common/pagination';
import SubsetCard from 'subsets/ui/c/SubsetCard';
import SubsetFilters from './c/Filters';
import PageTitle from 'ui/common/PageTitle';
class BrowsePage extends BrowsePageTemplate<Subset> {
......@@ -38,6 +39,7 @@ class BrowsePage extends BrowsePageTemplate<Subset> {
<SubsetFilters initialValues={ paged && paged.filter || {} } onSubmit={ this.myApplyFilters } t={ t } />
}>
<PageTitle title={ t('subsets.public.p.browse.title') }/>
<ContentHeader title={ t('subsets.public.p.browse.title') } subTitle={ t('subsets.public.p.browse.subTitle') } />
<PaginationComponent
......
......@@ -14,6 +14,7 @@ import PageLayout, { PageContents } from 'ui/layout/PageLayout';
import Loading from 'ui/common/Loading';
import ContentHeaderWithButton from 'ui/common/heading/ContentHeaderWithButton';
import ActionButton from 'ui/common/buttons/ActionButton';
import PageTitle from 'ui/common/PageTitle';
import SubsetDisplay from './c/SubsetDisplay';
import {AccessionRef} from 'model/accession/AccessionRef';
import Page from 'model/Page';
......@@ -75,7 +76,11 @@ class DisplayPage extends React.Component<IDisplayPageProps, any> {
return (
<PageLayout>
<ContentHeaderWithButton title={ t('subsets.public.p.display.title', {subsetTitle: subset && subset.title}) } buttons={ isActionsActive ? <ActionButton action={ this.onUnpublish } title={ t('common:action.reject') }/> : '' } />
<PageTitle title={ !stillLoading ? subset.title : t('common:label.loading', { what: t('subsets.public.p.display.title') }) }/>
<ContentHeaderWithButton
title={ !stillLoading ? subset.title : t('common:label.loading', { what: t('subsets.public.p.display.title') }) }
buttons={ isActionsActive ? <ActionButton action={ this.onUnpublish } title={ t('common:action.reject') }/> : '' }
/>
<PageContents className="pt-1rem">
{ stillLoading ? <Loading /> :
......
......@@ -64,7 +64,7 @@ const SubsetCard = (
</Card>
) : (
<Card>
<CardHeader title={ <SubsetLink to={ subset }/> }/>
<CardHeader title={ !complete ? <SubsetLink to={ subset }/> : t('subsets.public.p.display.title') }/>
<CardContent>
<Markdown className="mb-20" firstParagraph={ !complete } source={ subset.description }/>
<Properties>
......
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