Commit 083460e9 authored by Matija Obreza's avatar Matija Obreza
Browse files

Config: renamed to appConfig, updated configuration property names

- added WithConfig
- updated merging of configuration options
parent 87406384
import { Config } from 'config/config';
import {
showGenesysUI,
// showOverview, // for testing
......@@ -5,13 +6,16 @@ import {
const queryLang = document.location.search && document.location.search.substr(1) || undefined;
const config = {
const genesysConfig: Config = {
apiUrl: 'http://localhost:8080',
clientId: 'defaultclient@localhost',
clientKey: 'changeme',
apiUrl: 'http://localhost:8080',
filter: { institute: { code: [ 'COL003', 'BEL084', 'ETH013' ] } },
language: { locale: queryLang, enableSwitch: true },
language: queryLang,
shoppingCart: {
enabled: true,
},
};
showGenesysUI(document.getElementById('genesys'), config);
// showOverview(document.getElementById('genesys'), config);
showGenesysUI(document.getElementById('genesys'), genesysConfig);
// showOverview(document.getElementById('genesys'), genesysConfig);
......@@ -6,6 +6,7 @@ import { Property } from 'ui/common/Property';
import AccessionDetails from '@genesys/client/model/accession/AccessionDetails';
import { WithTranslation, withTranslation } from 'react-i18next';
import { LocalStorageCart } from 'utilities';
import { WithConfig } from 'config/config';
interface IAccessionDetailsPageState {
accession: AccessionDetails;
......@@ -14,10 +15,9 @@ interface IAccessionDetailsPageState {
interface IAccessionDetailsPage {
match: any;
apiUrl: string;
}
class AccessionDetailsPage extends React.Component<IAccessionDetailsPage & WithTranslation, IAccessionDetailsPageState> {
class AccessionDetailsPage extends React.Component<IAccessionDetailsPage & WithTranslation & WithConfig, IAccessionDetailsPageState> {
public constructor(props) {
super(props);
}
......@@ -92,7 +92,7 @@ class AccessionDetailsPage extends React.Component<IAccessionDetailsPage & WithT
public render() {
const { accession, cartItems } = this.state;
const { apiUrl, t } = this.props;
const { t, appConfig: { apiUrl, shoppingCart } } = this.props;
let propertyIndex = 0;
......@@ -201,21 +201,23 @@ class AccessionDetailsPage extends React.Component<IAccessionDetailsPage & WithT
)) }
</>
}
<div className="pt-4">
{cartItems.includes(this.props.match.params.uuid) ?
<button
type="button"
name={ `button-remove-${accession.details.uuid}` }
data-uuid={ accession.details.uuid }
className="btn btn-primary"
onClick={ this.removeFromCart }
>
{ t('cart.removeFromCart') }
</button>
:
this.renderAddToCart()
}
</div>
{ shoppingCart.enabled &&
<div className="pt-4">
{ cartItems.includes(this.props.match.params.uuid) ?
<button
type="button"
name={ `button-remove-${accession.details.uuid}` }
data-uuid={ accession.details.uuid }
className="btn btn-primary"
onClick={ this.removeFromCart }
>
{ t('cart.removeFromCart') }
</button>
:
this.renderAddToCart()
}
</div>
}
</>
);
}
......@@ -223,7 +225,7 @@ class AccessionDetailsPage extends React.Component<IAccessionDetailsPage & WithT
}
const mapStateToProps = (state) => ({
apiUrl: state.appConfig.config.apiUrl,
appConfig: state.appConfig.config,
});
export default connect(mapStateToProps)(withTranslation()(AccessionDetailsPage));
......@@ -11,6 +11,7 @@ import Pagination from 'ui/common/Pagination';
import { AccessionFilters } from './AccessionFilters';
import { withTranslation, WithTranslation } from 'react-i18next';
import { LocalStorageCart } from 'utilities';
import { WithConfig } from 'config/config';
interface IAccessionListPageState {
filter: AccessionFilter;
......@@ -21,17 +22,15 @@ interface IAccessionListPageState {
}
interface IAccessionListPageProps {
filter: AccessionFilter;
location: any;
cartEnabled: boolean;
}
class AccessionListPage extends React.Component<IAccessionListPageProps & WithTranslation, IAccessionListPageState> {
class AccessionListPage extends React.Component<IAccessionListPageProps & WithTranslation & WithConfig, IAccessionListPageState> {
public constructor(props) {
super(props);
this.state = {
filter: this.props.filter,
filter: this.props.appConfig.filter,
accessions: null,
selected: [],
isAllSelected: false,
......@@ -70,7 +69,7 @@ class AccessionListPage extends React.Component<IAccessionListPageProps & WithTr
if (prevPage !== undefined && currentPage === 0 && prevFilterCode !== undefined && filterCode === undefined) {
// console.log('did update, reset filter);
this.loadData(this.props.filter, {});
this.loadData(this.props.appConfig.filter, {});
}
}
......@@ -165,7 +164,7 @@ class AccessionListPage extends React.Component<IAccessionListPageProps & WithTr
public render() {
const { accessions, selected, isAllSelected } = this.state;
const { t, cartEnabled } = this.props;
const { t, appConfig: { shoppingCart } } = this.props;
const selectedUUIDs = new Set();
selected.forEach((uuid) => selectedUUIDs.add(uuid));
......@@ -189,7 +188,7 @@ class AccessionListPage extends React.Component<IAccessionListPageProps & WithTr
<table className="table table-striped">
<thead className="thead-dark">
<tr>
{ cartEnabled && (
{ shoppingCart.enabled && (
<th>
<input
type="checkbox"
......@@ -206,13 +205,13 @@ class AccessionListPage extends React.Component<IAccessionListPageProps & WithTr
<th>{ t('accession.taxonomy') }</th>
<th>{ t('accession.countryOfOrigin') }</th>
<th>{ t('accession.sampStat') }</th>
{ cartEnabled && ( <th>{ t('list.availability') }</th> ) }
{ shoppingCart.enabled && ( <th>{ t('list.availability') }</th> ) }
</tr>
</thead>
<tbody>
{ accessions.content.map((a, i) => (
<tr key={ a.id } className={ selectedUUIDs.has(a.uuid) ? 'table-primary' : '' }>
{ cartEnabled && (
{ shoppingCart.enabled && (
<td>
{ this.canAddToCart(a) &&
<input
......@@ -232,7 +231,7 @@ class AccessionListPage extends React.Component<IAccessionListPageProps & WithTr
<td><span dangerouslySetInnerHTML={ { __html: a.taxonomy.taxonNameHtml } } /></td>
<td>{ a.countryOfOrigin && a.countryOfOrigin.name }</td>
<td>{ a.sampStat && t(`accession.sampleStatus.${a.sampStat}`) }</td>
{ cartEnabled &&
{ shoppingCart.enabled &&
<td>
{ this.renderCartButton(a, i) }
</td>
......@@ -249,8 +248,7 @@ class AccessionListPage extends React.Component<IAccessionListPageProps & WithTr
}
const mapStateToProps = (state) => ({
filter: state.appConfig.config.filter,
cartEnabled: state.appConfig.config.request.enabled,
appConfig: state.appConfig.config,
});
export default connect(mapStateToProps)(withTranslation()(AccessionListPage));
export interface WithConfig {
appConfig: Config;
}
export class Config {
public apiUrl?: string;
public clientId: string;
......@@ -5,20 +9,21 @@ export class Config {
public filter?: Record<string, any>;
// module config
public language?: Partial<LanguageConfig>;
public language?: string = 'en';
public accession?: BaseFeatureConfig;
public request?: BaseFeatureConfig;
public shoppingCart?: BaseFeatureConfig;
public constructor(config: Config) {
this.apiUrl = config.apiUrl || defaultConfig.apiUrl;
this.clientId = config.clientId;
this.clientKey = config.clientKey;
this.language = config.language || defaultConfig.language;
this.filter = config.filter || defaultConfig.filter;
// features
this.accession = config.accession || defaultConfig.accession;
this.request = config.request || defaultConfig.request;
this.language = config.language || defaultConfig.language;
// Merge feature config
this.accession = { ...defaultConfig.accession, ...config.accession };
this.shoppingCart = { ...defaultConfig.shoppingCart, ...config.shoppingCart };
// console.log('Source and merged configuration', config, this);
}
}
......@@ -26,17 +31,10 @@ export class BaseFeatureConfig {
public enabled: boolean;
}
class LanguageConfig {
public locale: string;
public enableSwitch: boolean;
}
export const defaultConfig = {
export const defaultConfig: Partial<Config> = {
apiUrl: 'https://api.sandbox.genesys-pgr.org',
clientId: 'clientid@genesys',
clientKey: 'changeme',
filter: {},
language: { locale: 'en', enableSwitch: true },
language: 'en',
accession: { enabled: true },
request: { enabled: true },
shoppingCart: { enabled: false },
};
......@@ -4,7 +4,7 @@ import { RECEIVE_APP_CONFIG } from 'core/constants/appConfig';
import { Config } from 'config/config';
const INITIAL_STATE: {
config: Partial<Config>,
config: Config,
} = {
config: null,
};
......
......@@ -55,7 +55,7 @@ export function showGenesysUI(holdingNode: HTMLElement, config: Config) {
const { apiUrl, clientId, clientKey, language } = config;
reconfigureServiceAxios({ apiUrl });
initI18n(language.locale);
initI18n(language);
store.dispatch(setConfig(config));
checkAccessTokens(apiUrl, clientId, clientKey).then( (result) => {
......@@ -80,14 +80,14 @@ export function showOverview(holdingNode: HTMLElement, config: Config) {
const { apiUrl, clientId, clientKey, language } = config;
reconfigureServiceAxios({ apiUrl });
initI18n(language.locale);
initI18n(language);
store.dispatch(setConfig(config));
checkAccessTokens(apiUrl, clientId, clientKey).then( (result) => {
ReactDOM.render(
<Provider store={ store }>
<OverviewPage/>
<OverviewPage />
</Provider>,
holdingNode,
);
......
......@@ -9,27 +9,25 @@ import { createHashHistory } from 'history';
import { bindActionCreators } from 'redux';
import { getCountryCodes } from 'core/actions/decoding';
import { withTranslation, WithTranslation } from 'react-i18next';
import { Config } from 'config/config';
import { WithConfig } from 'config/config';
import CartPage from 'request/CartPage';
import OverviewPage from 'accession/OverviewPage';
import RequestPage from 'request/RequestPage';
const hashHistory = createHashHistory({});
interface IAppProps extends React.ClassAttributes<any>, WithTranslation {
config: Config;
interface IAppProps extends React.ClassAttributes<any> {
getCountryCodes: (lang: string) => Promise<Record<string, string>>;
}
class App extends React.Component<IAppProps, any> {
class App extends React.Component<IAppProps & WithTranslation & WithConfig, any> {
public componentDidMount() {
const { getCountryCodes, i18n } = this.props;
getCountryCodes(i18n.language);
}
public render() {
const { config } = this.props;
const { apiUrl, request } = config;
const { appConfig: { apiUrl, shoppingCart } } = this.props;
return (
<>
......@@ -39,9 +37,9 @@ class App extends React.Component<IAppProps, any> {
<Route path="/a/:uuid" exact component={ AccessionDetails } />
<Route path="/" exact component={ AccessionList }/>
<Route path="/api-info" exact component={ ApiInfoPage }/>
{ request.enabled && <Route path="/cart/" exact component={ CartPage }/> }
{ shoppingCart.enabled && <Route path="/cart/" exact component={ CartPage }/> }
<Route path="/overview" exact component={ OverviewPage }/>
{ request.enabled && <Route path="/request" exact component={ RequestPage }/> }
{ shoppingCart.enabled && <Route path="/request" exact component={ RequestPage }/> }
<Route component={ NotFound }/>
</Switch>
......@@ -57,7 +55,7 @@ class App extends React.Component<IAppProps, any> {
}
const mapStateToProps = (state) => ({
config: state.appConfig.config,
appConfig: state.appConfig.config,
});
const mapDispatchToProps = (dispatch) => bindActionCreators({
......
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