Commit a6283b18 authored by Matija Obreza's avatar Matija Obreza

WIP

parent f3e5a2a4
......@@ -5,6 +5,12 @@ class ApiCall<T> {
public data: T;
public progress?: number;
public static data = (dataCall: ApiCall<any>) => {
return dataCall ? dataCall.data : null;
}
public static loading = (dataCall: ApiCall<any>) => {
return dataCall ? dataCall.loading : false;
}
public static start = () => ({
loading: true,
......
......@@ -17,7 +17,8 @@ import Table, { TextAlign } from '@gringlobal/client/ui/common/table/Table';
import { PrintSpecies } from 'common/Taxonomy';
import { TableConfiguration } from '@gringlobal/client/ui/common/table/TableConfiguration';
import { InventoryTableDefaultConfig } from 'inventory/ui/InventoryBrowsePage';
import withDetailsPageBase, { WithDetailsPageBase } from 'ui/common/withDetailsPageBase';
import DetailsPageBase from 'ui/common/withDetailsPageBase';
import { ApiCall } from '@gringlobal/client/model/common';
const InventoryTableConfig = new TableConfiguration(TableConfiguration.merge(
......@@ -44,13 +45,12 @@ const InventoryTableConfig = new TableConfiguration(TableConfiguration.merge(
},
));
interface IDetailsPageProps extends React.ClassAttributes<any>, WithTranslation, WithDetailsPageBase {
data: Accession;
loading: boolean;
interface IDetailsPageProps extends React.ClassAttributes<any>, WithTranslation {
getAccessionInventories: (id: number) => void;
inventories: FilteredPage<Inventory>;
}
class AccessionDetailsPage extends React.Component<IDetailsPageProps> {
class AccessionDetailsPage extends DetailsPageBase<Accession, IDetailsPageProps> {
protected static needs = [
({ params: { id } }) => getAccessionAction(id),
......@@ -61,8 +61,14 @@ class AccessionDetailsPage extends React.Component<IDetailsPageProps> {
super(props);
}
public render(): React.ReactNode {
const { inventories, data: accession, loading, t } = this.props;
protected getExtraData(id: number) {
this.props.getAccessionInventories(id);
}
public render() {
const { inventories, dataCall, t } = this.props;
const loading = ApiCall.loading(dataCall);
const accession = ApiCall.data(dataCall);
const columns = InventoryTableConfig.getColumns(inventories && inventories.content ? inventories.content[0] : null);
return (
......@@ -235,17 +241,17 @@ class AccessionDetailsPage extends React.Component<IDetailsPageProps> {
const mapStateToProps = (state, ownProps) => ({
id: ownProps.match.params.id,
loadableData: state.accession.public.accession,
dataCall: state.accession.public.accession,
inventories: state.accession.public.inventories ? state.accession.public.inventories.data : undefined,
});
const mapDispatchToProps = (dispatch) => bindActionCreators({
getItemAction: getAccessionAction,
onDetailsCallback: getAccessionInventories,
loadDataAction: getAccessionAction,
getAccessionInventories,
}, dispatch);
export default compose(
connect(mapStateToProps, mapDispatchToProps),
withTranslation(),
)(withDetailsPageBase(AccessionDetailsPage));
)(AccessionDetailsPage);
......@@ -12,23 +12,27 @@ import ContentHeader from '@gringlobal/client/ui/common/heading/ContentHeader';
import { Card, CardContent, CardHeader } from '@material-ui/core';
import { Properties, PropertiesItem } from '@gringlobal/client/ui/common/Properties';
import Loading from '@gringlobal/client/ui/common/Loading';
import withDetailsPageBase, { WithDetailsPageBase } from 'ui/common/withDetailsPageBase';
import DetailsPageBase from 'ui/common/withDetailsPageBase';
import { ApiCall } from '@gringlobal/client/model/common';
interface ICooperatorDetailsPage extends React.ClassAttributes<any>, WithTranslation, WithDetailsPageBase {
data: Cooperator;
loading: boolean;
interface ICooperatorDetailsPage extends React.ClassAttributes<any>, WithTranslation {
}
class CooperatorDetailsPage extends React.Component<ICooperatorDetailsPage> {
class CooperatorDetailsPage extends DetailsPageBase<Cooperator, ICooperatorDetailsPage> {
protected static needs = [
({ params: { id } }) => getCooperatorAction(id),
];
public render() {
const { data: cooperator, loading, t } = this.props;
protected getExtraData(id: number) {
// nothing yet
}
public render() {
const { dataCall, t } = this.props;
const loading = ApiCall.loading(dataCall);
const cooperator = ApiCall.data(dataCall);
return (
<>
<ContentHeader title={ t('cooperator.public.p.details.title') }/>
......@@ -128,16 +132,16 @@ class CooperatorDetailsPage extends React.Component<ICooperatorDetailsPage> {
}
const mapStateToProps = (state, ownProps) => ({
loadableData: state.cooperator.public.cooperator,
dataCall: state.cooperator.public.cooperator,
id: ownProps.match.params.id,
});
const mapDispatchToProps = (dispatch) => bindActionCreators({
getItemAction: getCooperatorAction,
loadDataAction: getCooperatorAction,
}, dispatch);
export default compose<ICooperatorDetailsPage>(
withTranslation(),
connect(mapStateToProps, mapDispatchToProps),
)(withDetailsPageBase(CooperatorDetailsPage));
)(CooperatorDetailsPage);
......@@ -3,48 +3,33 @@ import { ApiCall } from '@gringlobal/client/model/common';
// import { FilteredPage } from '@gringlobal/client/model/page';
export interface WithDetailsPageBase {
getItemAction: (id: string | number) => any;
loadableData: ApiCall<any>;
onDetailsCallback?: (id: string | number) => any;
id: string;
export interface WithDetailsPageBase<T> {
id: number;
loadDataAction: (id: number) => any;
dataCall: ApiCall<T | any>;
}
const withDetailsPageBase = <T extends React.ComponentType<T>>(Component: React.ComponentType<T> & any) =>
class DetailsPageBase extends React.Component<T & WithDetailsPageBase> {
protected static needs = Component.needs ? [...Component.needs] : null;
abstract class DetailsPageBase<T, X> extends React.Component<X & WithDetailsPageBase<T>> {
public componentDidMount() {
const { id, loadableData, getItemAction, onDetailsCallback } = this.props;
protected abstract getExtraData(id: number);
if (!loadableData || !loadableData.data || loadableData.data.id !== +id) {
getItemAction(id);
if (onDetailsCallback) {
onDetailsCallback(id);
}
}
}
public componentDidMount() {
const { id, dataCall, loadDataAction } = this.props;
public componentDidUpdate() {
const { loadableData, id, getItemAction, onDetailsCallback } = this.props;
if (!loadableData || !loadableData.loading && (!loadableData.error && id && +id !== loadableData.data.id)) {
getItemAction(id);
if (onDetailsCallback) {
onDetailsCallback(id);
}
}
if (!dataCall || !dataCall.data || dataCall.data.id !== +id) {
loadDataAction(id);
this.getExtraData(id);
}
}
public render() {
const { loadableData } = this.props;
return (
<Component
{...this.props}
loading={ loadableData && loadableData.loading }
data={ loadableData && loadableData.data ? loadableData.data : null }
/>
);
public componentDidUpdate() {
const { dataCall, id, loadDataAction } = this.props;
if (!dataCall || !dataCall.loading && (!dataCall.error && id && +id !== dataCall.data.id)) {
loadDataAction(id);
this.getExtraData(id);
}
};
}
}
export default withDetailsPageBase;
export default DetailsPageBase;
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